calendar.js 5.83 KB
/*
calendar.js - Calendar functions by Adrian Holovaty
depends on core.js for utility functions like removeChildren or quickElement
*/

// CalendarNamespace -- Provides a collection of HTML calendar-related helper functions
var CalendarNamespace = {
    monthsOfYear: gettext('January February March April May June July August September October November December').split(' '),
    daysOfWeek: gettext('S M T W T F S').split(' '),
    firstDayOfWeek: parseInt(get_format('FIRST_DAY_OF_WEEK')),
    isLeapYear: function(year) {
        return (((year % 4)==0) && ((year % 100)!=0) || ((year % 400)==0));
    },
    getDaysInMonth: function(month,year) {
        var days;
        if (month==1 || month==3 || month==5 || month==7 || month==8 || month==10 || month==12) {
            days = 31;
        }
        else if (month==4 || month==6 || month==9 || month==11) {
            days = 30;
        }
        else if (month==2 && CalendarNamespace.isLeapYear(year)) {
            days = 29;
        }
        else {
            days = 28;
        }
        return days;
    },
    draw: function(month, year, div_id, callback, selected) { // month = 1-12, year = 1-9999
        var today = new Date();
        var todayDay = today.getDate();
        var todayMonth = today.getMonth()+1;
        var todayYear = today.getFullYear();
        var todayClass = '';

        // Use UTC functions here because the date field does not contain time
        // and using the UTC function variants prevent the local time offset
        // from altering the date, specifically the day field.  For example:
        //
        // ```
        // var x = new Date('2013-10-02');
        // var day = x.getDate();
        // ```
        //
        // The day variable above will be 1 instead of 2 in, say, US Pacific time
        // zone.
        var isSelectedMonth = false;
        if (typeof selected != 'undefined') {
            isSelectedMonth = (selected.getUTCFullYear() == year && (selected.getUTCMonth()+1) == month);
        }

        month = parseInt(month);
        year = parseInt(year);
        var calDiv = document.getElementById(div_id);
        removeChildren(calDiv);
        var calTable = document.createElement('table');
        quickElement('caption', calTable, CalendarNamespace.monthsOfYear[month-1] + ' ' + year);
        var tableBody = quickElement('tbody', calTable);

        // Draw days-of-week header
        var tableRow = quickElement('tr', tableBody);
        for (var i = 0; i < 7; i++) {
            quickElement('th', tableRow, CalendarNamespace.daysOfWeek[(i + CalendarNamespace.firstDayOfWeek) % 7]);
        }

        var startingPos = new Date(year, month-1, 1 - CalendarNamespace.firstDayOfWeek).getDay();
        var days = CalendarNamespace.getDaysInMonth(month, year);

        // Draw blanks before first of month
        tableRow = quickElement('tr', tableBody);
        for (var i = 0; i < startingPos; i++) {
            var _cell = quickElement('td', tableRow, ' ');
            _cell.className = "nonday";
        }

        // Draw days of month
        var currentDay = 1;
        for (var i = startingPos; currentDay <= days; i++) {
            if (i%7 == 0 && currentDay != 1) {
                tableRow = quickElement('tr', tableBody);
            }
            if ((currentDay==todayDay) && (month==todayMonth) && (year==todayYear)) {
                todayClass='today';
            } else {
                todayClass='';
            }

            // use UTC function; see above for explanation.
            if (isSelectedMonth && currentDay == selected.getUTCDate()) {
                if (todayClass != '') todayClass += " ";
                todayClass += "selected";
            }

            var cell = quickElement('td', tableRow, '', 'class', todayClass);

            quickElement('a', cell, currentDay, 'href', 'javascript:void(' + callback + '('+year+','+month+','+currentDay+'));');
            currentDay++;
        }

        // Draw blanks after end of month (optional, but makes for valid code)
        while (tableRow.childNodes.length < 7) {
            var _cell = quickElement('td', tableRow, ' ');
            _cell.className = "nonday";
        }

        calDiv.appendChild(calTable);
    }
}

// Calendar -- A calendar instance
function Calendar(div_id, callback, selected) {
    // div_id (string) is the ID of the element in which the calendar will
    //     be displayed
    // callback (string) is the name of a JavaScript function that will be
    //     called with the parameters (year, month, day) when a day in the
    //     calendar is clicked
    this.div_id = div_id;
    this.callback = callback;
    this.today = new Date();
    this.currentMonth = this.today.getMonth() + 1;
    this.currentYear = this.today.getFullYear();
    if (typeof selected != 'undefined') {
        this.selected = selected;
    }
}
Calendar.prototype = {
    drawCurrent: function() {
        CalendarNamespace.draw(this.currentMonth, this.currentYear, this.div_id, this.callback, this.selected);
    },
    drawDate: function(month, year, selected) {
        this.currentMonth = month;
        this.currentYear = year;

        if(selected) {
            this.selected = selected;
        }

        this.drawCurrent();
    },
    drawPreviousMonth: function() {
        if (this.currentMonth == 1) {
            this.currentMonth = 12;
            this.currentYear--;
        }
        else {
            this.currentMonth--;
        }
        this.drawCurrent();
    },
    drawNextMonth: function() {
        if (this.currentMonth == 12) {
            this.currentMonth = 1;
            this.currentYear++;
        }
        else {
            this.currentMonth++;
        }
        this.drawCurrent();
    },
    drawPreviousYear: function() {
        this.currentYear--;
        this.drawCurrent();
    },
    drawNextYear: function() {
        this.currentYear++;
        this.drawCurrent();
    }
}