﻿function HtmlEncode(s)
{
    var output = s;
    output = output.replace(/>/g,"&gt;");
    output = output.replace(/</g,"&lt;");
    
    return output;
}

function AppointmentBookClass(apb_main)
{
    var m_selectedCell;
    var m_apbMain = apb_main;
    var m_apbEntry = FindById(m_apbMain.getElementsByTagName("div"), "apb_entry");
    var m_selDisp = FindById(m_apbMain.getElementsByTagName("span"), "seldisp");
    var m_step1 = FindById(m_apbMain.getElementsByTagName("div"), "step1");
    var m_step2 = FindById(m_apbMain.getElementsByTagName("div"), "step2");
    var m_apbSubmitting = FindById(m_apbMain.getElementsByTagName("div"), "apb_submitting");
    var m_apbForm = FindById(m_apbMain.getElementsByTagName("form"), "apb_form");
    var m_okBtn = FindById(m_apbMain.getElementsByTagName("input"), "apb_okBtn");
    var m_nameInput = FindById(m_apbForm.getElementsByTagName("input"), "nameInput");
    var m_emailInput = FindById(m_apbForm.getElementsByTagName("input"), "emailInput");
    var m_phoneInput = FindById(m_apbForm.getElementsByTagName("input"), "phoneInput");
    var m_notesInput = FindById(m_apbForm.getElementsByTagName("textarea"), "notesInput");
    var m_reqInput = FindById(m_apbForm.getElementsByTagName("input"), "req");
        
    // --------------------------------------------------------------------------------
    // Add events and styls to calendar table
    // --------------------------------------------------------------------------------
    this.AddBehaviors = function AddBehaviors_func(tbl)
    {
        function td_mouseover()
        {
            this.className = "h";
            this.style.cursor = "pointer";
        }

        function td_mouseout()
        {
            if (this == m_selectedCell)
            {
                this.className = "apb_s";
                this.style.cursor = "";
            }
            else
            {
                this.className = "";
                this.style.cursor = "";
            }
        }
        
        function td_click()
        {
            m_reqInput.value = this.getAttribute("atr");
            
            if (m_selectedCell != null)
                m_selectedCell.className = "";
            
            m_selectedCell = this;
            this.className = "apb_s";
            
            m_okBtn.disabled = false;
            
            setTimeout("g_apbClass.ShowStep(2)", 200);
        }

        var apb_weekTbl = FindById(m_apbMain.getElementsByTagName("table"), "apb_weekTbl");
        
        var colAtrs = new Array();
        var headerTr = apb_weekTbl.getElementsByTagName("tr")[0];
        var headerThs = headerTr.getElementsByTagName("th");
        for (var i=1; i<headerThs.length; i++)
        {
            var th = headerThs[i];
            var atrString = "";
            if (th.getAttribute("atr") != null)
                atrString = th.getAttribute("atr");

            colAtrs.push(atrString);
        }        

        var trs = apb_weekTbl.getElementsByTagName("tr");
        for (var j=0; j<trs.length; j++)
        {
            var tr = trs[j];
            var tds = tr.getElementsByTagName("td");
            var atrString = "";
            if (tr.getAttribute("atr") != null)
                atrString = tr.getAttribute("atr");

            for(var i=0; i<tds.length; i++)
            {
                var td = tds[i];
                if (td.innerHTML == "N/A" || td.innerHTML == "x")
                {
                    // This is a filled appointment slot
                    td.className = "f";
                }
                else
                {
                    td.onmouseover = td_mouseover;
                    td.onmouseout = td_mouseout;
                    td.onclick = td_click;
                    // Specify the date-time of each cell
                    td.setAttribute("atr", atrString + colAtrs[i]);
                }
            }
        }
    }
    
    // --------------------------------------------------------------------------------
    // Handle calendar cell click
    // --------------------------------------------------------------------------------
    this.HandleWeekSelect = function HandleWeekSelect_func(dd)
    {
        var currentUrl = window.location.href;
        var qpos = currentUrl.length - window.location.search.length;
        var urlBase = currentUrl.substring(0, qpos);
        var newUrl = urlBase + "?" + dd.value;
        window.location = newUrl;
    }

    // --------------------------------------------------------------------------------
    // Handle appointment request click
    // --------------------------------------------------------------------------------
    this.HandleRequestClick = function HandleRequestClick_func(f)
    {
//        if (m_phoneInput.value == null || m_phoneInput.value.length < 10)
//        {
//            alert("Please specify a valid phone number including area code.");
//            return;
//        }

        if (m_nameInput.value == null || m_nameInput.value.length < 2)
        {
            alert("Please specify your name.");
            return;
        }

        if (m_emailInput.value == null || m_emailInput.value.length < 3 || m_emailInput.value.indexOf("@") < 1)
        {
            alert("Please specify a valid email address");
            return;
        }

        m_nameInput.value = HtmlEncode(m_nameInput.value);
        m_emailInput.value = HtmlEncode(m_emailInput.value);
        m_phoneInput.value = HtmlEncode(m_phoneInput.value);
        m_notesInput.value = HtmlEncode(m_notesInput.value);
        
        m_okBtn.disabled = true;
        m_apbSubmitting.style.display = "inline";
        m_apbEntry.style.display = "none";
        f.submit();

        m_apbSubmitting.scrollIntoView();
        
        // reload after a short delay
        //setTimeout("window.location.reload()", 5000);
    }

    function ShowSelectedTime()
    {
        var dtParts = m_reqInput.value.split("&");

        var tPart = dtParts[0].substr(2);
        var hour = Number(tPart.substr(0, 2));
        var min = tPart.substr(2, 2);

        var dPart = dtParts[1].substr(2);
        var month = Number(dPart.substr(0, 2));
        var day = Number(dPart.substr(2, 2));
        var year = dPart.substr(4, 2);
        
        var ampm;
        if (hour >= 12)
        {
            ampm = "pm";
            if (hour > 12)
                hour -= 12;
        }
        else
        {
            ampm = "am";
        }
        
        var dispStr = "Make an appointment for " + month + "/" + day + "/" + year + " at " + hour + ":" + min + " " + ampm;
        m_selDisp.innerHTML = dispStr;
    }
    
    this.ShowStep = function ShowStep_func(stepNum)
    {
        if (stepNum == 1)
        {
            m_step1.style.display = "inline";
            m_step2.style.display = "none";
        }
        else if (stepNum == 2)
        {
            ShowSelectedTime();
            m_step1.style.display = "none";
            m_step2.style.display = "inline";
            m_nameInput.focus();
        }
    }
    
    this.HandleAptBkDropdown = function HandleAptBkDropdown_func()
    {
        var aptBkDropdown = FindById(m_apbForm.getElementsByTagName("select"), "AptBooksDropDownList");
        window.location = aptBkDropdown.value;
    }
}

var g_apbClass = new AppointmentBookClass(document.getElementById("apb_main"));
g_apbClass.AddBehaviors(document.getElementById("apb_weekTbl"));

