var calendar = null;
var isFocus = false;

var offsetX = 0;
var offsetY = 0;

//
// Select date
//
function SelectDate(obj, strFormat, event, language)
{
    //
    // Initialize calender
    //
    var date = new Date();
    var startYear = date.getFullYear() - 50;
    var endYear = date.getFullYear() + 10;
    if (null === calendar)
    {
        calendar = new Calendar(startYear, endYear, language, strFormat);
    }
    
    //
    // Show calender
    //
    calendar.show(obj, event);
}

//
// Convert date in required format
//
String.prototype.toDate = function(style)
{
    //
    // Get year, month and day
    //
    var date = new Date();
    var year = this.substring(style.indexOf('y'), style.lastIndexOf('y') + 1);
    var month = this.substring(style.indexOf('M'), style.lastIndexOf('M') + 1);
    var day = this.substring(style.indexOf('d'), style.lastIndexOf('d') + 1);
    if (isNaN(year))
    {
        year = date.getFullYear();
    }
    if (isNaN(month))
    {
        month = date.getMonth() + 2;
    }
    if (isNaN(day))
    {
        day = date.getDate();
    }

    //
    // Convert
    //
    var tempStr = "";
    eval("tempStr = new Date('" + year + "', '" + (month - 1) + "', '" + day + "')");
    return tempStr;
};

//
// Format date
//
Date.prototype.format = function(style) {
    var o = {
        "M+" : this.getMonth() + 1,
        "d+" : this.getDate(),
        "h+" : this.getHours(),
        "m+" : this.getMinutes(),
        "s+" : this.getSeconds(),
        "w+" : "日一二三四五六".charAt(this.getDay()),
        "q+" : Math.floor((this.getMonth() + 3) / 3),
        "S"  : this.getMilliseconds()
    };
    
    if (/(y+)/.test(style))
    {
        style = style.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    }
    for (var k in o)
    {
        if (new RegExp("(" + k + ")").test(style))
        {
            style = style.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
        }
    }
    return style;
};

//
// Calender class
//
function Calendar(startYear, endYear, language, dateFormatStyle)
{
    //
    // Initialize parameters
    //
    this.startYear = 2008;
    this.endYear = 2020;
    this.language = 0;
    this.dateFormatStyle = "yyyy-MM-dd";
    
    //
    // Update start and end year
    //
    if ((startYear !== null) && (endYear !== null))
    {
        this.startYear = startYear;
        this.endYear = endYear;
    }
    
    //
    // Update language
    //
    if (language !== null)
    {
        this.language = language;
    }
    
    //
    // Update date format
    //
    if (dateFormatStyle !== null)
    {
        this.dateFormatStyle = dateFormatStyle;
    }
    
    this.dateControl = null;
    this.panel = this.getElementById("calendarPanel");
    this.container = this.getElementById("ContainerPanel");
    this.form = null;
    
    this.date = new Date();
    this.year = this.date.getFullYear();
    this.month = this.date.getMonth();

    this.colors = {
        "cur_word"      : "#FFFFFF",  //当日日期文字颜色
        "cur_bg"        : "#6fdbe5",  //当日日期单元格背影色
        "sel_bg"        : "#FFCCCC",  //已被选择的日期单元格背影色
        "sun_word"      : "#FF0000",  //星期天文字颜色
        "sat_word"      : "#0000FF",  //星期六文字颜色
        "td_word_light" : "#333333",  //单元格文字颜色
        "td_word_dark"  : "#CCCCCC",  //单元格文字暗色
        "td_bg_out"     : "#C8E7F0",  //单元格背影色
        "td_bg_over"    : "#FFCC00",  //单元格背影色
        "tr_word"       : "#FFFFFF",  //日历头文字颜色
        "tr_bg"         : "#0094b3",  //日历头背影色
        "input_border"  : "#CCCCCC",  //input控件的边框颜色
        "input_bg"      : "#EEFCFF"   //input控件的背影色
    };
    
    this.draw();
    this.bindYear();
    this.bindMonth();
    this.changeSelect();
    this.bindData();
}

//
// Calender language class
//
Calendar.language = {
  "year"   : [[""], [""]],
  "months" : [["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],
              ["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"]],
  "weeks"  : [["日","一","二","三","四","五","六"],
              ["SUN","MON","TUE","WED","THU","FRI","SAT"]],
  "clear"  : [["清空"], ["CLS"]],
  "today"  : [["今天"], ["TODAY"]],
  "close"  : [["关闭"], ["CLOSE"]]
};

//
// Draw calendar
//
Calendar.prototype.draw = function() {
    //
    // Get calendar object
    //
    calendar = this;
    
    //
    // Generate html code
    //
    var i = 0;
    var j = 0;
    var mvAry = [];
    mvAry[mvAry.length] = '<div name="calendarForm" style="margin: 0px;">';
    mvAry[mvAry.length] = '    <table width="100%" border="0" cellpadding="2" cellspacing="1" bgcolor="#C8E7F0" class="text">';
    mvAry[mvAry.length] = '        <tr bgcolor="#EEFCFF">';
    mvAry[mvAry.length] = '            <th align="left" width="1%"><input style="border: 1px solid ' + calendar.colors["input_border"] + ';background-color:' + calendar.colors["input_bg"] + ';width:16px;height:20px;" name="prevMonth" type="button" id="prevMonth" value="&lt;" /></th>';
    mvAry[mvAry.length] = '            <th align="center" width="98%" nowrap="nowrap"><select name="calendarYear" id="calendarYear" style="font-size:12px;"></select><select name="calendarMonth" id="calendarMonth" style="font-size:12px;"></select></th>';
    mvAry[mvAry.length] = '            <th align="right" width="1%"><input style="border: 1px solid ' + calendar.colors["input_border"] + ';background-color:' + calendar.colors["input_bg"] + ';width:16px;height:20px;" name="nextMonth" type="button" id="nextMonth" value="&gt;" /></th>';
    mvAry[mvAry.length] = '        </tr>';
    mvAry[mvAry.length] = '    </table>';
    mvAry[mvAry.length] = '    <table id="calendarTable" width="100%" style="border:0px solid #CCCCCC;background-color:#EEFCFF" border="0" cellpadding="3" cellspacing="1">';
    mvAry[mvAry.length] = '        <tr>';
    if (1 == this.language)
    {
        for (i = 0; i < 7; i += 1)
        {
            mvAry[mvAry.length] = '            <th style="font-size:8px;font-weight:normal;background-color:' + calendar.colors["tr_bg"] + ';color:' + calendar.colors["tr_word"] + ';">' + Calendar.language["weeks"][this.language][i] + '</th>';
        }
    }
    else
    {
        for (i = 0; i < 7; i += 1)
        {
            mvAry[mvAry.length] = '            <th style="font-weight:normal;background-color:' + calendar.colors["tr_bg"] + ';color:' + calendar.colors["tr_word"] + ';">' + Calendar.language["weeks"][this.language][i] + '</th>';
        }
    }
    mvAry[mvAry.length] = '        </tr>';
    for (i = 0; i < 6; i += 1)
    {
        mvAry[mvAry.length] = '        <tr align="center">';
        for (j = 0; j < 7; j += 1)
        {
            if (0 === j)
            {
                mvAry[mvAry.length] = '            <td style="cursor: default; color: ' + calendar.colors["sun_word"] + ';"></td>';
            }
            else if(6 === j)
            {
                mvAry[mvAry.length] = '            <td style="cursor: default; color: ' + calendar.colors["sat_word"] + ';"></td>';
            }
            else
            {
                mvAry[mvAry.length] = '            <td style="cursor: default;"></td>';
            }
        }
        mvAry[mvAry.length] = '        </tr>';
    }
    mvAry[mvAry.length] = '        <tr style="background-color: ' + calendar.colors["input_bg"] + ';">';
    mvAry[mvAry.length] = '            <th colspan="2" style="display: none"><input name="calendarClear" type="button" id="calendarClear" value="' + Calendar.language["clear"][this.language] + '" style="border: 1px solid ' + calendar.colors["input_border"] + ';background-color:' + calendar.colors["input_bg"] + ';width:100%;height:20px;font-size:12px;"/></th>';
    mvAry[mvAry.length] = '            <th colspan="3" style="display: none"><input name="calendarToday" type="button" id="calendarToday" value="' + Calendar.language["today"][this.language] + '" style="border: 1px solid ' + calendar.colors["input_border"] + ';background-color:' + calendar.colors["input_bg"] + ';width:100%;height:20px;font-size:12px;"/></th>';
    mvAry[mvAry.length] = '            <th colspan="7"><input name="calendarClose" type="button" id="calendarClose" value="' + Calendar.language["close"][this.language] + '" style="border: 1px solid ' + calendar.colors["input_border"] + ';background-color:' + calendar.colors["input_bg"] + ';width:100%;height:20px;font-size:12px;"/></th>';
    mvAry[mvAry.length] = '        </tr>';
    mvAry[mvAry.length] = '    </table>';
    mvAry[mvAry.length] = '</div>';
    this.panel.innerHTML = mvAry.join("");
    
    //
    // Set control event
    //
    var obj;

    obj = this.getElementById("prevMonth");
    obj.onclick = function() {calendar.goPrevMonth(calendar);};
    obj.onblur = function() {calendar.onblur();};
    this.prevMonth= obj;
    
    obj = this.getElementById("nextMonth");
    obj.onclick = function() {calendar.goNextMonth(calendar);};
    obj.onblur = function() {calendar.onblur();};
    this.nextMonth= obj;

    obj = this.getElementById("calendarClear");
    obj.onclick = function() {calendar.dateControl.value = ""; calendar.hide();};
    this.calendarClear = obj;
    
    obj = this.getElementById("calendarClose");
    obj.onclick = function() {calendar.hide();};
    this.calendarClose = obj;
    
    obj = this.getElementById("calendarYear");
    obj.onchange = function() {calendar.update(calendar);};
    obj.onblur = function() {calendar.onblur();};
    this.calendarYear = obj;
    
    obj = this.getElementById("calendarMonth");
    obj.onchange = function() {calendar.update(calendar);};
    obj.onblur = function() {calendar.onblur();};
    this.calendarMonth = obj;
    
    obj = this.getElementById("calendarToday");
    obj.onclick = function()
    {
        var today = new Date();
        calendar.date = today;
        calendar.year = today.getFullYear();
        calendar.month = today.getMonth();
        calendar.changeSelect();
        calendar.bindData();
        calendar.dateControl.value = today.format(calendar.dateFormatStyle);
        calendar.hide();
    };
    this.calendarToday = obj;
};

//
// Bind year
//
Calendar.prototype.bindYear = function()
{
    var i = 0;
    var objCalendarYear = this.calendarYear;

    objCalendarYear.length = 0;
    for (i = this.startYear; i <= this.endYear; i += 1)
    {
        objCalendarYear.options[objCalendarYear.length] = new Option(i + Calendar.language["year"][this.language], i);
    }
};

//
// Bind month
//
Calendar.prototype.bindMonth = function()
{
    var i = 0;
    var objCalendarMonth = this.calendarMonth;
    
    objCalendarMonth.length = 0;
    for (i = 0; i < 12; i += 1)
    {
        objCalendarMonth.options[objCalendarMonth.length] = new Option(Calendar.language["months"][this.language][i], i);
    }
};

//
// Previous month
//
Calendar.prototype.goPrevMonth = function(e)
{
    if ((this.startYear === this.year) && (0 === this.month))
    {
        return;
    }
    this.month -= 1;
    if (-1 == this.month)
    {
        this.year -= 1;
        this.month = 11;
    }
    this.date = new Date(this.year, this.month, 1);
    this.changeSelect();
    this.bindData();
};

//
// Next month
//
Calendar.prototype.goNextMonth = function(e)
{
    if ((this.endYear === this.year) && (11 == this.month))
    {
        return;
    }
    this.month += 1;
    if (12 == this.month)
    {
        this.year += 1;
        this.month = 0;
    }
    this.date = new Date(this.year, this.month, 1);
    this.changeSelect();
    this.bindData();
};

//
// Change selection
//
Calendar.prototype.changeSelect = function()
{
    var i = 0;
    var objCalendarYear = this.calendarYear;
    var objCalendarMonth = this.calendarMonth;

    for (i = 0; i < objCalendarYear.length; i += 1)
    {
        if (this.date.getFullYear() == objCalendarYear.options[i].value)
        {
            objCalendarYear[i].selected = true;
            break;
        }
    }
    for (i = 0; i < objCalendarMonth.length; i += 1)
    {
        if (this.date.getMonth() == objCalendarMonth.options[i].value)
        {
            objCalendarMonth[i].selected = true;
            break;
        }
    }
};

//
// Update
//
Calendar.prototype.update = function(e)
{
    this.year = e.calendarYear.options[e.calendarYear.selectedIndex].value;
    this.month = e.calendarMonth.options[e.calendarMonth.selectedIndex].value;
    this.date = new Date(this.year, this.month, 1);
    this.changeSelect();
    this.bindData();
};

//
// Bind date
//
Calendar.prototype.bindData = function()
{
    var i = 0;
    var calendar = this;
    var dateArray = this.getMonthViewArray(this.date.getYear(), this.date.getMonth());
    var tds = this.getElementById("calendarTable").getElementsByTagName("td");

    for (i = 0; i < tds.length; i += 1)
    {
        tds[i].style.backgroundColor = calendar.colors["td_bg_out"];
        tds[i].onclick = function() {return;};
        tds[i].onmouseover = function() {return;};
        tds[i].onmouseout = function() {return;};
        if (i > (dateArray.length - 1))
        {
            break;
        }
        tds[i].innerHTML = dateArray[i];
        if (dateArray[i] != "&nbsp;")
        {
            tds[i].onclick = function()
            {
                if (calendar.dateControl !== null)
                {
                    calendar.dateControl.value = new Date(calendar.date.getFullYear(), calendar.date.getMonth(), this.innerHTML).format(calendar.dateFormatStyle);
                }
                calendar.hide();
            };
            tds[i].onmouseover = function() {this.style.backgroundColor = calendar.colors["td_bg_over"];};
            tds[i].onmouseout = function() {this.style.backgroundColor = calendar.colors["td_bg_out"];};
            
            //
            // Set today
            //
            if (new Date().format(calendar.dateFormatStyle) == new Date(calendar.date.getFullYear(), calendar.date.getMonth(), dateArray[i]).format(calendar.dateFormatStyle))
            {
                tds[i].style.backgroundColor = calendar.colors["cur_bg"];
                tds[i].onmouseover = function() {this.style.backgroundColor = calendar.colors["td_bg_over"];};
                tds[i].onmouseout = function() {this.style.backgroundColor = calendar.colors["cur_bg"];};
            }
      
            //
            // Set selected date
            //
            if ((calendar.dateControl !== null) && (calendar.dateControl.value == new Date(calendar.date.getFullYear(), calendar.date.getMonth(), dateArray[i]).format(calendar.dateFormatStyle)))
            {
                tds[i].style.backgroundColor = calendar.colors["sel_bg"];
                tds[i].onmouseover = function() {this.style.backgroundColor = calendar.colors["td_bg_over"];};
                tds[i].onmouseout = function() {this.style.backgroundColor = calendar.colors["sel_bg"];};
            }
        }
    }
};

//
// Get month view
//
Calendar.prototype.getMonthViewArray = function (year, month)
{
    var i = 0;
    var mvArray = [];
    var dayOfFirstDay = new Date(year, month, 1).getDay();
    var daysOfMonth = new Date(year, month + 1, 0).getDate();
    
    for (i = 0; i < 42; i += 1)
    {
        mvArray[i] = "&nbsp;";
    }
    for (i = 0; i < daysOfMonth; i += 1)
    {
        mvArray[i + dayOfFirstDay] = i + 1;
    }
    return mvArray;
};

//
// Rewrite "getElementById" to adapt different browser
//
Calendar.prototype.getElementById = function(id)
{
    if ((typeof(id) != "string") || ("" == id))
    {
        return null;
    }
    if (document.getElementById)
    {
        return document.getElementById(id);
    }
    if (document.all)
    {
        return document.all(id);
    }
    try
    {
        return eval(id);
    }
    catch(e)
    {
        return null;
    }
};

//
// Rewrite "getElementsByTagName" to adapt different browser
//
Calendar.prototype.getElementsByTagName = function(object, tagName)
{
    if (document.getElementsByTagName)
    {
        return document.getElementsByTagName(tagName);
    }
    if (document.all)
    {
        return document.all.tags(tagName);
    }
};

//
// Get absolute point
//
Calendar.prototype.getAbsPoint = function(event)
{
    var absX = 0;
    var absY = 0;
    
    if (window.pageXOffset)
    {
        absX = window.pageXOffset;
    }
    else if (document.documentElement && document.documentElement.scrollLeft)
    {
        absX = document.documentElement.scrollLeft;
    }
    else if (document.body)
    {
        absX = document.body.scrollLeft;
    }
    absX += event.x;

    if (window.pageYOffset)
    {
        absY = window.pageYOffset;
    }
    else if (document.documentElement && document.documentElement.scrollTop)
    {
        absY = document.documentElement.scrollTop;
    }
    else if (document.body)
    {
        absY = document.body.scrollTop;
    }
    absY += event.y;
    
    return {"x": absX, "y": absY};
};

//
// Show calendar
//
Calendar.prototype.show = function (dateObj, event) {
    if (null === dateObj)
    {
        throw new Error("arguments[0] is necessary");
    }
    this.dateControl = dateObj;
    
    this.date = (dateObj.value.length > 0) ? new Date(dateObj.value.toDate(this.dateFormatStyle)) : new Date();
    this.year = this.date.getFullYear();
    this.month = this.date.getMonth();
    this.changeSelect();
    this.bindData();

    var xy = this.getAbsPoint(event);
    this.panel.style.left = xy.x + offsetX + "px";
    this.panel.style.top = xy.y + offsetY + "px";

    this.panel.style.display = "";
    this.container.style.display = "";
    
    dateObj.onblur = function() {calendar.onblur();};
    this.container.onmouseover = function() {isFocus=true;};
    this.container.onmouseout = function() {isFocus=false;};
};

//
// Hide calendar
//
Calendar.prototype.hide = function()
{
    this.panel.style.display = "none";
    this.container.style.display = "none";
    isFocus = false;
    
    if (document.getElementById("carInsuranceInfo") !== null)
    {
        UpdateInsuranceDate();
    }
};

//
// Hide calendar when blur
Calendar.prototype.onblur = function()
{
    if (!isFocus)
    {
        this.hide();
    }
};

document.write('<div id="ContainerPanel" style="display:none"><div id="calendarPanel" style="position: absolute;display: none;z-index: 9999;');
document.write('background-color: #FFFFFF;border: 1px solid #CCCCCC;width:175px;font-size:12px;"></div>');
if(document.all)
{
    document.write('<iframe style="position:absolute;z-index:2000;width:expression(this.previousSibling.offsetWidth);');
    document.write('height:expression(this.previousSibling.offsetHeight);');
    document.write('left:expression(this.previousSibling.offsetLeft);top:expression(this.previousSibling.offsetTop);');
    document.write('display:expression(this.previousSibling.style.display);" scrolling="no" frameborder="no"></iframe>');
}
document.write('</div>');
