﻿
var $clist = new Array();

function UICalendar(id)
{
    this.ID = id;
    this.CssClass = "cal_def";
    this.SelectedDate = null;

    this.Days = new Array("Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat");
    this.Months = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
    this.ShortMonth = new Array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec");
    $clist[this.ID] = this;

    this.RenderContent = function(month, year)
    {
        var tbl = document.getElementById(this.ID + "_tbl");
        tbl.outerHTML = this.Render(month, year);
    }

    this.DateAdd = function(addType, sourceDt, val)
    {
        var nMonth = sourceDt.getMonth();
        var nYear = sourceDt.getFullYear();
        var nDay = sourceDt.getDate();

        var retDate = new Date(nYear, nMonth, nDay);
        if (addType == "d") retDate.setDate(retDate.getDate() + val);
        if (addType == "M") retDate.setMonth(retDate.getMonth() + val);
        if (addType == "y") retDate.setFullYear(retDate.getFullYear() + val);
        return retDate;
    }

    this.OnMonthClick = function(month, year)
    {
        this.RenderContent(month, year);
    }

    this.Events = new Array();
    this.HasEvents = function(dt)
    {
        var blRet = false;
        for (var i = 0; i < this.Events.length; i++)
        {
            if (this.Events[i].EventDate.toString() == dt.toString())
            {
                blRet = true;
                break;
            }
        }
        return blRet;
    }
    this.GetEventsSummary = function(dt)
    {
        var retVal = "";
        for (var i = 0; i < this.Events.length; i++)
        {
            if (this.Events[i].EventDate.toString() == dt.toString())
            {
                retVal += this.Events[i].Title + "\n";

            }
        }
        return (retVal);
    }
    this.GetEventsList = function(showdelete)
    {
        var evItem = null;
        var delLinkFormat = "";
        var cntHTML = "<table width='100%' cellpadding='4'>";
        cntHTML += "<colgroup><col width='50px' align='right'/><col/><col/></colgroup>";
        cntHTML += "<tr class='evTitle'><td><div class='icoEvent'></div></td><td>Title</td><td>Description</td>";
        if (showdelete)
        {
            cntHTML += "<td>Action</td>";
            delLinkFormat = "<td><a href='#' onclick=\"return OnDeleteEvent('{0}');\">Delete</a></td>";
        }
        cntHTML += "</tr>";
        var dy = "", delLink = "";
        for (var i = 0; i < cal.Events.length; i++)
        {
            evItem = cal.Events[i];
            dy = evItem.EventDate.getDate();
            dy = (dy < 10 ? "0" + dy : dy);

            delLink = $fs(delLinkFormat, evItem.ID);
            cntHTML += $fs("<tr class='evItem'><td align='right'>{0} {1}</td><td>{2}</td><td>{3}</td>{4}</tr>",
                   this.ShortMonth[evItem.EventDate.getMonth()], dy, evItem.Title, unescape(evItem.Description), delLink);
        }
        if (evItem == null)
            cntHTML += $fs("<tr><td align='center' colspan='3'>No events available</td></tr>");
        cntHTML += "</table>";
        return cntHTML;
    }
    
    this.Render = function(month, year)
    {
        var dtToday = new Date();

        var dtStart = dtToday;
        if (month != null) dtStart.setMonth(month);
        if (year != null) dtStart.setFullYear(year);

        var dtPrevMonth = this.DateAdd("M", dtStart, -1);
        var dtNextMonth = this.DateAdd("M", dtStart, 1);

        var dtMonthStart = new Date(dtStart.toDateString());
        dtMonthStart.setDate(1);

        dtStart.setDate(dtMonthStart.getDate() - dtMonthStart.getDay());

        var dtCur = new Date(dtStart.toDateString());
        var prevMonth, curMonth, nextMonth;

        var curMonthIndex = dtMonthStart.getMonth();
        curMonthIndex--;
        if (curMonthIndex < 0) curMonthIndex = 11;
        prevMonth = this.ShortMonth[curMonthIndex];

        curMonthIndex++;
        if (curMonthIndex >= 12) curMonthIndex = 0;
        curMonth = this.ShortMonth[curMonthIndex];

        curMonthIndex++;
        if (curMonthIndex >= 12) curMonthIndex = 0;
        nextMonth = this.ShortMonth[curMonthIndex];

        var retVal = "";
        retVal += "<table id='" + this.ID + "_tbl' class='" + this.CssClass + "' border='1'><tr>";
        retVal += "<th colspan='2'><a href='#' onclick=\"$clist['" + this.ID + "'].OnMonthClick(" + dtPrevMonth.getMonth() + "," + dtPrevMonth.getFullYear() + ");\">" + prevMonth + "</a></th>";
        retVal += "<th colspan='3'><a href='#' onclick=\"$clist['" + this.ID + "'].OnMonthClick(" + dtMonthStart.getMonth() + "," + dtMonthStart.getFullYear() + ");\">" + curMonth + " " + dtMonthStart.getFullYear() + "</a></th>";
        retVal += "<th colspan='2'><a href='#' onclick=\"$clist['" + this.ID + "'].OnMonthClick(" + dtNextMonth.getMonth() + "," + dtNextMonth.getFullYear() + ");\">" + nextMonth + "</a></th>";
        retVal += "</tr>";
        retVal += "<tr class='dh'>";
        for (var j = 0; j < 7; j++)
        {
            retVal += "<td>" + this.Days[j] + "</td>";
        }
        retVal += "</tr>";

        var mouseEH = "<td "
        + " onmouseover=\"javascript:this.cn=this.className;this.className='cal_hover';$clist['{0}'].OnDateCellMouseOver(new Date('{1}'));\" "
        + " onmouseout=\"javascript:this.className=this.cn;$clist['{0}'].OnDateCellMouseOut(new Date('{1}'));\"; "
        + " onclick=\"$clist['{0}']._OnDateCellClick(new Date('{1}'));\" "
        + " title='{4}' "
        + " {2}>{3}</td>";

        for (var i = 0; i < 6; i++)
        {
            retVal += "<tr>";
            for (var j = 0; j < 7; j++)
            {
                var clsAttr = "", clsName = "";
                if (dtCur.getMonth() != dtMonthStart.getMonth()) clsName = "om";
                if (this.SelectedDate == dtCur) clsName = "seldate";

                if (this.HasEvents(dtCur)) clsName += "he";
                clsAttr = " class='" + clsName + "' ";
                retVal += $fs(mouseEH, this.ID, dtCur.toDateString(), clsAttr, dtCur.getDate(), this.GetEventsSummary(dtCur));
                dtCur.setDate(dtCur.getDate() + 1);
            }
            retVal += "</tr>";
        }
        retVal += "</table>";
        return retVal;
    }

    this._OnDateCellClick = function(dt)
    {
        this.SelectedDate = dt;
        this.OnDateCellClick(dt);
    }

    this.OnDateCellClick = function(dt)
    {
        //alert(dt);
    }

    this.OnDateCellMouseOver = function(dt)
    {
        //window.status = dt;
    }
    this.OnDateCellMouseOut = function(dt)
    {
        //window.status = '';
    }

}
