var map;
var nonservlayer;
var outagelayer;
var refreshId;
var countylayer;


//$(document).ready(function() {
function initMap(){
    $(function () {
        map = new VEMap('map');
        var options = new VEMapOptions();
        options.EnableBirdseye = false
        options.EnableDashboardLabels = false;
        OutageMap.Config.mapWidthGap = 260;
        OutageMap.Config.mapHeightGap = 103;
        setMapDivSize();
        var ZoomLevel;
        ZoomLevel = OutageMap.Config.StartZoomLevel;
        if (window.screen.height <= 800) { ZoomLevel = OutageMap.Config.LowResZoomLevel; }
        OutageMap.Config.CurrentZoomLevel = ZoomLevel;
        map.LoadMap(new VELatLong(OutageMap.Config.StartLat, OutageMap.Config.StartLong),
                                      ZoomLevel,
                                      OutageMap.Config.MapType,
                                      null,
                                      null,
                                      false,
                                      null,
                                      options);
        map.EnableShapeDisplayThreshold(false);
        map.AttachEvent("onmouseover", function (e) { MouseShapeHandler(e) });
        //map.AttachEvent("onmouseout", function(e) { MouseOutShapeHandler(e) });
        ToggleMapBorder(true);
        LoadOutages();
        LoadOutageReport('outageDetail');
    });
    //bind the resize event
    $(function() {
        $(window).bind('resize', function() { mapResize(); });
    });

    $(function() {
        $('#outageDetailContainer').dialog({ height: 350, width: 480, resizable: false, autoOpen: false });

        $('#viewOutage').click(function() {
            $("#outageDetailContainer").dialog('open');
            return false;
        });

        $('#showOutageReportImg').click(function() {
            $("#outageDetailContainer").dialog('open');
            return false;
        });
    });

    //init tabs
    $(function() {
        $("#tab_container").tabs();
        $("#secondary_tab_container").tabs();
    });

    //Auto refresh every 5 minutes
    if ($.cookie('EnableAutoRefresh') != null) { document.getElementById('enableAutoRefresh').checked = stringToBoolean($.cookie('EnableAutoRefresh')); }
    ToggleAutoRefresh(document.getElementById('enableAutoRefresh').checked);

}//);

function LoadOutageReport(dv) {
    var outRptContainer = document.getElementById('outageReportContainer');
    var noOutContainer = document.getElementById('noOutagesContainer');
    ServiceCall('AllOutageData', '',
                        function (m, p) {
                            var lastupdatedDate;
                            var totalNumberCustomersOut = 0;
                            var totalPercentageOut = 0;
                            var stateNumberOfCust = 0;
                            var rows = '', footer = '';
                            if (m != null && m.length > 0) {
                                for (i = 0; i < m.length; i++) {
                                    if (parseInt(m[i].CustomersAffected) >= 1) {

                                        var percentAffected = m[i].PercentageCustomersAffected;
                                        if (parseInt(percentAffected) >= 1) { percentAffected = Math.floor(percentAffected); }

                                        rows = "{0}<tr><td style=\"width:135px\"><a alt='Zoom to {1}' href='javascript:ZoomToLocation({5},{6});'>{1}</a></td><td style=\"width:75px\">{2}</td><td style=\"width:140px\">{3}</td><td style=\"width:55px\">{4}</td></tr>"
                                                     .format(rows,
                                                             m[i].Name,
                                                             m[i].NumberOfCustomersServed,
                                                             m[i].CustomersAffected,
                                                             percentAffected,
                                                             m[i].Latitide,
                                                             m[i].Longitide);

                                        totalNumberCustomersOut += parseInt(m[i].CustomersAffected.replace(',', ''));
                                        stateNumberOfCust = m[i].StateTotalCustomersServed;
                                    }
                                }

                                totalPercentageOut = (parseInt(totalNumberCustomersOut) / parseInt(stateNumberOfCust)) * 100;
                                if (parseInt(totalPercentageOut) >= 1) { totalPercentageOut = Math.floor(totalPercentageOut); }
                                else { totalPercentageOut = "<1"; }

                                //add total row
                                footer = "{0}<tr><td style=\"font-weight:bold; color:#4D4D4D; \" colspan=\"2\"  >Total Customers Affected</td><td style=\"font-weight:bold;color:#4D4D4D;\">{1}</td><td  style=\"font-weight:bold;\">{2}</td></tr>"
                                       .format(footer,
                                               addCommas(totalNumberCustomersOut),
                                               totalPercentageOut);

                                lastupdatedDate = m[0].ReportDate;
                                $('#{0} tbody'.format(dv)).empty().append(rows);
                                $('#{0} tfoot'.format(dv)).empty().append(footer);
                                $('#{0}'.format(dv)).tablesorter({ headerTable: 'outageDetailHeader' });

                                outRptContainer.style.visibility = "visible";
                                noOutContainer.style.visibility = "hidden";
                            }
                            else {
                                // no info...
                                outRptContainer.style.visibility = "hidden";
                                noOutContainer.style.visibility = "visible";
                                var currDate = new Date();
                                lastupdatedDate = formatDateTime(currDate);

                            }

                            //total customers
                            var totalCust = document.getElementById('totalCustomers');
                            totalCust.innerHTML = addCommas(stateNumberOfCust);
                            //update total number of customers
                            var custOut = document.getElementById('totalCustomersOut');
                            custOut.innerHTML = addCommas(totalNumberCustomersOut);
                            //percentage of total out
                            var totalPercentCustOutLabel = document.getElementById('percentTotalOut');

                            totalPercentCustOutLabel.innerHTML = totalPercentageOut;
                            //update last updated date
                            var lastUpdated = document.getElementById('lastUpdatedTime');
                            lastUpdated.innerHTML = lastupdatedDate;


                        },
                         FailedCallback);
}

function LoadOutages() {
    PopFullscreenProgressBar();
    //remove all shapes
    map.DeleteAllShapes();
    //non serviced towns
    if ($.cookie('ShowCLPNonServicedTowns') != null) { document.getElementById('showsnonerviced').checked = stringToBoolean($.cookie('ShowCLPNonServicedTowns')); }
    ToggleNonServicedArea(document.getElementById('showsnonerviced').checked);
//    //divisions
//    if ($.cookie('ShowDivisions') != null) { document.getElementById('showdivisions').checked = stringToBoolean($.cookie('ShowDivisions')); }
//    ToggleDivisions(document.getElementById('showdivisions').checked);
    outagelayer = new VEShapeLayer();
    ServiceCall('AllOutageData', '',
                            function (m, p) {
                                //var i = m.length; while (i--) {
                                for (var i = 0, curLen = m.length; i < curLen; i++) {

                                    var outageData = '';
                                    // Percentage affected
                                    var percentAffected = m[i].PercentageCustomersAffected;
                                    if (parseInt(percentAffected) >= 1) { percentAffected = Math.floor(percentAffected); }

                                    outageData = "<table id='outagePopupDetail' ><tr><td class='outageDetailHeader' colspan='2'>{1}</td></tr><tr><td class='outageDetailLabel'>CL&P Customers Served:</td><td class='outageDetail'>{2}</td></tr><tr><td class='outageDetailLabel'>CL&P Customers Affected:</td><td class='outageDetail'>{3}</td></tr><tr><td class='outageDetailLabel'>% of CL&P Customers Affected:</td><td class='outageDetail'>{4}</td></tr></table>"
                                        .format(outageData,
                                                m[i].Name,
                                                m[i].NumberOfCustomersServed,
                                                m[i].CustomersAffected,
                                                percentAffected);

                                    var townPoints = window['{0}'.format(m[i].Name).replace(' ', '_')];

                                    if (townPoints != null) {
                                        var s = new VEShape(VEShapeType.Polygon, townPoints);
                                        s.SetDescription(outageData);
                                        s.SetMinZoomLevel(OutageMap.Config.MinZoomLevel);
                                        s.SetMaxZoomLevel(OutageMap.Config.MaxZoomLevel);
                                        //determine color
                                        var red = 0, green = 0, blue = 0;
                                        if (percentAffected > 80) { red = 0; green = 0; blue = 0; }
                                        if (percentAffected > 60 && percentAffected <= 80) { red = 99; green = 36; blue = 148; }
                                        if (percentAffected > 40 && percentAffected <= 60) { red = 99; green = 32; blue = 33; }
                                        if (percentAffected > 30 && percentAffected <= 40) { red = 247; green = 0; blue = 0; }
                                        if (percentAffected > 20 && percentAffected <= 30) { red = 115; green = 93; blue = 33; }
                                        if (percentAffected > 10 && percentAffected <= 20) { red = 214; green = 134; blue = 132; }
                                        if (percentAffected >= 1 && percentAffected <= 10) { red = 231; green = 170; blue = 0; }
                                        if (percentAffected < 1) { red = 239; green = 247; blue = 0; }
                                        s.SetLineColor(new VEColor(102, 102, 102, 1.0));
                                        s.SetFillColor(new VEColor(red, green, blue, 0.7));
                                        s.SetLineWidth(1);
                                        s.HideIcon();

                                        map.AddShape(s);
                                    }

                                }   //end loop 1
                                //map.AddShapeLayer(outagelayer);
                                HideFullscreenProgressBar();
                            },
                             FailedCallback);                           //end sc
                        } //end function

function ToggleNonServicedArea(show) {

    if (show == true) {
        nonservlayer = new VEShapeLayer();
        for (var i = 0, curLen = OutageMap.Config.NonServicedTowns.length; i < curLen; i++) {

            var nonServInfo = '';
            nonServInfo = "<table id='outagePopupDetail' ><tr><td class='outageDetailHeader' colspan='2'>{1}</td></tr><tr><td class='outageDetailLabel'>{2}</td></tr></table>"
                .format(nonServInfo,
                        OutageMap.Config.NonServicedTowns[i].replace('_', ' '),
                        'Served by other utility');

            var townPoints = window['{0}'.format(OutageMap.Config.NonServicedTowns[i].replace(' ', '_'))];
            //alert(townPoints);
            if (townPoints != null) {
                var s = new VEShape(VEShapeType.Polygon, townPoints);
                ;
                s.SetDescription(nonServInfo);
                s.SetMinZoomLevel(OutageMap.Config.MinZoomLevel);
                s.SetMaxZoomLevel(OutageMap.Config.MaxZoomLevel);
                //determine color

                s.SetLineColor(new VEColor(102, 102, 102, 1.0));
                s.SetFillColor(new VEColor(148, 150, 148, 0.7));
                s.SetLineWidth(1);
                s.HideIcon();

                nonservlayer.AddShape(s);
            }
        }
        map.AddShapeLayer(nonservlayer);
    }
    else {
        if (nonservlayer != null) { map.DeleteShapeLayer(nonservlayer); nonservlayer = null; }
    }
    //save info
    $.cookie('ShowCLPNonServicedTowns', show, { expires: 365 });                                 
}

function ToggleCounties(show) {
    //var divisionLegend = document.getElementById('countieslegend');
    if (show == true) {
        ToggleMapBorder(false); 
        var tileSource = new VETileSourceSpecification(OutageMap.Config.LayerId, "app_themes/clp/images/layer/%4.png");
                tileSource.MinZoomLevel = 5;
                tileSource.MaxZoomLevel = 11;
                tileSource.ZIndex = 40;
                map.AddTileLayer(tileSource, true);

//                countylayer = new VEShapeLayer();
//                for (var i = 0, curLen = OutageMap.Config.Counties.length; i < curLen; i++) {

//                    var countyPoints = window['{0}_{1}'.format(OutageMap.Config.State, OutageMap.Config.Counties[i].replace(' ', '_'))];

//                    if (countyPoints != null) {
//                        var s = new VEShape(VEShapeType.Polygon, countyPoints);
//                        s.SetLineColor(new VEColor(0, 0, 255, 1.0));
//                        s.SetFillColor(new VEColor(0, 0, 0, 0));
//                        s.SetLineWidth(2);
//                        s.HideIcon();
//                        countylayer.AddShape(s);
//                    }
//                   
//                } map.AddShapeLayer(countylayer);
    }
            else { map.DeleteTileLayer(OutageMap.Config.LayerId);ToggleMapBorder(true); }

    //save info
    $.cookie('ShowCounties', show, { expires: 365 });
}

function ToggleMapBorder(show) {
    var id = 'StateBoundry';
    if (show) {
        var statePoints = window['{0}'.format('CT_STATE')];
        var color = new VEColor(0, 0, 255, 0.5);
        var width = 3;
        var poly = new VEPolygon(id, statePoints, '', color, width);
        map.AddPolygon(poly);
    }
    else {
        map.DeletePolygon(id);
    }

}

function HideFullscreenProgressBar() {
    var progBarDiv = document.getElementById('progressBar');
    progBarDiv.style.visibility = "hidden";
    var progBarBgDiv = document.getElementById('progressBarBackground');
    progBarBgDiv.style.visibility = "hidden";

    var ddElements;
    var i = 0;
    ddElements = document.getElementsByTagName('SELECT');
    for (var k = 0; k < ddElements.length; k++) {
        ddElements[k].style.visibility = 'visible';
    }
}

function PopFullscreenProgressBar() {
    var ddElements;
    var i = 0;
    ddElements = document.getElementsByTagName('SELECT');
    for (var k = 0; k < ddElements.length; k++) {
        ddElements[k].style.visibility = 'hidden';
    }

    var progBarDiv = document.getElementById('progressBar');
    progBarDiv.style.visibility = "visible";
    var progBarBgDiv = document.getElementById('progressBarBackground');
    progBarBgDiv.style.visibility = "visible";
    
    var winHeight, yOffset, d = document, winWidth;
    if (typeof window.innerHeight != 'undefined') {
        winHeight = window.innerHeight;
        winWidth = window.innerWidth;
        yOffset = window.pageYOffset;
    } else {
        if (d.documentElement &&
  typeof d.documentElement.clientHeight != 'undefined' &&
   d.documentElement.clientHeight != 0) {
            winHeight = d.documentElement.clientHeight;
            winWidth = d.documentElement.clientWidth;
            yOffset = d.documentElement.scrollTop;
        } else {
            if (d.body &&
   typeof d.body.clientHeight != 'undefined') {
                winHeight = d.body.clientHeight;
                winWidth = d.body.clientWidth;
                yOffset = d.body.scrollTop;
            }
        }
    }

    
    progBarDiv.style.height = d.body.clientHeight + "px";
    progBarDiv.style.width = winWidth + "px";
    progBarDiv.style.top = "0px";
    progBarDiv.style.left = "0px";
    progBarBgDiv.style.height = winHeight + "px";
    progBarBgDiv.style.width = winWidth + "px";
    progBarBgDiv.style.top = "0px";
    progBarBgDiv.style.left = "0px";

    var progressBarTable = document.getElementById('progressContent');
    var tiggityTop = (winHeight / 2) - 100 + yOffset;
    progressBarTable.style.top = tiggityTop + "px";
    var boxLeft = (winWidth / 2) - 150;
    progressBarTable.style.left = boxLeft + "px";
}

function mapResize() {
    var D;
    var gap;
    if (window.innerWidth) {
        myWidth = window.innerWidth
    }
    else {
        if (document.documentElement.clientWidth == 0) {
            myWidth = document.body.clientWidth
        }
        else {
            myWidth = document.documentElement.clientWidth
        }
    }

    if (window.innerHeight) {
        myHeight = window.innerHeight
    }
    else {
        if (document.documentElement.clientHeight == 0) {
            myHeight = document.body.clientHeight
        }
        else {
            myHeight = document.documentElement.clientHeight
        }
    }

    if ((document.getElementById) && (document.getElementById('tab_container'))) {
        var tabContainer = document.getElementById('tab_container');
        hDelta = OutageMap.Config.mapHeightGap;
        gap = tabContainer.clientWidth + 25
    }
    else {
        hDelta = OutageMap.Config.mapHeightGap;
        gap = OutageMap.Config.mapWidthGap
    }

    var h = myHeight - hDelta;
    var w = myWidth - gap;
    if ((document.getElementById) && (!document.all)) {
        h =h + "px";
        w = w + "px";
        window.document.getElementById('map').style.height =h;
        window.document.getElementById('map').style.width = w;
    }
    else {
        this.map.Resize(w,h)
        window.document.getElementById('tab_container').style.height =h;
    }
}

function setMapDivSize() {
    if (window.innerWidth) {
        myWidth = window.innerWidth
    }
    else {
        if (document.documentElement.clientWidth == 0) {
            myWidth = document.body.clientWidth
        }
        else {
            myWidth = document.documentElement.clientWidth
        }
    }
    if (window.innerHeight) {
        myHeight = window.innerHeight
    }
    else {
        if (document.documentElement.clientHeight == 0) {
            myHeight = document.body.clientHeight
        }
        else {
            myHeight = document.documentElement.clientHeight
        }
    }

    if ((document.getElementById) && (document.getElementById("tab_container"))) {
        var tabContainer = document.getElementById("tab_container");
        hDelta = OutageMap.Config.mapHeightGap;
        wDelta = tabContainer.clientWidth + 25
    }
    else {
        hDelta = OutageMap.Config.mapHeightGap;
        wDelta = OutageMap.Config.mapWidthGap
    }
    var h = myHeight - hDelta;
    var w = myWidth - wDelta;
    if ((document.getElementById) && (!document.all)) {
        h = h + "px";
        w = w + "px"
    }
    window.document.getElementById("map").style.height = h;
    window.document.getElementById("map").style.width = w;
    window.document.getElementById('tab_container').style.height = h;
};

function MouseShapeHandler(e) {
    if (e.elementID) {
        var shape = this.map.GetShapeByID(e.elementID);
        if (shape.GetDescription() && shape.GetType() == "Polygon") {
            if (e.eventName == "onmouseover") {
                this.map.HideInfoBox();
                this.map.ShowInfoBox(shape)
            }
        }
    }
}

function ZoomToLocation(latitude, longitide) {
    var point = new VELatLong(latitude, longitide);
    var zoomLevel = OutageMap.Config.CurrentZoomLevel + 3;

    if (zoomLevel > OutageMap.Config.MaxZoomLevel) { zoomLevel = OutageMap.Config.MaxZoomLevel }
    map.SetCenterAndZoom(point, zoomLevel)
};

function addCommas(val) {
    val += '';
    x = val.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '$1' + ',' + '$2');
    }
    return x1 + x2;
}

function stringToBoolean(string) {
    switch (string.toLowerCase()) {
        case "true": case "yes": case "1": return true;
        case "false": case "no": case "0": case null: return false;
        default: return Boolean(string);
    }
}

function ToggleAutoRefresh(enable) {
    if (enable == true) {
        refreshId = setInterval(function () {
            LoadOutages();
            LoadOutageReport('outageDetail');
        }, OutageMap.Config.RefreshInterval);
    }
    else { clearTimeout(refreshId); }

    //save info
    $.cookie('EnableAutoRefresh', enable, { expires: 365 });
}

function convertHex2DecRGB(hex) {
    var colors = new Array();
    var dec = new Array();

    for (var i = 0; i < 3; i++) {
        colors[i] = hex.substr((i * 2), 2);
        dec[i] = convertHex2DecChannel(colors[i]);
    }

    return dec;
}

function convertHex2DecChannel(hex_channel) {
    var dec_channel;
    dec_channel = parseInt(hex_channel, 16);
    return dec_channel.toString();
}


function searchAdderss() {
    var addressval = document.getElementById('address').value;
    map.Find(null, addressval, null, null, null, null, null, null, null, null, null);
}


function formatDateTime(currentDateTime) {
    
    var a_p = "";
    var curr_month = currentDateTime.getMonth();
    var curr_day = currentDateTime.getDay();
    var curr_year = currentDateTime.getFullYear();
    var curr_hour = currentDateTime.getHours();
    
    if (curr_hour < 12) {
        a_p = "AM";
    }
    else {
        a_p = "PM";
    }
    if (curr_hour == 0) {
        curr_hour = 12;
    }
    if (curr_hour > 12) {
        curr_hour = curr_hour - 12;
    }

    var curr_min = currentDateTime.getMinutes();

    curr_min = curr_min + "";

    if (curr_min.length == 1) {
        curr_min = "0" + curr_min;
    }


return curr_month + "/" + curr_day + "/" + curr_year + " "  + curr_hour + ":" + curr_min + ":00 " + a_p;


}





