function on_error(args) {

}
function Calander(ownerID) {

    this.date = new Date()
    this.owner = document.getElementById(ownerID)
    this.ownerID = ownerID
    this.Table = null
    this.Time = null
    this.TableBody = null
    this.vMonth = null
    this.prev = null
    this.next = null
    this.Rows = new Array()
    this.TimeObj = null
    this.CreateMain = Calander_CreateMain;
    this.SelectedDate = Calander_SelectedDate;
    this.UpdateSelected = Calander_UpdateSelected;
    this.Clear = Calander_Clear;
    this.Fill = Calander_Fill;
    this.CreateMain()
    this.Update = Calander_Update;

    this.selDate = null
    this.selObj = null

}

function Calander_UpdateSelected() {
    if (this.selObj != null) {
        var sdate = new Date(this.selDate).getMonth()
        var cdate = this.date.getMonth()
        if (sdate == cdate) {
            this.selObj.style.backgroundColor = "#FFFBBF"
        } else {
            this.selObj.style.backgroundColor = "#ffffff"
        }
    }

}

function NextMonth() {
    //this.owner.Clear()
    this.owner.date = this.owner.date.add("mo", 1)
    this.owner.Update()

    this.owner.UpdateSelected()

}

function PrevMonth() {
    //this.owner.Clear()
    this.owner.date = this.owner.date.add("mo", -1)
    this.owner.Update()

    this.owner.UpdateSelected()

}

function Calander_SelectedDate() {

    if (this.owner.selObj != null) {
        this.owner.selObj.style.backgroundColor = "#ffffff"
    }
    this.style.backgroundColor = "#FFFBBF"
    this.owner.selDate = this.date
    this.owner.selObj = this

    var s = document.getElementById(this.owner.ownerID + '-sel')
    s.style.borderTop = "thin ridge"
    s.innerHTML = this.owner.selDate.getDate() + ' ' + Months[this.owner.selDate.getMonth()] + ' ' + this.owner.selDate.getYear()
    
    this.owner.selDateTxt = s.innerHTML

}

function createNew(id) {

    var nd = document.getElementById(id);
    var rows = nd.getElementsByTagName('tr');


    var calNew = document.getElementById("calNew");
    calNew.style.visibility = "visible";
    calNew.innerHTML = ""; // ReCreate

    var t = document.createElement('table');
    t.cellSpacing = "0";
    t.cellPadding = "0";
    t.style.height = "400px";

    calNew.appendChild(t);
    var tb = document.createElement('tbody');
    t.appendChild(tb);

    // close bar
    var tr = document.createElement('tr');
    tb.appendChild(tr);
    var td = document.createElement('td');
    tr.appendChild(td);
    td.colSpan = 3;
    td.style.width = "100%";
    td.style.height = "10px";
    td.style.backgroundColor = '#006699';
    td.onclick = function() {
        var calNew = document.getElementById("calNew"); calNew.style.visibility = 'hidden';
    };

    // days events in short
    var tr = document.createElement('tr');

    tb.appendChild(tr);
    var td = document.createElement('td');
    td.colSpan = 3;
    td.style.height = "30px";
    tr.appendChild(td);


    var te = document.createElement('table');
    te.className = "calNewEvents";
    td.appendChild(te);
    var tbe = document.createElement('tbody');
    te.appendChild(tbe);

    for (var i = 0; i < rows.length; i++) {
        var tre = document.createElement('tr');
        tre.style.height = "30px";
        tbe.appendChild(tre);
        tre.data = rows[i].data;
        tre.onclick = loadEvent;

        var tde = document.createElement('td');
        tde.style.height = "30px";
        tre.appendChild(tde);
        tde.innerHTML = rows[i].data.Name;

    }



    // event Name
    var tr = document.createElement('tr');
    tb.appendChild(tr);
    var td = document.createElement('td');
    tr.appendChild(td);
    td.innerHTML = "Event:";

    var td = document.createElement('td');
    tr.appendChild(td);
    td.colSpan = 2;
    var txt = document.createElement('input');
    txt.style.width = "200px";
    txt.type = "text";
    txt.disabled = "true";
    txt.id = "txtEvent";
    txt.className = "disabled";

    td.appendChild(txt);


    // date
    var tr = document.createElement('tr');
    tb.appendChild(tr);

    var td = document.createElement('td');
    tr.appendChild(td);
    td.innerHTML = "Date:";

    var td = document.createElement('td');
    tr.appendChild(td);
    td.colSpan = 2;
    var txt = document.createElement('input');
    txt.type = "text";
    txt.disabled = "true";
    txt.id = "txtDate";
    txt.className = "disabled";
    td.appendChild(txt);

    // time
    var tr = document.createElement('tr');
    tb.appendChild(tr);

    var td = document.createElement('td');
    tr.appendChild(td);
    td.innerHTML = "Time:";

    var td = document.createElement('td');
    tr.appendChild(td);
    td.colSpan = 2;
    var txt = document.createElement('input');
    txt.type = "text";
    txt.disabled = "true";
    txt.id = "txtTime";
    txt.className = "disabled";
    td.appendChild(txt);

    // description
    var tr = document.createElement('tr');
    tb.appendChild(tr);

    var td = document.createElement('td');
    tr.appendChild(td);
    td.innerHTML = "Description:";

    var td = document.createElement('td');
    tr.appendChild(td);
    td.colSpan = 2;
    var txt = document.createElement('textarea');
    txt.rows = "6";
    txt.disabled = "true";
    txt.id = "txtDescription";
    txt.className = "disabled";
    td.appendChild(txt);

    // btns
    var tr = document.createElement('tr');
    tb.appendChild(tr);

    var td = document.createElement('td');
    tr.appendChild(td);

    var btn = document.createElement('input');
    btn.type = 'button';
    btn.value = 'Add New';
    btn.onclick = addNew_Click;
    td.appendChild(btn);
    td.colSpan = "1";

    var td = document.createElement('td');
    td.style.textAlign = 'center';
    tr.appendChild(td);

    var btn = document.createElement('input');
    btn.type = 'button';
    btn.value = 'Cancel';
    td.appendChild(btn);
    td.colSpan = "1";

    var td = document.createElement('td');
    td.style.textAlign = 'right';
    tr.appendChild(td);

    var btn = document.createElement('input');
    btn.type = 'button';
    btn.value = 'Save';
    btn.onclick = save_click;
    td.appendChild(btn);
    td.colSpan = "1";

    txtEvent = document.getElementById('txtEvent');
    txtDate = document.getElementById('txtDate');
    txtTime = document.getElementById('txtTime');
    txtDescription = document.getElementById('txtDescription');
}
var selectedRow;
function loadEvent(args) {
    var row = event.srcElement.parentElement;
    selectedRow = row;

    txtEvent.value = selectedRow.data.Name;
    txtDescription.value = selectedRow.data.Description;
    txtTime.value = selectedRow.data.EventDate.format('HH:mm');
    txtDate.value = selectedRow.data.EventDate.format('dd/MM/yyyy');

    txtEvent.className = "enabled";
    txtDate.className = "enabled";
    txtTime.className = "enabled";
    txtDescription.className = "enabled";

    txtEvent.disabled = false;
    txtDate.disabled = false;
    txtTime.disabled = false;
    txtDescription.disabled = false;

}
function addNew_Click(args) {

    txtEvent.disabled = false;
    txtDate.disabled = false;
    txtTime.disabled = false;
    txtDescription.disabled = false;

    txtEvent.value = '';
    txtDate.value = '';
    txtTime.value = '';
    txtDescription.value = '';

    txtEvent.className = "enabled";
    txtDate.className = "enabled";
    txtTime.className = "enabled";
    txtDescription.className = "enabled";
    isNew = true;

}

function save_click(args) {
    if (isNew) {
        if (txtTime.value == '') {
            txtTime.value = '00:00';
        }
        BadService.BadServ.saveEvents(-1, txtEvent.value, txtDescription.value, txtDate.value, txtTime.value, on_Complete_saveEvents, on_error, on_error)

    } else {
        if (txtTime.value == '') {
            txtTime.value = '00:00';
        }
        BadService.BadServ.saveEvents(selectedRow.data.id, txtEvent.value, txtDescription.value, txtDate.value, txtTime.value, on_Complete_saveEvents, on_error, on_error)

    }
}
function on_Complete_saveEvents(args) {



}

function Calander_CreateMain() {
    var ndt = document.createElement("TABLE");
    this.Table = ndt
    ndt.className = "calander";
    this.owner.appendChild(ndt)
    ndt.cellPadding = 0;
    ndt.style.borderLeft = "thin ridge"
    ndt.style.borderRight = "thin ridge"
    ndt.style.borderTop = "thin ridge"
    ndt.style.borderBottom = "thin ridge"
    ndt.cellSpacing = 0;
    ndt.style.borderWidth = 2;

    var ndtb = document.createElement("tbody");
    this.TableBody = ndtb
    ndt.appendChild(ndtb);

    var ColWidth = "106px"

    //Top Row..
    var ndr = document.createElement("tr");
    ndr.className = "calHeader";
    ndtb.appendChild(ndr)

    //ndr.style.backgroundColor="#9f5331"


    var ndd = document.createElement("td");
    ndr.appendChild(ndd)
    ndd.id = this.ownerID + "PrevMonth"
    ndd.onmouseover = mOvermth
    ndd.owner = this
    ndd.onclick = PrevMonth
    var img = document.createElement("Img");
    img.src = "../Menu/prev.png";
    ndd.appendChild(img);

    var ndd = document.createElement("td");
    ndr.appendChild(ndd)
    ndd.id = this.ownerID + "MonthName"
    this.vMonth = ndd
    ndd.colSpan = 5
    ndd.owner = this
    ndd.innerHTML = Months[this.date.getMonth()] + ' ' + this.date.getYear()

    var ndd = document.createElement("td");
    ndr.appendChild(ndd)
    ndd.id = this.ownerID + "NextMonth"
    ndd.onmouseover = mOvermth
    ndd.owner = this
    ndd.onclick = NextMonth
    var img = document.createElement("Img");
    img.src = "../Menu/next.png";
    ndd.align = "right";
    ndd.appendChild(img);


    var ndr = document.createElement("tr");
    ndr.style.backgroundColor = "#fbc94b"
    ndtb.appendChild(ndr)

    var ndd = document.createElement("td");
    ndr.appendChild(ndd)
    ndd.width = ColWidth
    ndd.innerHTML = "Mon"


    var ndd = document.createElement("td");
    ndd.width = ColWidth
    ndd.innerHTML = "Tue"
    ndr.appendChild(ndd)

    var ndd = document.createElement("td");
    ndd.width = ColWidth
    ndd.innerHTML = "Wed"
    ndr.appendChild(ndd)

    var ndd = document.createElement("td");
    ndd.width = ColWidth
    ndd.innerHTML = "Thu"
    ndr.appendChild(ndd)

    var ndd = document.createElement("td");
    ndd.width = ColWidth
    ndd.innerHTML = "Fri"
    ndr.appendChild(ndd)

    var ndd = document.createElement("td");
    ndd.width = ColWidth
    ndd.innerHTML = "Sat"
    ndr.appendChild(ndd)

    var ndd = document.createElement("td");
    ndd.width = ColWidth
    ndd.innerHTML = "Sun"
    ndr.appendChild(ndd)

}

function Calander_Clear() {
    for (cou = 0; cou < 6; cou++) {
        this.TableBody.removeChild(this.Rows[cou])
    }
}

function on_Complete_GetEvents(args) {

    for (cou = 0; cou < 6; cou++) {
        var ndr = document.getElementById(this.ownerID + '-' + cou);

        this.Rows[cou] = ndr

        for (cou2 = 0; cou2 < 7; cou2++) {
            var ndd = document.getElementById(this.ownerID + cou + '-' + cou2);
            add_Event(args, ndd, ndd.date);
        }
    }
}
function showTip(e) {

    if ($("#ttip")[0] == null) {
        var d = document.createElement("DIV")
        d.id = "ttip";
        calender.appendChild(d);
    }

    $("#ttip")[0].style.left = event.x + 20;
    $("#ttip")[0].style.top = event.y + 20;

    if ($("#ttip").find("table").length != 0) {
        $("#ttip").find("table").remove();
    }
    var t = document.createElement("Table");
    var tb = document.createElement("tbody");
    var tr = document.createElement("tr");
    t.appendChild(tb);
    t.cellPadding = 0;
    t.cellSpacing = 0;
    tb.appendChild(tr);
    $("#ttip").append(t);


    var td = document.createElement("td");
    tr.appendChild(td);
    tr.className = "noteHeader";
    td.innerHTML = this.data.Name + ' @' + this.data.EventDate.format("HH:mm");

    var tr = document.createElement("tr");
    tb.appendChild(tr);
    var td = document.createElement("td");
    tr.appendChild(td);
    td.innerHTML = this.data.Description;

    $("#ttip")[0].style.position = "absolute";
    $("#ttip").hide();
    $("#ttip").show("fast");
}
function hideTip(e) {

    if ($("#ttip")[0] == null) {
        var d = document.createElement("DIV")
        d.id = "ttip";
        calender.appendChild(d);
    }

    $("#ttip").hide();
}
function showDetail(e) {
    if ($("#txtDetail")[0] == null) {
        var d = document.createElement("DIV")
        d.id = "ttip";
        calender.appendChild(d);
    }

    $("#txtDetail")[0].style.left = event.x + 20;
    $("#txtDetail")[0].style.top = event.y + 20;

    if ($("#txtDetail").find("table").length != 0) {
        $("#txtDetail").find("table").remove();
    }
    var t = document.createElement("Table");
    var tb = document.createElement("tbody");
    var tr = document.createElement("tr");
    t.appendChild(tb);
    t.cellPadding = 0;
    t.cellSpacing = 0;
    tb.appendChild(tr);
    $("#txtDetail").append(t);

    var td = document.createElement("td");
    tr.appendChild(td);
    td.width = "100px";
    td.innerHTML = "Date:"
    td.style.borderRight = "solid 1px #b04f1c";

    td = document.createElement("td");
    tr.appendChild(td);
    td.innerHTML = this.data.EventDate.format("dd/MM/yyyy HH:mm");

    var tr = document.createElement("tr");
    tb.appendChild(tr);
    
    var td = document.createElement("td");
    tr.appendChild(td);
    td.width = "100px";
    td.innerHTML = "Event:"
    td.style.borderRight = "solid 1px #b04f1c";

    td = document.createElement("td");
    tr.appendChild(td);
    td.innerHTML = this.data.Name;

    var tr = document.createElement("tr");
    tb.appendChild(tr);
    td = document.createElement("td");
    tr.appendChild(td);
    td.innerHTML = "Description:"
    td.style.borderRight = "solid 1px #b04f1c";
    
    var td = document.createElement("td");
    tr.appendChild(td);
    td.innerHTML = this.data.Description;


}

function add_Event(args, ndd, date) {
    var t, tb;
    t = ndd.getElementsByTagName('table')[0];
    tb = ndd.getElementsByTagName('TBODY')[0];
    if (tb != null) {
        for (var i = tb.children.length - 1; i > -1; i--) {
            tb.removeChild(tb.children[i]);
        }

    }


    for (var i = 0; i < args.rows.length; i++) {
        if (args.rows[i].EventDate.format("dd/MM/yy") == date.format("dd/MM/yy")) {
            if (t == null) {
                // Create New Table.. 
                t = document.createElement('table');
                t.className = "events";
                t.cellPadding = "0";
                t.cellSpacing = "0";

                ndd.appendChild(t);
                tb = document.createElement('tbody');
                t.appendChild(tb);


            }
            tr = document.createElement('tr');
            tr.data = args.rows[i];
            tr.onmouseover = showTip;
            tr.onmouseout = hideTip;
            tr.onclick = showDetail;
            tb.appendChild(tr);

            td = document.createElement('td');
            td.style.backgroundImage = "url('../menu/event_left.png')";
            td.style.width = "3px";
            tr.appendChild(td);
            
            td = document.createElement('td');
            tr.appendChild(td);
            td.style.backgroundImage = "url('../menu/event_back.png')";
            td.innerHTML = args.rows[i].Name;

            td = document.createElement('td');
            td.style.width = "3px";
            td.style.backgroundImage = "url('../menu/event_right.png')";
            tr.appendChild(td);

        }
    }

}

function Calander_Update() {




    var ndt = this.Table
    var fireObj
    var ndtb = this.TableBody
    // Now Do Dates.
    var cdate = new Date(this.date)
    var today = this.date
    var bMonth = new Date(today.add("d", (-today.getDate()) + 1))

    var cday = bMonth.getDay()
    if (cday == 0) { cday = cday + 7 }

    var vdate = 0

    var firstdate = new Date(bMonth.add("d", -cday + 1));
    var fdate = new Date(firstdate);


    for (cou = 0; cou < 6; cou++) {
        var ndr = document.getElementById(this.ownerID + '-' + cou);

        this.Rows[cou] = ndr

        for (cou2 = 0; cou2 < 7; cou2++) {
            var ndd = document.getElementById(this.ownerID + cou + '-' + cou2);
            ndd.date = firstdate.format("dd/MM/yy");
            //ndd.innerHTML = firstdate.getDate();
            var div = ndd.getElementsByTagName("DIV")[0];
            div.innerHTML = firstdate.getDate();
            div.style.width = "100%";
            //ndd.appendChild(div);

            if (cdate.toDateString() == firstdate.toDateString()) {
                this.owner.selObj = ndd
                fireObj = ndd

            }
            ndd.date = new Date(firstdate)
            if (ndd.date.toDateString() == new Date().toDateString()) {
                ndd.style.borderLeft = "thin ridge"
                ndd.style.borderRight = "thin ridge"
                ndd.style.borderTop = "thin ridge"
                ndd.style.borderBottom = "thin ridge"
            } else {
                ndd.style.borderLeft = ""
                ndd.style.borderRight = ""
                ndd.style.borderTop = ""
                ndd.style.borderBottom = ""
            }
            if (today.getMonth() != new Date(firstdate).getMonth()) {
                ndd.style.color = "gray"
            } else {
                ndd.style.fontWeight = "bold"
            }

            if (today.getMonth() != new Date(firstdate).getMonth()) {
                ndd.style.color = "gray"
                ndd.style.height = "1px";
                div.innerHTML = "";
                if (cou2 == 0 && cou == 5) {
                    ndr.style.height = "1px";
                }
            } else {
                ndd.style.color = "";
                ndd.style.fontWeight = "bold"
            }

            firstdate = new Date(firstdate.add("d", 1))
            lastdate = firstdate;
        }
    }
    BadService.BadServ.getEvents(fdate.format('MM/dd/yyyy 00:00:00'), firstdate.format('MM/dd/yyyy 00:00:00'), on_Complete_GetEvents, on_error, on_error)

    this.vMonth.innerHTML = Months[this.date.getMonth()] + ' ' + +this.date.getYear()
    this.owner.style.height = ndt.style.height
    this.owner.style.width = ndt.style.width
    if (fireObj != null) {
        fireObj.fireEvent('onclick')
    }
}
function Calander_Fill() {

    var ndt = this.Table
    var ndtb = this.TableBody
    // Now Do Dates.
    var cdate = this.date
    var today = this.date
    var bMonth = new Date(today.add("d", (-today.getDate()) + 1))

    var cday = bMonth.getDay()
    if (cday == 0) { cday = cday + 7 }

    var vdate = 0

    var firstdate = new Date(bMonth.add("d", -cday + 1));
    var fdate = new Date(firstdate);


    for (cou = 0; cou < 6; cou++) {
        var ndr = document.createElement("tr");
        ndr.className = "rows";
        ndtb.appendChild(ndr)
        ndr.id = this.ownerID + '-' + cou
        this.Rows[cou] = ndr

        for (cou2 = 0; cou2 < 7; cou2++) {
            var ndd = document.createElement("td");
            ndd.className = "days";
            //ndd.innerHTML = firstdate.getDate();

            var div = document.createElement('div');
            div.innerHTML = firstdate.getDate();
            div.style.width = "100%";
            div.style.height = "17px";
            ndd.appendChild(div);

            ndd.onclick = Calander_SelectedDate
            ndd.id = this.ownerID + cou + '-' + cou2
            ndd.owner = this
            ndd.date = new Date(firstdate)
            ndr.appendChild(ndd)
            if (ndd.date.toDateString() == new Date().toDateString()) {
                ndd.style.borderLeft = "thin ridge"
                ndd.style.borderRight = "thin ridge"
                ndd.style.borderTop = "thin ridge"
                ndd.style.borderBottom = "thin ridge"
            } else {
                ndd.style.borderLeft = ""
                ndd.style.borderRight = ""
                ndd.style.borderTop = ""
                ndd.style.borderBottom = ""
            }
            if (today.getMonth() != new Date(firstdate).getMonth()) {
                ndd.style.color = "gray"
                ndd.style.height = "1px";
                div.innerHTML = "";
                if (cou2 == 0 && cou == 5) {
                    ndr.style.height = "1px";
                }
            } else {
                ndd.style.fontWeight = "bold"
            }


            firstdate = new Date(firstdate.add("d", 1))

        }
    }
    // Call event Service Here...
    BadService.BadServ.getEvents(fdate.format('MM/dd/yyyy 00:00:00'), firstdate.format('MM/dd/yyyy 00:00:00'), on_Complete_GetEvents, on_error, on_error)

    // Selected Date
    var ndr = document.createElement("tr");
    ndtb.appendChild(ndr)
    var ndd = document.createElement("td");
    ndr.appendChild(ndd)

    ndd.colSpan = 7
    ndd.id = this.ownerID + '-sel'
    ndd.me = this

    //ndd.onclick = Calander_ShowTime
    ndd.onfocus = function() { event.srcElement.style.backgroundColor = "tan" }
    ndd.onblur = function() { event.srcElement.style.backgroundColor = "white" }
    this.Time = ndd

    this.vMonth.innerHTML = Months[this.date.getMonth()] + ' ' + this.date.getYear()
    this.owner.style.height = ndt.style.height
    this.owner.style.width = ndt.style.width


}
var txtEvent;
var txtDate;
var txtTime;
var txtDescription;

function mOvermth() {
    event.srcElement.style.cursor = "hand"
}