$(function() {
    var dayOfWeekTable = ['日', '月', '火', '水', '木', '金', '土'];
    var tdClassTable = ['cSun', 'cMon', 'cTue', 'cWed', 'cThu', 'cFri', 'cSat'];

    function update(targetSelector, year, month, callback) {
      var target = $(targetSelector);
        $.getJSON('/json/holiday_calendar', {
            year  : year,
            month : month
        }, function(data) {
            var ul = $('<ul />');
            ul.append('<li>' + year + '年' + month + '月</li>');
            target.append(ul);

            var table = $('<table cellspacing="0" summary="営業日カレンダー" />');
            (function() {
                var tr = $('<tr />');
                for (var i = 0; i < 7; i++) {
                    var th = $('<th />');
                    th.addClass(tdClassTable[i]);
                    th.text(dayOfWeekTable[i]);
                    tr.append(th);
                }
                table.append(tr);
            })();

            for (var j = 0; j < data.length; j++) {
                var tr = $('<tr />');
                for (var i = 0; i < data[j].length; i++) {
                    var day = data[j][i];
                    var td = $('<td />');
                    td.addClass(tdClassTable[i]);
                    if (day.day) {
                        td.text(day.day);
                        td.addClass(day.holiday ? 'holiday' : 'bizday');
                    } else {
                        td.html('&nbsp;');
                    }
                    tr.append(td);
                }
                table.append(tr);
            }
            target.append(table);

            if (callback instanceof Function) {
                callback();
            }
        });
    }

    var today = new Date();
    var year = today.getFullYear();
    var month = today.getMonth() + 1;

    update('#calendar', year, month);

    function showAppend(targetSelector, year, month) {
        var target = $(targetSelector);
        var a = $('<a href="javascript:void(0)">&raquo; ' + year + '年' + month + '月を見る</a>');
        a.click(function() {
            target.slideUp();
            target.empty();
            update(target, year, month, function() {
                target.slideDown();
            });
        });
        target.append($('<div style="text-align:left" />').append(a));
    }

    month++;
    if (12 < month) {
        year++;
        month = 1;
    }
    update('#next_calendar', year, month);

    month++;
    if (12 < month) {
        year++;
        month = 1;
    }
    showAppend('#next_next_calendar', year, month);

});