MapITSL = function () {
    this.bannerpath = "";

    MapITSL.prototype.includeMapITHeader = function () {
        inclMapITHeader = true;
    }

    MapITSL.prototype.setColors = function (primary, secondary, alternative, alternative2) {
        prim = primary;
        second = secondary;
        alt = alternative;
        alt2 = alternative2;
        CreateColorRef();
    }

    MapITSL.prototype.setClient = function (clid) {
        clientIdentifier = clid;
    }

    MapITSL.prototype.setContentFrames = function (searchColour, storeColour) {
        if (searchColour == "1") {
            searchFrame = prim;
        }
        if (searchColour == "2") {
            searchFrame = second;
        }
        if (searchColour == "3") {
            searchFrame = alt;
        }
        if (storeColour == "1") {
            storeFrame = prim;
        }
        if (storeColour == "2") {
            storeFrame = second;
        }
        if (storeColour == "3") {
            storeFrame = alt;
        }
        for (var i = 0; i < 12; i++) {
            if (SLColours[i][0] == searchFrame) {
                framebordercolor1HEX = SLColours[i][2];
            }
            if (SLColours[i][0] == storeFrame) {
                framebordercolor2HEX = SLColours[i][2];
            }
        }
    };

    MapITSL.prototype.setTabsLF = function (search, stores) {
        if (search == "1") {
            searchTab = prim;
        }
        if (search == "2") {
            searchTab = second;
        }
        if (search == "3") {
            searchTab = alt;
        }
        if (stores == "1") {
            storesTab = prim;
        }
        if (stores == "2") {
            storesTab = second;
        }
        if (stores == "3") {
            storesTab = alt;
        }
    }

    MapITSL.prototype.setFrameLF = function setFrameLF(framesetcolour) {
        if (framesetcolour == "1") {
            framecolor = prim;
        }
        if (framesetcolour == "2") {
            framecolor = second;
        }
        if (framesetcolour == "3") {
            framecolor = alt;
        }
        for (var i = 0; i < 12; i++) {
            if (SLColours[i][0] == framecolor) {
                framecolorHEX = "#EEF3F6";
            }
        }
    }
    MapITSL.prototype.setURHLF = function (icotype, icocolour, icosize) {
        urhicontype = icotype;
        urhiconsize = icosize;
        if (icocolour == "1") {
            urhiconcolour = prim;
        }
        if (icocolour == "2") {
            urhiconcolour = "blue";
        }
        if (icocolour == "3") {
            urhiconcolour = alt;
        }
    }

    MapITSL.prototype.setButtonsLF = function (icocolour, icocolour2) {
        if (icocolour == "") {
            buttoncolor = prim;
        }
        if (icocolour == "1") {
            buttoncolor = prim;
        }
        if (icocolour == "2") {
            buttoncolor = second;
        }
        if (icocolour == "3") {
            buttoncolor = alt;
        }
        if (icocolour == "4") {
            buttoncolor = alt2;
        }
        if (icocolour2 == "") {
            buttoncolor2 = prim;
        }
        if (icocolour2 == "1") {
            buttoncolor2 = prim;
        }
        if (icocolour2 == "2") {
            buttoncolor2 = second;
        }
        if (icocolour2 == "3") {
            buttoncolor2 = alt;
        }
        if (icocolour2 == "4") {
            buttoncolor2 = alt2;
        }
    }

    MapITSL.prototype.setStoresLF = function (icotype, icocolour, icosize) {
        icontype = icotype;
        iconsize = icosize;
        if (icocolour == "1") {
            iconcolour = prim;
        }
        if (icocolour == "2") {
            iconcolour = second;
        }
        if (icocolour == "3") {
            iconcolour = alt;
        }
    }

    MapITSL.prototype.setDirectionsBanner = function (path) {
        bannerpath = path;
    }

    MapITSL.prototype.setBottomBarLF = function (bottbarcolour) {
        if (bottbarcolour == "1") {
            bottombarcolor = prim;
        }
        if (bottbarcolour == "2") {
            bottombarcolor = second;
        }
        if (bottbarcolour == "3") {
            bottombarcolor = alt;
        }
    }
}

function loadjscssfile(path, filetype) {
    if (filetype == "js") { //if filename is a external JavaScript file
        var fileref = document.createElement('script')
        fileref.setAttribute("type", "text/javascript")
        fileref.setAttribute("src", path)
    }
    else if (filetype == "css") { //if filename is an external CSS file
        var fileref = document.createElement("link")
        fileref.setAttribute("rel", "stylesheet")
        fileref.setAttribute("type", "text/css")
        fileref.setAttribute("href", path)
    }
    if (typeof fileref != "undefined")
        document.getElementsByTagName("head")[0].appendChild(fileref)
}


var SLColours = new Array(12)
for (i = 0; i < SLColours.length; ++i)
    SLColours[i] = new Array(3);

function CreateColorRef() {
    SLColours[0][0] = "maroon";
    SLColours[0][1] = "153,0,0"; 
    SLColours[0][2] = "#990000";
    SLColours[1][0] = "red";
    SLColours[1][1] = "255,0,0"; 
    SLColours[1][2] = "#ff0000";
    SLColours[2][0] = "orange";
    SLColours[2][1] = "255,153,0"; 
    SLColours[2][2] = "#ff9900";
    SLColours[3][0] = "yellow";
    SLColours[3][1] = "255,255,0"; 
    SLColours[3][2] = "#ffff00";
    SLColours[4][0] = "green";
    SLColours[4][1] = "0,153,51"; 
    SLColours[4][2] = "#009933";
    SLColours[5][0] = "navy";
    SLColours[5][1] = "0,0,153"; 
    SLColours[5][2] = "#000099";
    SLColours[6][0] = "blue";
    SLColours[6][1] = "0,153,255"; 
    SLColours[6][2] = "#0099ff";
    SLColours[7][0] = "grey";
    SLColours[7][1] = "153,153,153"; 
    SLColours[7][2] = "#999999";
    SLColours[8][0] = "black";
    SLColours[8][1] = "0,0,0"; 
    SLColours[8][2] = "#000000";
    SLColours[9][0] = "lime";
    SLColours[9][1] = "204,255,51";
    SLColours[9][2] = "#ccff33";
    SLColours[10][0] = "lightblue";
    SLColours[10][1] = "238,243,246";
    SLColours[10][2] = "#69add2";
    SLColours[11][0] = "darkblue";
    SLColours[11][1] = "116,151,180";
    SLColours[11][2] = "#4599c8";
}

var array_of_sectors = null;
var array_of_services = null;
$(document).ready(function () {
    //    $.localise('ui-multiselect', { /*language: 'en',*/path: 'js/locale/' });
    //    $(".multiselect").multiselect();
    //Multiselects
    //Multiselect Categories
    $("#category").multiselect({
        noneSelectedText: 'Select Sector',
        selectedText: "# of # sectors selected",
        header: "Choose a Sector!",
        autoOpen: false
    });
    $("#category").bind("multiselectclick", function (event, ui) {
        array_of_sectors = $("#category").multiselect("getChecked").map(function () {
            return this.title;
        }).get();
    });
    //Multiselect Services
    $("#services").multiselect({
        noneSelectedText: 'Select Service',
        selectedText: "# of # services selected",
        header: "Choose a Service!",
        autoOpen: false
    });
    $("#services").bind("multiselectclick", function (event, ui) {
        array_of_services = $("#services").multiselect("getChecked").map(function () {
            return this.title;
        }).get();
    });
    //Multiselect ServicesList
    $("#cbo1").multiselect({
        multiple: false,
        selectedList: 1,
        noneSelectedText: 'Select Service',
        header: "Choose a Service!",
        autoOpen: false
    });
    $("#cbo1").bind("multiselectclick", function (event, ui) {
        var array_of_checked_values = $("#cbo1").multiselect("getChecked").map(function () {
            return this.title;
        }).get();
        CboChangeService(array_of_checked_values[0]);
    });
    //Multiselect SectorList
    $("#cbo2").multiselect({
        multiple: false,
        noneSelectedText: 'Select Service First',
        selectedList: 1,
        header: "Choose a Category!",
        autoOpen: false
    });
    $("#cbo2").bind("multiselectclick", function (event, ui) {
        var array_of_checked_values = $("#cbo2").multiselect("getChecked").map(function () {
            return this.title;
        }).get();
        CboChangeSector(array_of_checked_values[0]);
    });
    //Multiselect Organisations
    $("#cboOrg").multiselect({
        multiple: false,
        noneSelectedText: 'Select Sector First',
        selectedList: 1,
        header: "Choose a Organisation!",
        autoOpen: false
    });
    $("#cboOrg").bind("multiselectclick", function (event, ui) {
        var array_of_checked_values = $("#cboOrg").multiselect("getChecked").map(function () {
            return this.value;
        }).get();
        CboChangeOrg(array_of_checked_values[0]);
    });
    //Buttons
    //Button Find Roads
    $("#btnSec1").live("click", function () {
       var roadname = document.getElementById("roadname").value;
        if (roadname == null || roadname == '') {
            $("#divValidation").show();
        }
        else {
            getroads();
        }
        StopLoaderTab2();
    });
    //Button Locate Stores
    $("#btnSelectStore").live("click", function () {
        jumpToStore();
    });
    //Button back
    $("#back").live("click", function () {
        back();
    });
    setIcons();
    $.fn.jExpand = function () {
        var element = this;

        $(element).find("tr:odd").addClass("odd");
        $(element).find("tr:not(.odd)").hide();
        $(element).find("tr:first-child").show();

        $(element).find("tr.odd").click(function () {
            var tr = $(this).next("tr");

            if (tr.css("display") == "none")
                tr.css("display", "");
            else
                tr.css("display", "none");

            $(this).find(".arrow").toggleClass("up");
            var storesTableHeight = document.getElementById('storetable').clientHeight + 80;
            document.getElementById('content').style.height = storesTableHeight;
            document.getElementById('sidebar1Content').style.height = storesTableHeight + 10;
            $(".btnGetDirections").button({
                icons: {
                    primary: "ui-icon-transferthick-e-w"
                }
            });
        });
        $(element).find("tr").mouseover(
                            function () {
                                $(this).addClass("highlight");
                            },
                            function () {
                                $(this).removeClass("highlight");
                            });
    }

    $("#emailbutton").live("click", function () {
        OpenEmailPopup();
    });
});

function setIcons() {
    $("#btnSec1").button({
        icons: {
            primary: "ui-icon-search"
        }
    });
    $("#back").button({
        icons: {
            primary: "ui-icon-circle-arrow-w"
        }
    });
    $("#btnSelectStore").button({
        icons: {
            primary: "ui-icon-arrowthickstop-1-s"
        }
    });
    $("#btnGetDirections").button({
        icons: {
            primary: "ui-icon-transferthick-e-w"
        }
    });
    $("#btnError").button({
        icons: {
            primary: "ui-icon-alert"
        }
    });
}

var activateEmailFunction = false;
var currentDirData = "";

function createPopup() {
currentDirData = document.getElementById("routedataTable");
    var dialog = $("#popupEmail").dialog({
        modal: true,
        height: '280',
        width: '350',
        title: 'Email Directions',
        buttons: { "Return to Store Locator": function () { $(this).dialog("close"); } }
    });
    var emailFrm = "<iframe src='./Emailer.aspx?currentX=" + currentX + "&currentY=" + currentY + "&x=" + dirX + "&y=" + dirY + "&framecolor=" + framecolor + "&bannerpath=" + bannerpath + "' id='emailframe' frameBorder='0' scrolling='no' width='315px' height='175px'></iframe>";
    $("#popupEmail").html(emailFrm);
}

function closeMailPopup(){
    $("#popupEmail").dialog("close");
}

function OpenEmailPopup() {
    createPopup();
//    $("#popupEmail").html("http://storelocator.mapservice.co.za/Emailer.aspx");
    $("#popupEmail").dialog("open");
}

function printDiv() {
    var divToPrint = document.getElementById("route_data").innerHTML;
    newWin = window.open("");
    newWin.document.write(document.getElementById("route_data").innerHTML);
    newWin.print();
}

var _searchhtml = "";
function setSearchHTML() {
    _searchhtml += "                 <div id='artBlockContent' class='art-BlockContent' style='height: auto'>";
    _searchhtml += "                     <div id='artBlockContentBody' class='art-BlockContent-body'";
    _searchhtml += "                         style='height: auto'>";
    _searchhtml += "                         <div id='sidebar1Content' style='background-color: transparent; position: relative; float: left;width: 250px; height: 400px;'>";
    _searchhtml += "                            <div class='tab' style='font-weight: bold;cursor: pointer;background: url(images/Tabs/tab_" + searchTab + ".png) no-repeat; left: 0px; top: 0px; z-index: 8' id='p1tab0'";
    _searchhtml += "                            onclick='selectTab(0)'><li>Search Location</li></div>";
    _searchhtml += "                            <div class='tab' style='font-weight: bold;cursor: pointer;background: url(images/Tabs/tab_" + storesTab + ".png) no-repeat;left: 157px; top: 0px; z-index: 7' id='p1tab1'";
    _searchhtml += "                            onclick='selectTab(1)'><li>Service Facilities</li></div>";
    _searchhtml += "                             <div class='cleared'></div>";
    _searchhtml += "                            <div class='panel' style='border-color:" + framebordercolor1HEX + ";background-color: #FFFFFF; z-index: 8' id='p1panel0' runat='server'>";
    _searchhtml += "                                <form method='get' id='Form1' action='javascript:void(0)'>";
    //    mainSLhtml += "                                     <label style='FONT-SIZE:8px;COLOR:#FDB60C;align:right;text-align:right' onclick='getroads()'>Show Settings</label>";
    _searchhtml += "                                     <h8>Services:</h8>";
    _searchhtml += "                                     <select style='width:300px' id='services' name='services' multiple='multiple'>";
    _searchhtml += "                                         <option value='1'>HCT</option>";
    _searchhtml += "                                         <option value='2'>OVC</option>";
    _searchhtml += "                                         <option value='3'>PMTCT Counselling and Testing</option>";
    _searchhtml += "                                         <option value='4'>PMTCT ARV Provsioning</option>";
    _searchhtml += "                                         <option value='5'>ARV Assessment</option>";
    _searchhtml += "                                         <option value='1'>ARV Adherence</option>";
    _searchhtml += "                                         <option value='2'>ARV Provisoning</option>";
    _searchhtml += "                                         <option value='3'>STI</option>";
    _searchhtml += "                                         <option value='4'>TB</option>";
    _searchhtml += "                                         <option value='5'>Advocacy</option>";
    _searchhtml += "                                         <option value='1'>Awareness</option>";
    _searchhtml += "                                         <option value='2'>Children Services</option>";
    _searchhtml += "                                         <option value='3'>Counselling</option>";
    _searchhtml += "                                         <option value='1'>Home and Community Based Care</option>";
    _searchhtml += "                                         <option value='2'>Information Provision and Referral Services</option>";
    _searchhtml += "                                         <option value='3'>Legal Assistance</option>";
    _searchhtml += "                                         <option value='4'>Nutritional Support</option>";
    _searchhtml += "                                         <option value='5'>Hospice and Palliative Care</option>";
    _searchhtml += "                                         <option value='1'>Primary Health Care</option>";
    _searchhtml += "                                         <option value='2'>Youth and Sexual Education Programmes</option>";
    _searchhtml += "                                         <option value='3'>Rape and Domestic Violence Victim Support</option>";
    _searchhtml += "                                         <option value='5'>Paediatric AIDS and Clinical Treatment</option>";
    _searchhtml += "                                         <option value='4'>Income Generation (Coming Soon)</option>";
    _searchhtml += "                                         <option value='5'>HIV/AIDS Programmes (Coming Soon)</option>";
    _searchhtml += "                                         <option value='4'>Training and Development (Coming Soon)</option>";
    _searchhtml += "                                     </select><br/><br/>";
    _searchhtml += "                                     <h8>Sectors:</h8>";
    _searchhtml += "                                     <select style='width:300px' id='category' name='category' multiple='multiple'>";
    _searchhtml += "                                     </select><br/><br/>";
    _searchhtml += "                                     <h8>Enter your location to find the closest store:</h8>";
    _searchhtml += "                                     <input type='text' onfocus='changeLocationInputState(this.id)' value='West Street, Sandton' id='roadname' style='color:#C0C0C0;width:95%;' /><br/><br/>";
    _searchhtml += "                     	            <button id='btnSec1'>Find</button>";
    _searchhtml += "                     	            <div id='divValidation' class='ui-widget' style='display:none;float: right'>";
    _searchhtml += "                     	            <div class='ui-state-error ui-corner-all' style='float: right;padding: 0 .5em;'>";
    _searchhtml += "                     	                <p><span class='ui-icon ui-icon-alert' style='float: right; margin-right: .3em;'></span>";
    _searchhtml += "                     	                <strong></strong> Please enter your Location</p>";
    _searchhtml += "                     	            </div>";
    _searchhtml += "                     	            </div><div class='cleared'></div>";
    _searchhtml += "                                 </form>";
    _searchhtml += "                             </div>";
    _searchhtml += "                             <div class='cleared'></div>";
    _searchhtml += "                             <div class='panel' style='border-color:" + framebordercolor2HEX + ";background-color:#FFFFFF;z-index:7;display:none;' id='p1panel1'>";
    _searchhtml += "                                 <form method='get' id='Form2' action='javascript:void(0)'>";
    _searchhtml += "                                     <h8>Services:</h8>";
    _searchhtml += "                                     <select style='width:300px' id='cbo1' name='cbo1'>";
    _searchhtml += "                                         <option value='1'>HCT</option>";
    _searchhtml += "                                         <option value='2'>OVC</option>";
    _searchhtml += "                                         <option value='3'>PMTCT Counselling and Testing</option>";
    _searchhtml += "                                         <option value='4'>PMTCT ARV Provsioning</option>";
    _searchhtml += "                                         <option value='5'>ARV Assessment</option>";
    _searchhtml += "                                         <option value='6'>ARV Adherence</option>";
    _searchhtml += "                                         <option value='7'>ARV Provisoning</option>";
    _searchhtml += "                                         <option value='8'>STI</option>";
    _searchhtml += "                                         <option value='9'>TB</option>";
    _searchhtml += "                                         <option value='10'>Advocacy</option>";
    _searchhtml += "                                         <option value='11'>Awareness</option>";
    _searchhtml += "                                         <option value='12'>Children Services</option>";
    _searchhtml += "                                         <option value='13'>Counselling</option>";
    _searchhtml += "                                         <option value='14'>Home and Community Based Care</option>";
    _searchhtml += "                                         <option value='15'>Information Provision and Referral Services</option>";
    _searchhtml += "                                         <option value='16'>Legal Assistance</option>";
    _searchhtml += "                                         <option value='17'>Nutritional Support</option>";
    _searchhtml += "                                         <option value='18'>Hospice and Palliative Care</option>";
    _searchhtml += "                                         <option value='19'>Primary Health Care</option>";
    _searchhtml += "                                         <option value='20'>Youth and Sexual Education Programmes</option>";
    _searchhtml += "                                         <option value='21'>Rape and Domestic Violence Victim Support</option>";
    _searchhtml += "                                         <option value='22'>Paediatric AIDS and Clinical Treatment</option>";
    _searchhtml += "                                         <option value='23'>Income Generation (Coming Soon)</option>";
    _searchhtml += "                                         <option value='24'>HIV/AIDS Programmes (Coming Soon)</option>";
    _searchhtml += "                                         <option value='25'>Training and Development (Coming Soon)</option>";
    _searchhtml += "                                     </select><br/><br/>";
    _searchhtml += "                                     <h8>Sectors:</h8>";
    _searchhtml += "                                     <select style='width:300px' id='cbo2' name='cbo2'>";
    _searchhtml += "                                     </select><br/><br/>";
    _searchhtml += "                                     <h8>Organisations:</h8>";
    _searchhtml += "                                     <select style='width:300px' id='cboOrg' name='cboOrg'>";
    _searchhtml += "                                     </select><br/><br/>";
    _searchhtml += "                     	             <button id='btnSelectStore'>Locate</button>";
    _searchhtml += "                                     <div id='divloaderTab2' style='float:right;'></div>";
    _searchhtml += "                                 </form>";
    _searchhtml += "                             </div>";
    _searchhtml += "                         </div>";
    _searchhtml += "                     </div>";
    _searchhtml += "                 </div>";
    array_of_services = null;
    array_of_sectors = null;
    $("#services").multiselect("uncheckAll");
    $("#category").multiselect("uncheckAll");
} 

var _resulthtml = "";
var laststep = "";
function showlocresults() {
    document.getElementById("p1panel1").style.display = "none";
    document.getElementById('dyn1').innerHTML = "";
    _resulthtml = "";
    _resulthtml += "                                <div class='art-BlockContent' style='height:100%'>";
    _resulthtml += "                                    <div class='art-BlockContent-body' style='height:100%'>";
    _resulthtml += "                                            <div id='sidebar1Content' style='background-color: transparent; position: relative; float:left;width:250px;min-height:400px;height:100%'>";
    _resulthtml += "                                                <div class='tab' style='font-weight: bold; background: url(images/Tabs/tab_" + searchTab + ".png) no-repeat; left: 0px; top: 0px; z-index: 8' id='p1tab0'";
    _resulthtml += "                                                onclick='selectTab(0)'><li>Search Location</li></div>";
    _resulthtml += "                                                <div class='tab' style='font-weight: bold; background: url(images/Tabs/tab_" + storesTab + ".png) no-repeat;left: 157px; top: 0px; z-index: 7' id='p1tab1'";
    _resulthtml += "                                                onclick='selectTab(1)'><li>Service Facilities</li></div>";
    _resulthtml += "                                                <div class='panel' style='border-color:" + framebordercolor1HEX + ";background-color: #FFFFFF; z-index: 8' id='p1panel0' runat='server'>";
    _resulthtml += "                                                    <div>";
    _resulthtml += "                                                        <span id='road_data'>";
    _resulthtml += "                                                            <table class='loadertable'>";
    _resulthtml += "                                                                <tr><td><img src='images/Loader/ajax-loader.gif' alt='Loader' class='loaderimage'></td></tr><br/>";
    _resulthtml += "                                                            </table>";
    _resulthtml += "                                                        </span>";
    _resulthtml += "                     	                                <button id='back'>Back</button>";
    _resulthtml += "                                                    </div>";
    _resulthtml += "                                               </div>";
    _resulthtml += "                                               <div class='panel' style='border-color:" + framebordercolor2HEX + ";background-color: #FFFFFF;  z-index: 7' id='p1panel1'>";
    _resulthtml += "                                                    <div>";
    _resulthtml += "                                                        <h8>Services:</h8>";
    _resulthtml += "                                                        <select style='width:300px' id='cbo1' name='cbo1'>";
    _resulthtml += "                                                            <option value='1'>HCT</option>";
    _resulthtml += "                                                            <option value='2'>OVC</option>";
    _resulthtml += "                                                            <option value='3'>PMTCT Counselling and Testing</option>";
    _resulthtml += "                                                            <option value='4'>PMTCT ARV Provsioning</option>";
    _resulthtml += "                                                            <option value='5'>ARV Assessment</option>";
    _resulthtml += "                                                            <option value='1'>ARV Adherence</option>";
    _resulthtml += "                                                            <option value='2'>ARV Provisoning</option>";
    _resulthtml += "                                                            <option value='3'>STI</option>";
    _resulthtml += "                                                            <option value='4'>TB</option>";
    _resulthtml += "                                                            <option value='5'>Advocacy</option>";
    _resulthtml += "                                                            <option value='1'>Awareness</option>";
    _resulthtml += "                                                            <option value='2'>Children Services</option>";
    _resulthtml += "                                                            <option value='3'>Counselling</option>";
    _resulthtml += "                                                            <option value='1'>Home and Community Based Care</option>";
    _resulthtml += "                                                            <option value='2'>Information Provision and Referral Services</option>";
    _resulthtml += "                                                            <option value='3'>Legal Assistance</option>";
    _resulthtml += "                                                            <option value='4'>Nutritional Support</option>";
    _resulthtml += "                                                            <option value='5'>Hospice and Palliative Care</option>";
    _resulthtml += "                                                            <option value='1'>Primary Health Care</option>";
    _resulthtml += "                                                            <option value='2'>Youth and Sexual Education Programmes</option>";
    _resulthtml += "                                                            <option value='3'>Rape and Domestic Violence Victim Support</option>";
    _resulthtml += "                                                            <option value='5'>Paediatric AIDS and Clinical Treatment</option>";
    _resulthtml += "                                                            <option value='4'>Income Generation (Coming Soon)</option>";
    _resulthtml += "                                                            <option value='5'>HIV/AIDS Programmes (Coming Soon)</option>";
    _resulthtml += "                                                            <option value='4'>Training and Development (Coming Soon)</option>";
    _resulthtml += "                                                        </select><br/><br/>";
    _resulthtml += "                                                        <h8>Sectors:</h8>";
    _resulthtml += "                                                        <select style='width:300px' id='cbo2' name='cbo2'>";
    _resulthtml += "                                                        </select><br/><br/>";
    _resulthtml += "                                                        <h8>Organisations:</h8>";
    _resulthtml += "                                                        <select style='width:300px' id='cboOrg' name='cboOrg'>";
    _resulthtml += "                                                        </select><br/><br/>";
    _resulthtml += "                     	                                <button id='btnSelectStore'>Locate</button>";
    _resulthtml += "                                                        <div id='divloaderTab2' style='float:right;'></div>";
    _resulthtml += "                                                    </div";
    _resulthtml += "                                               </div>";
    _resulthtml += "                                          </div>";
    _resulthtml += "                                     </div>";
    _resulthtml += "                                </div>";
    document.getElementById('dyn1').innerHTML = _resulthtml;
    document.getElementById("p1panel1").style.display = "none";
    document.getElementById('p1panel0').style.height = "auto";
    document.getElementById("p1panel0").style.bordercolor = framebordercolor1HEX;
    document.getElementById("p1panel1").style.bordercolor = framebordercolor2HEX;

    $("#cbo1").multiselect({
        multiple: false,
        selectedList: 1,
        noneSelectedText: 'Select Service',
        header: "Choose a Service!",
        autoOpen: false
    })
    $("#cbo1").bind("multiselectclick", function (event, ui) {
        var array_of_checked_values = $("#cbo1").multiselect("getChecked").map(function () {
            return this.title;
        }).get();
        CboChangeService(array_of_checked_values[0]);
    });
    //Multiselect SectorList
    $("#cbo2").multiselect({
        multiple: false,
        noneSelectedText: 'Select Service First',
        selectedList: 1,
        header: "Choose a Category!",
        autoOpen: false
    });
    $("#cbo2").bind("multiselectclick", function (event, ui) {
        var array_of_checked_values = $("#cbo2").multiselect("getChecked").map(function () {
            return this.title;
        }).get();
        CboChangeSector(array_of_checked_values[0]);
    });
    //Multiselect Organisations
    $("#cboOrg").multiselect({
        multiple: false,
        noneSelectedText: 'Select Sector First',
        selectedList: 1,
        header: "Choose a Organisation!",
        autoOpen: false
    });
    $("#cboOrg").bind("multiselectclick", function (event, ui) {
        var array_of_checked_values = $("#cboOrg").multiselect("getChecked").map(function () {
            return this.value;
        }).get();
        CboChangeOrg(array_of_checked_values[0]);
    });
    setIcons();
    laststep = "searchresults";
}

function showLoader() {

}

function setRoadData(fromGen) {
    roaddata = fromGen;
}

var roaddata = "";
//var storedata = "";
function back() {
    document.getElementById('footersec').innerHTML = _nodirections;
    document.getElementById('footersec').height = "auto";
    if (laststep == "searchresults") 
    {
        document.getElementById('dyn1').innerHTML = _searchhtml;
        document.getElementById('p1panel0').style.height = "auto";
        document.getElementById("p1panel1").style.display = "none";
//        getStoreList();
        //Multiselect Categories
        $("#category").multiselect({
            noneSelectedText: 'Select Sector',
            selectedText: "# of # sectors selected",
            header: "Choose a Sector!",
            autoOpen: false
        });
        //Multiselect Services
        $("#services").multiselect({
            noneSelectedText: 'Select Service',
            selectedText: "# of # services selected",
            header: "Choose a Service!",
            autoOpen: false
        });
        //Multiselect ServicesList
        $("#cbo1").multiselect({
            multiple: false,
            selectedList: 1,
            noneSelectedText: 'Select Service',
            header: "Choose a Service!",
            autoOpen: false
        })
        //Multiselect SectorList
        $("#cbo2").multiselect({
            multiple: false,
            noneSelectedText: 'Select Service First',
            selectedList: 1,
            header: "Choose a Category!",
            autoOpen: false
        });
        //Multiselect Organisations
        $("#cboOrg").multiselect({
            multiple: false,
            noneSelectedText: 'Select Sector First',
            selectedList: 1,
            header: "Choose a Organisation!",
            autoOpen: false
        });
        $("#category").bind("multiselectclick", function (event, ui) {
            array_of_sectors = $("#category").multiselect("getChecked").map(function () {
                return this.title;
            }).get();
        });
        $("#services").bind("multiselectclick", function (event, ui) {
            array_of_services = $("#services").multiselect("getChecked").map(function () {
                return this.title;
            }).get();
        });
        getSectorsMain();
        setIcons();
        laststep = "";
    }
    else {
        if (laststep == "storeresults") {
            document.getElementById('dyn1').innerHTML = _resulthtml;
            document.getElementById('road_data').innerHTML = roaddata;
            document.getElementById('p1panel0').style.height = "auto";
            document.getElementById("p1panel1").style.display = "none";
            //            getStoreList();
            $("#category").multiselect({
                noneSelectedText: 'Select Sector',
                selectedText: "# of # sectors selected",
                header: "Choose a Sector!",
                autoOpen: false
            });
            //Multiselect Services
            $("#services").multiselect({
                noneSelectedText: 'Select Service',
                selectedText: "# of # services selected",
                header: "Choose a Service!",
                autoOpen: false
            });
            //Multiselect ServicesList
            $("#cbo1").multiselect({
                multiple: false,
                selectedList: 1,
                noneSelectedText: 'Select Service',
                header: "Choose a Service!",
                autoOpen: false
            })
            //Multiselect SectorList
            $("#cbo2").multiselect({
                multiple: false,
                noneSelectedText: 'Select Service First',
                selectedList: 1,
                header: "Choose a Category!",
                autoOpen: false
            });
            //Multiselect Organisations
            $("#cboOrg").multiselect({
                multiple: false,
                noneSelectedText: 'Select Sector First',
                selectedList: 1,
                header: "Choose a Organisation!",
                autoOpen: false
            });
            $("#category").bind("multiselectclick", function (event, ui) {
                array_of_sectors = $("#category").multiselect("getChecked").map(function () {
                    return this.title;
                }).get();
            });
            $("#services").bind("multiselectclick", function (event, ui) {
                array_of_services = $("#services").multiselect("getChecked").map(function () {
                    return this.title;
                }).get();
            });
            setIcons();
            laststep = "searchresults";
        }
    }
}

var _nodirections = "";
_nodirections += "     <div class='art-Footer-inner'>";
_nodirections += "         <div style='FONT-SIZE:12px;COLOR:#FEFFFF' class='art-Footer-text'>";
_nodirections += "                 <div style='background-color:#FFFFFF'>";
_nodirections += "                     <img src='images/FPD_LOGO_2008_small.jpg' alt='an image' style='display:inline;padding-right:10px' /><img src='images/CompassLogotext.jpg' alt='an image' style='display:inline;padding-left:10px;padding-right:10px' /><img src='images/hiv911amendedsmall_wk.jpg' alt='an image' style='display:inline;padding-left:40px;padding-right:40px;padding-bottom:20px' /><img src='images/Mapit.jpg' alt='an image' style='display:inline;padding-left:10px;padding-right:10px' /><img src='images/SAHCS.jpg' alt='an image' style='display:inline;padding-left:10px' /><br />";
_nodirections += "                     <img src='images/netherlands.jpg' alt='an image' style='display:inline;padding-right:40px' /><img src='images/USAID.jpg' alt='an image' style='display:inline;padding-left:40px;padding-right:40px' /><img src='images/PEPFAR.jpg' alt='an image' style='display:inline;padding-left:40px;padding-right:40px' /><img src='images/SANAC.jpg' alt='an image' style='display:inline;padding-left:40px;padding-right:40px' /><img src='images/DoH_logo.jpg' alt='an image' style='display:inline;padding-left:40px' />";
_nodirections += "                 </div>";
_nodirections += "                 <br />";
_nodirections += "                 Copyright &copy; MapIT 2011 ---- All Rights Reserved.";
_nodirections += "         </div>";
_nodirections += "     </div>";
_nodirections += "     <div id='footerSec1' class='art-Footer-background'></div>";

var _directions = "";

function createIframe(iframeName, width, height) {
    var iframe;
    if (document.createElement && (iframe =
        document.createElement('iframe'))) {
        iframe.name = iframe.id = iframeName;
        iframe.width = width;
        iframe.height = height;
        iframe.src = 'http://www.google.co.za';
        document.body.appendChild(iframe);
    }
    return iframe;
}

//<table style='float:right'><tr><td><input type='text' onfocus='changeLocationInputState(this.id)' value='youremail@yourdomain.co.za' id='email' style='color:#C0C0C0;width:170px;height:16px;vertical-align:middle;left:0px;z-index:7'/></table></tr></td>

function setDirections() {
    _directions = "";
    _directions += "                                <div class='art-Footer-inner-directions'>";
    _directions += "                                    <div id='directions' style='background-color: transparent; overflow:hidden;top:0px;position: relative; float: left;width: 878px; height: auto;'></div>";
    _directions += "                                    <div class='tabdirections' style='font-weight: bold; background: url(images/Tabs/tab_" + searchTab + ".png) no-repeat; top: 0px;left: 0px; z-index: 8' id='pdirtab0' onclick='selectTab(0)'>Directions</div>";
    _directions += "                                          <img onclick='printDiv()' src='images/Buttons/print_" + buttoncolor2 + ".png' alt='Print Directions' style='float:right;width:30px;height:30px;vertical-align:middle;padding-right:10px;top:0px;left: 0px;z-index:7'><img id='emailbutton' src='images/Buttons/email_" + buttoncolor2 + ".png' alt='Email Directions' style='float:right;width:30px;height:30px;vertical-align:middle;padding-right:5px;top:0px;left: 0px;z-index: 7'>";
    _directions += "                                          <div id='popupEmail'></div>";
    _directions += "                                          <div style='clear:both'></div>";
    _directions += "                                          <div class='paneldirections' style='border-color:" + framebordercolor2HEX + ";background-color: #FFFFFF; z-index: 8' id='pdirpanel0' runat='server'>";
    _directions += "                                                    <div>";
    _directions += "                                                     <span style='text-align:left' id='route_data'>";
    _directions += "                                                         <table class='loadertable'>";
    _directions += "                                                             <tr><td><img src='images/Loader/ajax-loader.gif' alt='Loader' class='loaderimage'></td></tr><br/>";
    _directions += "                                                         </table>";
    _directions += "                                                     </span>"
    _directions += "                                               </div>";
    _directions += "                                          </div>";
    _directions += "                                    </div>";
    _directions += "                                </div>";
    _directions += "                                <div class='art-Footer-inner'>";
    _directions += "                                    <div id='footerinner' style='FONT-SIZE:12px;COLOR:#000000' class='art-Footer-text'>";
    _directions += "                                          <div style='background-color:#FFFFFF'>";
    _directions += "                                          </div>";
    _directions += "                                          <br/>";
    _directions += "                                          Copyright &copy; MapIT 2011 ---- All Rights Reserved.";
    _directions += "                                    </div>";
    _directions += "                                </div>";
    _directions += "                                <div id='footerSec1' class='art-Footer-background'></div>";
}

var laststepdir = "storeresults";
function setfooter() {
    setDirections();
    document.getElementById('footersec').innerHTML = _directions;
    laststepdir = "directions";
}

function next() {
}

var _storeresulthtml = "";
function storeresults() {
    document.getElementById('dyn1').innerHTML = "";
    _storeresulthtml = "";
    _storeresulthtml += "                                <div class='art-BlockContent' style='height:100%'>";
    _storeresulthtml += "                                    <div class='art-BlockContent-body' style='height:100%'>";
    _storeresulthtml += "                                            <div id='sidebar1Content' style='background-color: transparent; position: relative; float:left;width:250px;min-height:400px;height:100%'>";
    _storeresulthtml += "                                                <div class='tab' style='font-weight: bold; background: url(images/Tabs/tab_" + searchTab + ".png) no-repeat; left: 0px; top: 0px; z-index: 8' id='p1tab0'";
    _storeresulthtml += "                                                onclick='selectTab(0)'><li>Search Location</li></div>";
    _storeresulthtml += "                                                <div class='tab' style='font-weight: bold; background: url(images/Tabs/tab_" + storesTab + ".png) no-repeat;left: 157px; top: 0px; z-index: 7' id='p1tab1'";
    _storeresulthtml += "                                                onclick='selectTab(1)'><li>Service Facilities</li></div>";
    _storeresulthtml += "                                                <div class='panel' style='border-color:" + framebordercolor1HEX + ";background-color: #FFFFFF; z-index: 8;height:auto' id='p1panel0' runat='server'>";
    _storeresulthtml += "                                                    <div>";
    _storeresulthtml += "                                                        <span id='StoreData'>";
    _storeresulthtml += "                                                            <table class='loadertable'>";
    _storeresulthtml += "                                                                <tr><td><img src='images/Loader/ajax-loader.gif' alt='Loader' class='loaderimage'></td></tr><br/>";
    _storeresulthtml += "                                                            </table>";
    _storeresulthtml += "                                                        </span>";
    _storeresulthtml += "                     	                                 <button id='back'>Back</button>";
    _storeresulthtml += "                                                    </div>";
    _storeresulthtml += "                                               </div>";
    _storeresulthtml += "                                               <div class='panel' style='border-color:" + framebordercolor2HEX + ";  z-index: 7;height:auto' id='p1panel1'>";
    _storeresulthtml += "                                                    <div>";
    _storeresulthtml += "                                                            <h8>Services:</h8>";
    _storeresulthtml += "                                                            <select style='width:300px' id='cbo1' name='cbo1'>";
    _storeresulthtml += "                                                                <option value='1'>HCT</option>";
    _storeresulthtml += "                                                                <option value='2'>OVC</option>";
    _storeresulthtml += "                                                                <option value='3'>PMTCT Counselling and Testing</option>";
    _storeresulthtml += "                                                                <option value='4'>PMTCT ARV Provsioning</option>";
    _storeresulthtml += "                                                                <option value='5'>ARV Assessment</option>";
    _storeresulthtml += "                                                                <option value='1'>ARV Adherence</option>";
    _storeresulthtml += "                                                                <option value='2'>ARV Provisoning</option>";
    _storeresulthtml += "                                                                <option value='3'>STI</option>";
    _storeresulthtml += "                                                                <option value='4'>TB</option>";
    _storeresulthtml += "                                                                <option value='5'>Advocacy</option>";
    _storeresulthtml += "                                                                <option value='1'>Awareness</option>";
    _storeresulthtml += "                                                                <option value='2'>Children Services</option>";
    _storeresulthtml += "                                                                <option value='3'>Counselling</option>";
    _storeresulthtml += "                                                                <option value='1'>Home and Community Based Care</option>";
    _storeresulthtml += "                                                                <option value='2'>Information Provision and Referral Services</option>";
    _storeresulthtml += "                                                                <option value='3'>Legal Assistance</option>";
    _storeresulthtml += "                                                                <option value='4'>Nutritional Support</option>";
    _storeresulthtml += "                                                                <option value='5'>Hospice and Palliative Care</option>";
    _storeresulthtml += "                                                                <option value='1'>Primary Health Care</option>";
    _storeresulthtml += "                                                                <option value='2'>Youth and Sexual Education Programmes</option>";
    _storeresulthtml += "                                                                <option value='3'>Rape and Domestic Violence Victim Support</option>";
    _storeresulthtml += "                                                                <option value='5'>Paediatric AIDS and Clinical Treatment</option>";
    _storeresulthtml += "                                                                <option value='4'>Income Generation (Coming Soon)</option>";
    _storeresulthtml += "                                                                <option value='5'>HIV/AIDS Programmes (Coming Soon)</option>";
    _storeresulthtml += "                                                                <option value='4'>Training and Development (Coming Soon)</option>";
    _storeresulthtml += "                                                            </select><br/><br/>";
    _storeresulthtml += "                                                            <h8>Sectors:</h8>";
    _storeresulthtml += "                                                            <select style='width:300px' id='cbo2' name='cbo2'>";
    _storeresulthtml += "                                                            </select><br/><br/>";
    _storeresulthtml += "                                                            <h8>Organisations:</h8>";
    _storeresulthtml += "                                                            <select style='width:300px' id='cboOrg' name='cboOrg'>";
    _storeresulthtml += "                                                            </select><br/><br/>";
    _storeresulthtml += "                     	                                     <button id='btnSelectStore'>Locate</button>";
    _storeresulthtml += "                                                            <div id='divloaderTab2' style='float:right;'></div>";
    _storeresulthtml += "                                                    </div";
    _storeresulthtml += "                                               </div>";
    _storeresulthtml += "                                    </div>";
    _storeresulthtml += "                                </div>";
    document.getElementById('dyn1').innerHTML = _storeresulthtml;
    document.getElementById('p1panel0').style.height = "auto";
    document.getElementById("p1panel1").style.display = "none";
//    $("#sidebar").css("min-height", "100%");
    document.getElementById("p1panel0").style.bordercolor = framebordercolor1HEX;
    document.getElementById("p1panel1").style.bordercolor = framebordercolor2HEX;
//    getStoreList();
    setIcons();
    //Multiselect ServicesList
    $("#cbo1").multiselect({
        multiple: false,
        selectedList: 1,
        noneSelectedText: 'Select Service',
        header: "Choose a Service!",
        autoOpen: false
    })
    //Multiselect SectorList
    $("#cbo2").multiselect({
        multiple: false,
        noneSelectedText: 'Select Service First',
        selectedList: 1,
        header: "Choose a Category!",
        autoOpen: false
    });
    //Multiselect Organisations
    $("#cboOrg").multiselect({
        multiple: false,
        noneSelectedText: 'Select Sector First',
        selectedList: 1,
        header: "Choose a Organisation!",
        autoOpen: false
    });
    $("#cbo1").attr('selectedIndex', '-1');
    laststep = "storeresults";
}

function getroads() {
    //get the road name off the page
    document.getElementById("p1panel1").style.display = "none";
    var roadname = document.getElementById("roadname").value;
    showlocresults();
    //call the URL with all your data
    var URL = "http://www.mapservice.co.za/api/search?key=LOQPUAYXGTCWXJHGYBFDRCSPHCKWBTBH&fmt=js&jscb=searchresults&s1=" + roadname

    //this function is in our streetmaps 
    callObj = new JSONscriptRequest(URL);
    callObj.Go(false);
}

function searchresults(data) {
    //data returned is is object 
    var dirResults = data.results;
    //must find at least one result then position map
//    var html = "<table border=0 ><tr><td></td>"
    var html = "<ul id='roadsList'>";
    for (var i = 0; i < dirResults.match.length; ++i) {
        if (i < 10){
            var match = dirResults.match[i].match;
            var type = dirResults.match[i].type;
            var desc = dirResults.match[i].desc;
            //                "<tr><Td>" + match + "</td><td>" + type + "</td><td onclick='getweather(" + dirResults.match[i].x + "," + dirResults.match[i].y + ")'><a href='#get'>" + desc + "</a></td>";
//            html += "<tr><td style='FONT-SIZE: 11px;COLOR: #000000' class=beigetext onclick='getStores(" + dirResults.match[i].x + "," + dirResults.match[i].y + ")'><a href='#get'>" + desc + "</a></td>";
            html += "<li id='road" + i + "' class='ui-state-default' style='FONT-SIZE: 11px' title='" + dirResults.match[i].x + "' tag='" + dirResults.match[i].y + "'>" + (i + 1) + ": " + desc + "</li>";
            //Button back

        }
    }
//    html += "</table>";
    html += "</ul>";
    setRoadData(html);
    document.getElementById("road_data").innerHTML = html;
    $("#roadsList").sortable();
    $("#roadsList li").live("click", function () {
        getStores($(this).attr("title"),$(this).attr("tag"));
    });
    setIcons();
}

function routeresults(data) {
    //data returned is is object 
    var dirRouteResults = data.results;
    var noresults = dirRouteResults.noresults;
    if (data.results.error != null) {
        alert(data.results.error.message);
    }

    //must find at least one result then position map
    var html = "<table id='routedataTable' colspan='5' style='border:1;border-color:" + framecolor + ";border-style:dashed;border-collapse:separate;width:100%'>";
    if (bannerpath != '') {
        html += "<tr><td colspan='5'><img id='dirImage' src='" + bannerpath + "' style='float:left;vertical-align:middle;width:845px'></td></tr>";
    }
    html += "<tr>";
    html += "<th style'padding-left:60px'><b> Step </b></th>";
    html += "<th style'padding-left:60px'><b> Direction details </b></th>";
    html += "<th style'padding-left:100px'><b> Step Distance </b></th>";
    html += "<th style'padding-left:100px'><b> Total Distance </b></th>";
    html += "<th style'padding-left:100px'><b> Speed </b></th>";
    html += "</tr>";
    for (var i = 0; i < dirRouteResults.route.length; ++i) {
        var stepno = dirRouteResults.route[i].step;
        var routedata = dirRouteResults.route[i].data;
        var routedatadetail = routedata.split("|");
        if (i == 0) {
            html += "<tr>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'>" + stepno + "</td>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'> Start at " + routedatadetail[0] + " " + routedatadetail[1] + "</td>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'> Travel for " + routedatadetail[2] + "</td>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'>" + formatNumbers(routedatadetail[3].replace('m','')/1000,2) + " km</td>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'>" + Math.floor(routedatadetail[6]) + " km/h</td>";
            html += "</tr>";
        }
        else {
            html += "<tr>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'>" + stepno + "</td>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'>" + routedatadetail[0] + " " + routedatadetail[1] + "</td>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'> Travel for " + routedatadetail[2] + "</td>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'>" + formatNumbers(routedatadetail[3].replace('m', '') / 1000, 2) + " km</td>";
            html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'>" + Math.floor(routedatadetail[6]) + " km/h</td>";
            html += "</tr>";
        }
    }
    html += "<tr>";
    html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'>" + (i + 1) + "</td>";
    html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'> Destination reached</td>";
    html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'></td>";
    html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'></td>";
    html += "<td style='FONT-SIZE: 11px;COLOR: #000000;text-align:left'></td>";
    html += "</tr>";
    html += "</table>";
    document.getElementById("route_data").innerHTML = html;
    currentDirData = html;
//    var tblHeight = document.getElementById('routedataTable').clientHeight;
//    document.getElementById("footersec").style.height = (140 + tblHeight);
//    document.getElementById("pdirpanel0").style.height = (tblHeight);
//    document.getElementById("directions").style.height = (tblHeight + 55);
}

var currentX
var currentY

function getHCTNow(data) {

    var dirResults = data.results;
    var noresults = dirResults.noresults;

    if (noresults != 'gotresults') {

        return false;

    }

    var htm_main;
    var htm_popup;

    Name = dirResults.data[0].Name;
    HCTx = dirResults.data[0].x;
    HCTy = dirResults.data[0].y;
    Address = dirResults.data[0].Address1;
    Suburb = dirResults.data[0].Suburb;
    Town = dirResults.data[0].Town;
    Telephone = dirResults.data[0].Telephone;
    Distance = dirResults.data[0].Distance;

    htm_main = "<table id='storetable' class='storetable'>";
    layerPoints.RemoveAllPoints();
    var j = 0;
    for (var i = 0; i < dirResults.data.length; ++i) {
        if (i == 0) 
        {
            j = 1;
        }
        else 
        {
            if (i > 0) 
            {
                j = j + 1;
            }
        }
        var t = layerPoints.AddPoint(dirResults.data[i].x, dirResults.data[i].y, dirResults.data[i].Name, 'id');
        if (j < 10)
        {
            t.SetIcon("http://storelocator.mapservice.co.za/Images/MapIcons/" + icontype + "_" + iconcolour + "_0" + j + "_" + iconsize + ".png");
        }
        else
        {
            if (j >= 10)
            {
                t.SetIcon("http://storelocator.mapservice.co.za/Images/MapIcons/" + icontype + "_" + iconcolour + "_" + j + "_" + iconsize + ".png");
            }
        }
        //        t.SetIcon("http://storelocator.mapservice.co.za/Images/MapIcons/" + icontype + "_" + iconcolour + "_0" + j + "_" + iconsize + ".png");
//        t.SetIconSize(24, 29);
        if (iconsize == "24") {
            t.SetIconSize(24, 29);
            if (icontype == "3d") {
                t.SetIconSize(24, 44);
            }
            if (icontype == "rd") {
                t.SetIconSize(24, 37);
            }
        }
        else {
            if (iconsize == "32") {
                t.SetIconSize(32, 43);
                if (icontype == "3d") {
                    t.SetIconSize(32, 60);
                }
                if (icontype == "rd") {
                    t.SetIconSize(32, 54);
                }
            }
        }

        t.SetTooltip(dirResults.data[i].Name + ", " + dirResults.data[i].Address1 + ", " + dirResults.data[i].Suburb + ", " + dirResults.data[i].Town + ", " + dirResults.data[i].Telephone);
        t.SetIconAnchor("center", "bottom");
        t.SetLabelAnchor("iconcenter", "iconcenter");
        t.SetClickBehaviour("toggle_icon");
        t.SetStyle("icon");
        Name = dirResults.data[i].Name.replace(/[^a-zA-Z 0-9]+/g, '');
        HCTx = dirResults.data[i].x;
        HCTy = dirResults.data[i].y;
        Address = dirResults.data[i].Address1.replace(/[^a-zA-Z 0-9]+/g, '');
        Suburb = dirResults.data[i].Suburb.replace(/[^a-zA-Z 0-9]+/g, '');
        Town = dirResults.data[i].Town.replace(/[^a-zA-Z 0-9]+/g, '');
        Telephone = dirResults.data[i].Telephone.replace(/[^a-zA-Z 0-9]+/g, '');
        var numDist = parseFloat(dirResults.data[i].Distance);
        numDist = numDist.toFixed(2);
        Distance = numDist;
        htm_main += "<tr>";
        htm_main += "<td>" + Name + "</td>";
        htm_main += "<td>306,939,000</td>";
        htm_main += "<td>9,826,630 km2</td>";
        htm_main += "<td>English</td>";
        htm_main += "<td><div class='arrow'></div></td>";
        htm_main += "</tr>";
        htm_main += "<tr>";
        htm_main += "<td colspan='5'>";
        htm_main += "  <h4>Additional information</h4>";
        htm_main += "  <ul>";
        htm_main += "    <li><a onclick='JumpToHCT(" + HCTx + "," + HCTy + ")' href='#get'>Get Directions</a></li>";
        htm_main += "  </ul>";
        htm_main += "</td>";
        htm_main += "</tr>";
    }
    htm_main += "</table>"
    document.getElementById('StoreData').innerHTML = htm_main;
    myMap.Init();
}

function getStoresClosest(data) {

    var dirResults = data.results;
    var noresults = dirResults.noresults;

    if (noresults != 'gotresults' || data.results.data.length < 1) {
        var htm_main = "";
        htm_main += "<ul>";
        htm_main += "   <li id='notice' class='ui-state-default' style='FONT-SIZE: 11px'>No Results Found</li>";
        htm_main += "</ul>";
        htm_main += "<button id='btnRestart'>Restart</button><br/><br/>";
        document.getElementById('StoreData').innerHTML = htm_main;
        document.getElementById('p1panel0').style.height = "auto";
        $("#btnRestart").button({
            icons: {
                primary: "ui-icon-arrowreturnthick-1-w"
            }
        });
        $("#btnRestart").live("click", function () {
            document.getElementById('footersec').innerHTML = _nodirections;
            document.getElementById('footersec').height = "auto";
            document.getElementById('dyn1').innerHTML = _searchhtml;
            document.getElementById('p1panel0').style.height = "auto";
            document.getElementById("p1panel1").style.display = "none";
            //Multiselect Categories
            $("#category").multiselect({
                noneSelectedText: 'Select Sector',
                selectedText: "# of # sectors selected",
                header: "Choose a Sector!",
                autoOpen: false
            });
            //Multiselect Services
            $("#services").multiselect({
                noneSelectedText: 'Select Service',
                selectedText: "# of # services selected",
                header: "Choose a Service!",
                autoOpen: false
            });
            //Multiselect ServicesList
            $("#cbo1").multiselect({
                multiple: false,
                selectedList: 1,
                noneSelectedText: 'Select Service',
                header: "Choose a Service!",
                autoOpen: false
            })
            //Multiselect SectorList
            $("#cbo2").multiselect({
                multiple: false,
                noneSelectedText: 'Select Service First',
                selectedList: 1,
                header: "Choose a Category!",
                autoOpen: false
            });
            //Multiselect Organisations
            $("#cboOrg").multiselect({
                multiple: false,
                noneSelectedText: 'Select Sector First',
                selectedList: 1,
                header: "Choose a Organisation!",
                autoOpen: false
            });
            $("#category").bind("multiselectclick", function (event, ui) {
                array_of_sectors = $("#category").multiselect("getChecked").map(function () {
                    return this.title;
                }).get();
            });
            $("#services").bind("multiselectclick", function (event, ui) {
                array_of_services = $("#services").multiselect("getChecked").map(function () {
                    return this.title;
                }).get();
            });
            getSectorsMain();
            setIcons();
            laststep = "";    
        });
        return false;
    }

    var htm_main = "";
    var htm_popup;

    Name = dirResults.data[0].Name;
    HCTx = dirResults.data[0].x;
    HCTy = dirResults.data[0].y;
//    Address = dirResults.data[0].Building;
    Address = dirResults.data[0].Address;
    Town = dirResults.data[0].Town;
    Suburb = dirResults.data[0].Suburb;
    Telephone = dirResults.data[0].Telephone;
    Distance = dirResults.data[0].Distance;

    htm_main = "<table id='storetable' width='100%'>";
    layerPoints.RemoveAllPoints();
    htm_main += "<tr>";
    htm_main += "<th>No.</th>";
    htm_main += "<th>Store</th>";
    htm_main += "<th></th>";
    htm_main += "</tr>";
    var j = 0;
    for (var i = 0; i < dirResults.data.length; ++i) {
        if (i == 0) {
            j = 1;
        }
        else {
            if (i > 0) {
                j = j + 1;
            }
        }
        var t = layerPoints.AddPoint(dirResults.data[i].x, dirResults.data[i].y, dirResults.data[i].Name, 'id');
        if (j < 10) {
            t.SetIcon("http://storelocator.mapservice.co.za/Images/MapIcons/" + icontype + "_" + iconcolour + "_0" + j + "_" + iconsize + ".png");
        }
        else {
            if (j >= 10) {
                t.SetIcon("http://storelocator.mapservice.co.za/Images/MapIcons/" + icontype + "_" + iconcolour + "_" + j + "_" + iconsize + ".png");
            }
        }
        //        t.SetIcon("http://storelocator.mapservice.co.za/Images/MapIcons/" + icontype + "_" + iconcolour + "_0" + j + "_" + iconsize + ".png");
        //        t.SetIconSize(24, 29);
        if (iconsize == "24") {
            t.SetIconSize(24, 29);
            if (icontype == "3d") {
                t.SetIconSize(24, 44);
            }
            if (icontype == "rd") {
                t.SetIconSize(24, 37);
            }
        }
        else {
            if (iconsize == "32") {
                t.SetIconSize(32, 43);
                if (icontype == "3d") {
                    t.SetIconSize(32, 60);
                }
                if (icontype == "rd") {
                    t.SetIconSize(32, 54);
                }
            }
        }

        t.SetTooltip(dirResults.data[i].Name + ", " + dirResults.data[i].Address + ", " + dirResults.data[i].Town + ", " + dirResults.data[i].Distance);
        t.SetIconAnchor("center", "bottom");
        t.SetLabelAnchor("iconcenter", "iconcenter");
        t.SetClickBehaviour("toggle_icon");
        t.SetStyle("icon");
        Name = dirResults.data[i].Name.replace(/[^a-zA-Z 0-9]+/g, '');
        HCTx = dirResults.data[i].x;
        HCTy = dirResults.data[i].y;
        Address = dirResults.data[i].Address.replace(/[^a-zA-Z 0-9]+/g, '');
        Town = dirResults.data[i].Town.replace(/[^a-zA-Z 0-9]+/g, '');
        Suburb = dirResults.data[i].Suburb.replace(/[^a-zA-Z 0-9]+/g, '');
        Telephone = dirResults.data[i].Telephone.replace(/[^a-zA-Z 0-9]+/g, '');
        var numDist = parseFloat(dirResults.data[i].Distance);
        numDist = numDist.toFixed(2);
        Distance = numDist;
        htm_main += "<tr>";
        if (j < 10) {
            htm_main += "<td><img src='images/MapIcons/" + icontype + '_' + iconcolour + '_0' + j + '_' + iconsize + ".png' width='16px' height='30px' alt='an image'></td>";
        }
        else {
            if (j >= 10) {
                htm_main += "<td><img src='images/MapIcons/" + icontype + '_' + iconcolour + '_' + j + '_' + iconsize + ".png' width='16px' height='30px' alt='an image'></td>";
            }
        }
        htm_main += "<td>" + Name + "</td>";
        htm_main += "<td><div class='arrow'></div></td>";
        htm_main += "</tr>";
        htm_main += "<tr>";
        htm_main += "<td colspan='3'>";
        htm_main += "  <h6>Additional Information</h6>";
        htm_main += "  <ul>";
        htm_main += "       <li style='padding-left:10px'><b>Address: </b>" + Address + "</li>";
        htm_main += "       <li style='padding-left:10px'><b>Suburb: </b>" + Suburb + "</li>";
        htm_main += "       <li style='padding-left:10px'><b>Town: </b>" + Town + "</li>";
        htm_main += "       <li style='padding-left:10px'><b>Tel: </b>" + Telephone + "</li>";
        htm_main += "       <li style='padding-left:10px'><b>Distance: </b>" + (formatNumbers(Distance / 1000, 3)) + " km</li>";
        htm_main += "       <span class='art-button-wrapper' style='float:right'>";
        htm_main += "           <span class='l'> </span>";
        htm_main += "           <span class='r'> </span>";
        htm_main += "           <button class='btnGetDirections' style='top:0px' onclick='JumpToHCT(" + HCTx + "," + HCTy + ")'>Get Directions</button>";
        htm_main += "       </span>";
        htm_main += "  </ul>";
        htm_main += "</td>";
        htm_main += "</tr>";
    }
    htm_main += "</table>"
    document.getElementById('StoreData').innerHTML = htm_main;
    document.getElementById('p1panel0').style.height = "auto";
    $("#storetable").jExpand();
    myMap.Init();
}

function formatNumbers(expr, decplaces) {
    // raise incoming value by power of 10 times the
    // number of decimal places; round to an integer; convert to string
    var str = "" + Math.round(eval(expr) * Math.pow(10, decplaces))
    // pad small value strings with zeros to the left of rounded number
    while (str.length <= decplaces) {
        str = "0" + str
    }
    // establish location of decimal point
    var decpoint = str.length - decplaces
    // assemble final result from: (a) the string up to the position of
    // the decimal point; (b) the decimal point; and (c) the balance
    // of the string. Return finished product.
    return str.substring(0, decpoint) + "." + str.substring(decpoint, str.length);
}


function getStores(x, y) {
    currentX = x
    currentY = y
    layerMyPoint.RemoveAllPoints();
    t = layerMyPoint.AddPoint(x, y, 'You are Here', 'id');
    t.SetIcon("http://storelocator.mapservice.co.za/Images/MapIcons/" + urhicontype + "_youarehere_" + urhiconcolour + "_" + urhiconsize + ".png");
    t.SetIconSize(32, 46);
    if (urhicontype == "3d") {
       t.SetIconSize(32, 58);
    }
   if (urhicontype == "rd") {
       t.SetIconSize(32, 48);
    }
    t.SetTooltip('You are Here');
    t.SetIconAnchor("center", "bottom");
    t.SetLabelAnchor("iconcenter", "iconcenter");
    t.SetClickBehaviour("toggle_icon");
    t.SetStyle("icon");
    myMap.Jump(x, y, 0.05);
    myMap.Init();
    var services = null;
    var sectors = null;
    for (var i = 0; i < array_of_services.length; ++i) {
        if (i == 0) {
            services = array_of_services[i];
        }
        else {
            services = services + "," + array_of_services[i];
        }
    }
    for (var j = 0; j < array_of_sectors.length; ++j) {
        if (j == 0) {
            sectors = array_of_sectors[j];
        }
        else {
            sectors = sectors + "," + array_of_sectors[j];
        }
    }
//    URL = "http://storelocator.mapservice.co.za/retrieveStoresClosest.asp?x=" + x + "&y=" + y + "&clc=" + clientIdentifier + "&rc=5&jscb=getStoresClosest";
    URL = "http://compass.mapservice.co.za/jcon_HCT.asp?x=" + x + "&y=" + y + "&clc=" + clientIdentifier + "&rc=15&jscb=getStoresClosest&service=" + services + "&sector=" + sectors;
    callObj = new JSONscriptRequest(URL);
    callObj.Go(false);
    storeresults();
}

var selectedService = "";
function CboChangeService(dropdown) {
    selectedService = dropdown;
    getSectors(selectedService);
}

var selectedSector = "";
function CboChangeSector(dropdown)
{
    selectedSector = dropdown;
    getOrgs(selectedService, selectedSector);
}

var selectedOrg = "";
function CboChangeOrg(dropdown) {
    selectedOrg = dropdown;
}

function jumpToStore() {
        layerStoreList.RemoveAllPoints();
//    if (document.getElementById("cbo2").selectedindex != 0) {
        var storeloc = selectedOrg.split(",");
        t = layerStoreList.AddPoint(storeloc[0], storeloc[1], storeloc[2], 'id');
        t.SetIcon("http://compass.mapservice.co.za/Images/MapIcons/" + icontype + "_" + iconcolour + "_01" + "_" + iconsize + ".png");
        t.SetIconSize(24, 44);
        //    if (urhicontype == "3d") {
        //        t.SetIconSize(24, 44);
        //    }
        //    if (urhicontype == "rd") {
        //        t.SetIconSize(32, 48);
        //    }
        t.SetTooltip(storeloc[2]);
        t.SetIconAnchor("center", "bottom");
        t.SetLabelAnchor("iconcenter", "iconcenter");
        t.SetClickBehaviour("toggle_icon");
        t.SetStyle("icon");
        myMap.Jump(storeloc[0], storeloc[1], 0.01);
        myMap.Init()
//    }
//    else {
//        return;
//    }
}

var Storedat;
var _storelist = "";

var _sectorlist = "";
function getSectorsList(data) {
    var dirResults = data.results;
    var cboSectors = document.getElementById("cbo2");
    if (cboSectors.hasChildNodes()) {
        while (cboSectors.childNodes.length >= 1) {
            cboSectors.removeChild(cboSectors.firstChild);
        }
    }
    for (var i = 0; i < dirResults.data.length; ++i) {
        Sector = dirResults.data[i].Sector;

        var newOpt = cboSectors.appendChild(document.createElement('option'));
        newOpt.text = Sector;
        newOpt.value = Sector;
    }
    //Multiselect CategoriesList
    UnselectAllFacilitiesStep1();
}

function ClearFacilitiesStep1() {
    var cboSectors = document.getElementById("cbo2");
    if (cboSectors.hasChildNodes()) {
        while (cboSectors.childNodes.length >= 1) {
            cboSectors.removeChild(cboSectors.firstChild);
        }
    }
    $("#cbo2").attr('selectedIndex', '-1');
    $("#cbo2").multiselect("refresh");
    var cboOrgs = document.getElementById("cboOrg");
    if (cboOrgs.hasChildNodes()) {
        while (cboOrgs.childNodes.length >= 1) {
            cboOrgs.removeChild(cboOrgs.firstChild);
        }
    }
    $("#cboOrg").attr('selectedIndex', '-1');
    $("#cboOrg").multiselect("refresh");
}

function UnselectAllFacilitiesStep1() {
    $("#cbo2").attr('selectedIndex', '-1');
    $("#cbo2").multiselect("refresh");
    $("#cboOrg").attr('selectedIndex', '-1');
    $("#cboOrg").multiselect("refresh");
    StopLoaderTab2();
}

function UnselectAllFacilitiesStart() {
    $("#cbo1").attr('selectedIndex', '-1');
    $("#cbo1").multiselect("refresh");
    StopLoaderTab2();
}

function StopLoaderTab2() {
    document.getElementById("divloaderTab2").innerHTML = "";
}

function StartLoaderTab2() {
    document.getElementById("divloaderTab2").innerHTML = "<img src='images/Loader/ajax-loader.gif' alt='Loader' class='loaderimageTab2'>";
}

function ClearFacilitiesStep2() {
    var cboOrgs = document.getElementById("cboOrg");
    if (cboOrgs.hasChildNodes()) {
        while (cboOrgs.childNodes.length >= 1) {
            cboOrgs.removeChild(cboOrgs.firstChild);
        }
    }
    $("#cboOrg").attr('selectedIndex', '-1');
    $("#cboOrg").multiselect("refresh");
}

function UnselectAllFacilitiesStep2() {
    $("#cboOrg").attr('selectedIndex', '-1');
    $("#cboOrg").multiselect("refresh");
    StopLoaderTab2();
}
function getSectors(selService) {
    StartLoaderTab2();
    ClearFacilitiesStep1();
    URL = "http://compass.mapservice.co.za/jcon_Sectors.asp?&jscb=getSectorsList&service=" + selService;
    callObj = new JSONscriptRequest(URL);
    callObj.Go(false);
}

function getSectorsListMain(data) {
    var dirResults = data.results;
    var cboSectors = document.getElementById("category");
    if (cboSectors.hasChildNodes()) {
        while (cboSectors.childNodes.length >= 1) {
            cboSectors.removeChild(cboSectors.firstChild);
        }
    }
    for (var i = 0; i < dirResults.data.length; ++i) {
        Sector = dirResults.data[i].Sector;

        var newOpt = cboSectors.appendChild(document.createElement('option'));
        newOpt.text = Sector;
        newOpt.value = Sector;
    }
    //Multiselect CategoriesList
    $("#category").multiselect("refresh");
}

function getSectorsMain() {
    URL = "http://compass.mapservice.co.za/jcon_SectorsAll.asp?&jscb=getSectorsListMain"
    callObj = new JSONscriptRequest(URL);
    callObj.Go(false);
}

var _orglist = "";
function getOrgList(data) {
    var dirResults = data.results;
    var cboOrgs = document.getElementById("cboOrg");
    if (cboOrgs.hasChildNodes()) {
        while (cboOrgs.childNodes.length >= 1) {
            cboOrgs.removeChild(cboOrgs.firstChild);
        }
    }
    for (var i = 0; i < dirResults.data.length; ++i) {
        Name = dirResults.data[i].Name.replace(/[^a-zA-Z 0-9]+/g, '');
        gisX = dirResults.data[i].x;
        gisY = dirResults.data[i].y;
        Address = dirResults.data[i].Address.replace(/[^a-zA-Z 0-9]+/g, '');
        Suburb = dirResults.data[i].Suburb.replace(/[^a-zA-Z 0-9]+/g, '');
        Town = dirResults.data[i].Town.replace(/[^a-zA-Z 0-9]+/g, '');
        Telephone = dirResults.data[i].Telephone.replace(/[^a-zA-Z 0-9]+/g, '');

        var newOpt = cboOrgs.appendChild(document.createElement('option'));
        newOpt.text = Name;
        newOpt.value = gisX + "," + gisY + "," + Name;
    }


    //Multiselect CategoriesList
    UnselectAllFacilitiesStep2();
}

function getOrgs(selService, selSector) {
    StartLoaderTab2();
    ClearFacilitiesStep2();
    URL = "http://compass.mapservice.co.za/jcon_Orgs.asp?&jscb=getOrgList&service=" + selService + "&sector=" + selSector;
    callObj = new JSONscriptRequest(URL);
    callObj.Go(false);
}


var dirX = "";
var dirY = "";
function JumpToHCT(x, y) {
    //call the URL with all your data
    dirX = x;
    dirY = y;
    setfooter();
    //    var URL = "http://www.mapservice.co.za/ajax_route.asp?key=LOQPUAYXGTCWXJHGYBFDRCSPHCKWBTBH&x1=" + currentX + "&y1=" + currentY + "&x2=" + x + "&y2=" + y + "&tsp=1&fmt=js&jscb=routeresults"
    var URL = "http://www.mapservice.co.za/ajax_route.asp?key=LOQPUAYXGTCWXJHGYBFDRCSPHCKWBTBH&pointtype=xy&points=" + currentX + "," + currentY + "," + x + "," + y + "&tsp=1&fmt=js&jscb=routeresults"
    //this function is in our streetmaps 
    callObj = new JSONscriptRequest(URL);
    callObj.Go(false);
    myMap.Jump(x, y, 0.05);
    myMap.ShowRoute(currentX, currentY, x, y, myMap)
    myMap.Init()
}

function buildSL(clr) {
}

var layerPoints;
function jumpFromSearch(x, y, displtext) {

    document.form1.RF_X.value = x.toFixed(6);
    document.form1.RF_Y.value = y.toFixed(6);
    myMap.Jump(x, y, "0.005");
    displtext = "<strong>From:</strong><br><br>" + displtext;
    layerFromPoints.RemoveAllPoints();
    var t = layerFromPoints.AddPoint(x, y, displtext, 'id');
    t.SetTooltip("From");
    t.SetIconAnchor("center", "bottom");
    t.SetLabelAnchor("iconcenter", "iconcenter");
    t.SetClickBehaviour("toggle_icon");
    t.SetStyle("label");
    var GetStoresHandler = document.getElementById('GetStores');
    GetStoresHandler.click(null, null);
}

function ClearAllPoints() {
    layerPoints.RemoveAllPoints();
}

function AddPointsToCol(x, y, name) {
    var t = layerPoints.AddPoint(x, y, name, 'id');
    t.SetTooltip("HCT");
    t.SetIconAnchor("center", "bottom");
    t.SetLabelAnchor("iconcenter", "iconcenter");
    t.SetClickBehaviour("toggle_icon");
    t.SetStyle("label");
}

function AddPointsColToMap() {
    myMap.Init();
}

function onchange() {

    // alert("changed");

}

var RF_X;
var RF_Y;
var RT_X;
var RT_Y;
var featurelayer;
var featurelayer2;


var myMap = new CAatMap();



//map api callback to handle map clicks
function ClickCallback(map, x, y) {

    var xFrom = x
    var yFrom = y
}

var inclMapITHeader = false;

function buildStoreLocator() {
//    loadjscssfile("https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js", "js");

    loadjscssfile("http://compass.mapservice.co.za/css/jquery.multiselect.css", "css");


//    loadjscssfile("http://compass.mapservice.co.za/css/ui.multiselect.css", "css");
//    loadjscssfile("http://compass.mapservice.co.za/js/plugins/localisation/jquery.localisation-min.js", "js");
//    loadjscssfile("http://compass.mapservice.co.za/css/common.css", "css");
//    loadjscssfile("http://compass.mapservice.co.za/js/plugins/scrollTo/jquery.scrollTo-min.js", "js");
    //    loadjscssfile("http://compass.mapservice.co.za/js/ui.multiselect.js", "js");
    loadjscssfile("http://compass.mapservice.co.za/jquery-ui-1.8.11.custom/css/redmond/jquery-ui-1.8.11.custom.css", "css");
    loadjscssfile("http://compass.mapservice.co.za/Storelocator.css", "css");

//    loadjscssfile("http://compass.mapservice.co.za/Scripts/jquery.multiselect.js", "js");
    var mainSLhtml = "";
    mainSLhtml += "<div id='art-main'>";
    mainSLhtml += "<div class='art-Sheet'>";
    mainSLhtml += " <div class='art-Sheet-tl'></div>";
    mainSLhtml += " <div class='art-Sheet-tr'></div>";
    mainSLhtml += " <div class='art-Sheet-bl'></div>";
    mainSLhtml += " <div class='art-Sheet-br'></div>";
    mainSLhtml += " <div class='art-Sheet-tc'></div>";
    mainSLhtml += " <div class='art-Sheet-bc'></div>";
    mainSLhtml += " <div class='art-Sheet-cl'></div>";
    mainSLhtml += " <div class='art-Sheet-cr'></div>";
    mainSLhtml += " <div class='art-Sheet-cc'></div>";
    mainSLhtml += " <div class='art-Sheet-body'>";
    if (inclMapITHeader = true) {
        mainSLhtml += " <div class='art-Header'>";
        mainSLhtml += " <div class='art-Header-png'></div>";
        mainSLhtml += " <div class='art-Header-jpeg'></div>";
        mainSLhtml += "     <div class='art-Logo'>";
//        mainSLhtml += "         <h1 id='name-text' class='art-Logo-name'><a href='#'>The Compass</a></h1>";
//        mainSLhtml += "         <h2 id='name-text2' class='art-Logo-name'><a href='#'>Pointing You in the Right Direction</a></h2>";
//        mainSLhtml += "         <h2 id='name-text3' class='art-Logo-name'><a href='#'>An Interactive Mapping Tool to Locate Services in your Community</a></h2>";
        mainSLhtml += "     </div>";
//        mainSLhtml += "     <img src='images/AIDSHelpLine_hires.png' alt='an image' align='right' style='width:92px;height:117px;display:inline;padding-right:130px;padding-top:15px' />";
        mainSLhtml += " </div>";
    }
    mainSLhtml += " <div class='art-nav'>";
    mainSLhtml += " <ul class='art-menu'>";
    mainSLhtml += " 	<li><a href='http://compass.mapservice.co.za/Default.aspx' class='active'><span class='l'></span><span class='r'></span><span class='t'>Home</span></a></li>";
    mainSLhtml += " 	<li><a href='http://compass.mapservice.co.za/AboutCampaigns.aspx'><span class='l'></span><span class='r'></span><span class='t'>About Campaigns</span></a></li>";
    mainSLhtml += " 	<li><a href='http://compass.mapservice.co.za/Partners.aspx'><span class='l'></span><span class='r'></span><span class='t'>Partners</span></a></li>";
    mainSLhtml += " 	<li><a href='http://compass.mapservice.co.za/Contact.aspx'><span class='l'></span><span class='r'></span><span class='t'>Contact</span></a></li>";
    mainSLhtml += " </ul>";
    mainSLhtml += " </div>";
    mainSLhtml += " <div id='content' class='art-contentLayout' style='height: auto'>";
    mainSLhtml += "     <div id='sidebar' class='art-sidebar1' style='height: auto'>";
    mainSLhtml += "         <div id='artBlock' class='art-Block' style='height: auto'>";
    mainSLhtml += "             <div id='dyn1' class='art-Block-body' style='height: auto'>";
    mainSLhtml += "                 <div id='artBlockContent' class='art-BlockContent' style='height: auto'>";
    mainSLhtml += "                     <div id='artBlockContentBody' class='art-BlockContent-body'";
    mainSLhtml += "                         style='height: auto'>";
    mainSLhtml += "                         <div id='sidebar1Content' style='background-color: transparent; position: relative; float: left;width: 250px; height: 400px;'>";
    mainSLhtml += "                            <div class='tab' style='font-weight: bold;cursor: pointer;background: url(images/Tabs/tab_" + searchTab + ".png) no-repeat; left: 0px; top: 0px; z-index: 8' id='p1tab0'";
    mainSLhtml += "                            onclick='selectTab(0)'><li>Search Location</li></div>";
    mainSLhtml += "                            <div class='tab' style='font-weight: bold;cursor: pointer;background: url(images/Tabs/tab_" + storesTab + ".png) no-repeat;left: 157px; top: 0px; z-index: 7' id='p1tab1'";
    mainSLhtml += "                            onclick='selectTab(1)'><li>Service Facilities</li></div>";
    mainSLhtml += "                             <div class='cleared'></div>";
    mainSLhtml += "                            <div class='panel' style='border-color:" + framebordercolor1HEX + ";background-color: #FFFFFF; z-index: 8' id='p1panel0' runat='server'>";
    mainSLhtml += "                                <form method='get' id='Form1' action='javascript:void(0)'>";
    //    mainSLhtml += "                                     <label style='FONT-SIZE:8px;COLOR:#FDB60C;align:right;text-align:right' onclick='getroads()'>Show Settings</label>";
    mainSLhtml += "                                     <h8>Services:</h8>";
    mainSLhtml += "                                     <select style='width:300px' id='services' name='services' multiple='multiple'>";
    mainSLhtml += "                                         <option value='1'>HCT</option>";
    mainSLhtml += "                                         <option value='2'>OVC</option>";
    mainSLhtml += "                                         <option value='3'>PMTCT Counselling and Testing</option>";
    mainSLhtml += "                                         <option value='4'>PMTCT ARV Provsioning</option>";
    mainSLhtml += "                                         <option value='5'>ARV Assessment</option>";
    mainSLhtml += "                                         <option value='1'>ARV Adherence</option>";
    mainSLhtml += "                                         <option value='2'>ARV Provisoning</option>";
    mainSLhtml += "                                         <option value='3'>STI</option>";
    mainSLhtml += "                                         <option value='4'>TB</option>";
    mainSLhtml += "                                         <option value='5'>Advocacy</option>";
    mainSLhtml += "                                         <option value='1'>Awareness</option>";
    mainSLhtml += "                                         <option value='2'>Children Services</option>";
    mainSLhtml += "                                         <option value='3'>Counselling</option>";
    mainSLhtml += "                                         <option value='1'>Home and Community Based Care</option>";
    mainSLhtml += "                                         <option value='2'>Information Provision and Referral Services</option>";
    mainSLhtml += "                                         <option value='3'>Legal Assistance</option>";
    mainSLhtml += "                                         <option value='4'>Nutritional Support</option>";
    mainSLhtml += "                                         <option value='5'>Hospice and Palliative Care</option>";
    mainSLhtml += "                                         <option value='1'>Primary Health Care</option>";
    mainSLhtml += "                                         <option value='2'>Youth and Sexual Education Programmes</option>";
    mainSLhtml += "                                         <option value='3'>Rape and Domestic Violence Victim Support</option>";
    mainSLhtml += "                                         <option value='5'>Paediatric AIDS and Clinical Treatment</option>";
    mainSLhtml += "                                         <option value='4'>Income Generation (Coming Soon)</option>";
    mainSLhtml += "                                         <option value='5'>HIV/AIDS Programmes (Coming Soon)</option>";
    mainSLhtml += "                                         <option value='4'>Training and Development (Coming Soon)</option>";
    mainSLhtml += "                                     </select><br/><br/>";
    mainSLhtml += "                                     <h8>Sectors:</h8>";
    mainSLhtml += "                                     <select style='width:300px' id='category' name='category' multiple='multiple'>";
    mainSLhtml += "                                     </select><br/><br/>";
    mainSLhtml += "                                     <h8>Enter your location to find the closest store:</h8>";
    mainSLhtml += "                                     <input type='text' onfocus='changeLocationInputState(this.id)' value='West Street, Sandton' id='roadname' style='color:#C0C0C0;width:95%;' /><br/><br/>";
    mainSLhtml += "                     	            <button id='btnSec1'>Find</button>";
    mainSLhtml += "                     	            <div id='divValidation' class='ui-widget' style='display:none;float: right'>";
    mainSLhtml += "                     	            <div class='ui-state-error ui-corner-all' style='float: right;padding: 0 .5em;'>";
    mainSLhtml += "                     	                <p><span class='ui-icon ui-icon-alert' style='float: right; margin-right: .3em;'></span>";
    mainSLhtml += "                     	                <strong></strong> Please enter your Location</p>";
    mainSLhtml += "                     	            </div>";
    mainSLhtml += "                     	            </div><div class='cleared'></div>";
    mainSLhtml += "                                 </form>";
    mainSLhtml += "                             </div>";
    mainSLhtml += "                             <div class='cleared'></div>";
    mainSLhtml += "                             <div class='panel' style='border-color:" + framebordercolor2HEX + ";background-color:#FFFFFF;z-index:7;display:none;' id='p1panel1'>";
    mainSLhtml += "                                 <form method='get' id='Form2' action='javascript:void(0)'>";
    mainSLhtml += "                                     <h8>Services:</h8>";
    mainSLhtml += "                                     <select style='width:300px' id='cbo1' name='cbo1'>";
    mainSLhtml += "                                         <option value='1'>HCT</option>";
    mainSLhtml += "                                         <option value='2'>OVC</option>";
    mainSLhtml += "                                         <option value='3'>PMTCT Counselling and Testing</option>";
    mainSLhtml += "                                         <option value='4'>PMTCT ARV Provsioning</option>";
    mainSLhtml += "                                         <option value='5'>ARV Assessment</option>";
    mainSLhtml += "                                         <option value='6'>ARV Adherence</option>";
    mainSLhtml += "                                         <option value='7'>ARV Provisoning</option>";
    mainSLhtml += "                                         <option value='8'>STI</option>";
    mainSLhtml += "                                         <option value='9'>TB</option>";
    mainSLhtml += "                                         <option value='10'>Advocacy</option>";
    mainSLhtml += "                                         <option value='11'>Awareness</option>";
    mainSLhtml += "                                         <option value='12'>Children Services</option>";
    mainSLhtml += "                                         <option value='13'>Counselling</option>";
    mainSLhtml += "                                         <option value='14'>Home and Community Based Care</option>";
    mainSLhtml += "                                         <option value='15'>Information Provision and Referral Services</option>";
    mainSLhtml += "                                         <option value='16'>Legal Assistance</option>";
    mainSLhtml += "                                         <option value='17'>Nutritional Support</option>";
    mainSLhtml += "                                         <option value='18'>Hospice and Palliative Care</option>";
    mainSLhtml += "                                         <option value='19'>Primary Health Care</option>";
    mainSLhtml += "                                         <option value='20'>Youth and Sexual Education Programmes</option>";
    mainSLhtml += "                                         <option value='21'>Rape and Domestic Violence Victim Support</option>";
    mainSLhtml += "                                         <option value='22'>Paediatric AIDS and Clinical Treatment</option>";
    mainSLhtml += "                                         <option value='23'>Income Generation (Coming Soon)</option>";
    mainSLhtml += "                                         <option value='24'>HIV/AIDS Programmes (Coming Soon)</option>";
    mainSLhtml += "                                         <option value='25'>Training and Development (Coming Soon)</option>";
    mainSLhtml += "                                     </select><br/><br/>";
    mainSLhtml += "                                     <h8>Sectors:</h8>";
    mainSLhtml += "                                     <select style='width:300px' id='cbo2' name='cbo2'>";
    mainSLhtml += "                                     </select><br/><br/>";
    mainSLhtml += "                                     <h8>Organisations:</h8>";
    mainSLhtml += "                                     <select style='width:300px' id='cboOrg' name='cboOrg'>";
    mainSLhtml += "                                     </select><br/><br/>";
    mainSLhtml += "                     	            <button id='btnSelectStore'>Locate</button>";
    mainSLhtml += "                                     <div id='divloaderTab2' style='float:right;'></div>";
    mainSLhtml += "                                 </form>";
    mainSLhtml += "                             </div>";
    mainSLhtml += "                         </div>";
    mainSLhtml += "                     </div>";
    mainSLhtml += "                 </div>";
    mainSLhtml += "             </div>";
    mainSLhtml += "         </div>";
    mainSLhtml += "     </div>";
    mainSLhtml += "     <div class='art-content' style='height: auto'>";
    mainSLhtml += "         <div class='art-Post'>";
    mainSLhtml += "             <div id='frameS2' class='art-Post-tl'></div>";
    mainSLhtml += "             <div id='frameS' class='art-Post-tr'></div>";
    mainSLhtml += "             <div id='frameS3' class='art-Post-bl'></div>";
    mainSLhtml += "             <div id='frameS4' class='art-Post-br'></div>";
    mainSLhtml += "             <div id='frameH' class='art-Post-tc'></div>";
    mainSLhtml += "             <div id='frameH2' class='art-Post-bc'></div>";
    mainSLhtml += "             <div id='frameV2' class='art-Post-cl'></div>";
    mainSLhtml += "             <div id='frameV' class='art-Post-cr'></div>";
    mainSLhtml += "             <div id='frameFill' class='art-Post-cc'></div>";
    mainSLhtml += "             <div class='art-Post-body'>";
    mainSLhtml += "                 <div class='art-Post-inner'>";
    mainSLhtml += "                     <div class='art-PostContent'>";
    mainSLhtml += "                         <div style='width:505px;height:405px;overflow:hidden;' id='mapdisplay' runat='server'></div>";                                 
    mainSLhtml += "                     </div>";
    mainSLhtml += "                     <div align='center' style='FONT-SIZE:10px;COLOR:#000000;top:10px'>";
    mainSLhtml += "                         Mapping service brought to you by <a href='http://www.mapit.co.za/action/mapping.html'>MapIT</a>";
    mainSLhtml += "                         <div align='center'>";
    mainSLhtml += "                             <a href='http://www.mapit.co.za'><img src='images/70pix x 33pix.jpg' alt='an image' style='display:inline;'></img></a>";
    mainSLhtml += "                         </div>";
    mainSLhtml += "                         <table border='0' width='100%' cellpadding='0' cellspacing='0'>";
    mainSLhtml += "                         <tbody>";
    mainSLhtml += "                             <tr>";
    mainSLhtml += "                                 <td>";
    mainSLhtml += "                                    <input onclick='javascript:updateview()' type='checkbox' id='PopOverlay' value='{06883F09-6B39-406C-A1FA-D71A0BDEF89B}' /> <span style='background-color:#E74D08'>&nbsp;&nbsp;&nbsp;</span> Population Overlay";
    mainSLhtml += "                                 </td>";
    mainSLhtml += "                             </tr>";
    mainSLhtml += "                         </tbody>";
    mainSLhtml += "                         </table>";
    mainSLhtml += "                     </div>";
    mainSLhtml += "                     <div class='cleared'></div>";
    mainSLhtml += "                 </div>";
    mainSLhtml += "             </div>";
    mainSLhtml += "         </div>";
    mainSLhtml += "     </div>";
    mainSLhtml += " </div>";
    mainSLhtml += " <div class='cleared'></div>";
    mainSLhtml += " <div id='footersec' class='art-Footer'>";
    mainSLhtml += "     <div id='footerinner' class='art-Footer-inner'>";
    mainSLhtml += "         <div style='FONT-SIZE:12px;COLOR:#FEFFFF' class='art-Footer-text'>";
    mainSLhtml += "                 <div style='background-color:#FFFFFF'>";
    mainSLhtml += "                     <img src='images/FPD_LOGO_2008_small.jpg' alt='an image' style='display:inline;padding-right:10px' /><img src='images/CompassLogotext.jpg' alt='an image' style='display:inline;padding-left:10px;padding-right:10px' /><img src='images/hiv911amendedsmall_wk.jpg' alt='an image' style='display:inline;padding-left:40px;padding-right:40px;padding-bottom:20px' /><img src='images/Mapit.jpg' alt='an image' style='display:inline;padding-left:10px;padding-right:10px' /><img src='images/SAHCS.jpg' alt='an image' style='display:inline;padding-left:10px' /><br />";
    mainSLhtml += "                     <img src='images/netherlands.jpg' alt='an image' style='display:inline;padding-right:40px' /><img src='images/USAID.jpg' alt='an image' style='display:inline;padding-left:40px;padding-right:40px' /><img src='images/PEPFAR.jpg' alt='an image' style='display:inline;padding-left:40px;padding-right:40px' /><img src='images/SANAC.jpg' alt='an image' style='display:inline;padding-left:40px;padding-right:40px' /><img src='images/DoH_logo.jpg' alt='an image' style='display:inline;padding-left:40px' />";
    mainSLhtml += "                 </div>";
    mainSLhtml += "                 <br />";
    mainSLhtml += "                 Copyright &copy; MapIT 2011 ---- All Rights Reserved.";
    mainSLhtml += "         </div>";
    mainSLhtml += "     </div>";
    mainSLhtml += "     <div id='footerSec1' class='art-Footer-background'></div>";
    mainSLhtml += " </div>";
    mainSLhtml += " </div>";
    mainSLhtml += "</div>";
    mainSLhtml += "</div>";
    document.getElementById("storelocatorSection").innerHTML = mainSLhtml;
    var c = "mapdisplay";
    var startX = 24.670062;
    var startY = -28.479381;
    var startScale = 10.24;
    myMap.SetImageBase("http://www.mapservice.co.za/img/");
    myMap.SetCopyright("© AAT, MapIT and Surveyor General");
    myMap.SetOutput(c);
    var newlayer = myMap.AddLayer("map", 500);
    layerPoints = myMap.AddLayer("point", 50, "layerPoints");
    layerFromPoints = myMap.AddLayer("point", 51, "layerFromPoints");
    layerToPoints = myMap.AddLayer("point", 52, "layerToPoints");
    layerMyPoint = myMap.AddLayer("point", 53, "layerMyPoint");
    layerRefresh = myMap.AddLayer("point", 54, "layerRefresh");
    layerKmMarkers = myMap.AddLayer("point", 55, "layerKmMarkers");
    layerStoreList = myMap.AddLayer("point", 56, "layerStoreList");
    featurelayer = myMap.AddLayer("custom", 57);
    updateview();
    //Map Overlays
    //            var httpBase = "http://comrades.mapservice.co.za/imageview.asp";
    //            var ids = "Comrades2010\\ComradesRoute2.shp";
    //            featurelayer = myMap.AddLayer("custom", 56);
    //            featurelayer.SetCustomUrl(httpBase + "?action=image&x=%x%&y=%y%&s=%scale%&w=%width%&h=%height%&filesource=1&id=" + ids);
    //            var ids2 = "Comrades2010\\ComradesRouteVertices.shp";
    //            featurelayer2 = myMap.AddLayer("custom", 56);
    //            featurelayer2.SetCustomUrl(httpBase + "?action=image&x=%x%&y=%y%&s=%scale%&w=%width%&h=%height%&filesource=1&id=" + ids2);

    //to handle clicks on map
    myMap.ClickCallback = ClickCallback;
    myMap.SetPointsButtons(true);
    myMap.Jump(startX, startY, startScale);
    newlayer.SetType("map");
//    setClient("kfc");
//    setColors("orange", "navy", "maroon");
//    setStoresLF("3d", "1", "24");
//    setButtonsLF("2", "1");
//    setBottomBarLF("2");
//    setFrameLF("2");
//    setTabsLF("1", "2");
//    setContentFrames("2", "1");
//    setDirectionsBanner("images/Header/header_option.png");
    //    setURHLF("sqd", "2", "32");
    ApplyTheme();
    myMap.Init();
    //    getStoreList();
    getSectorsMain();
    setSearchHTML();
    UnselectAllFacilitiesStart();
}

function ApplyTheme() {
    //Buttons Theme
//    document.getElementById("btnSec1").style.backgroundImage = "url(images/Buttons/button_" + buttoncolor + ".png)";
//    document.getElementById("btnSelectStore").style.backgroundImage = "url(images/Buttons/button_" + buttoncolor + ".png)";
    //BottomBar Theme
    document.getElementById("footerSec1").style.backgroundImage = "url(images/BottomBars/bottom_bar_" + bottombarcolor + ".png)";
    //Frames Theme
    document.getElementById("frameS").style.backgroundImage = "url(images/Frames/post-s_" + framecolor + ".png)";
    document.getElementById("frameS2").style.backgroundImage = "url(images/Frames/post-s_" + framecolor + ".png)";
    document.getElementById("frameS3").style.backgroundImage = "url(images/Frames/post-s_" + framecolor + ".png)";
    document.getElementById("frameS4").style.backgroundImage = "url(images/Frames/post-s_" + framecolor + ".png)";
    document.getElementById("frameH").style.backgroundImage = "url(images/Frames/post-h_" + framecolor + ".png)";
    document.getElementById("frameH2").style.backgroundImage = "url(images/Frames/post-h_" + framecolor + ".png)";
    document.getElementById("frameV").style.backgroundImage = "url(images/Frames/post-v_" + framecolor + ".png)";
    document.getElementById("frameV2").style.backgroundImage = "url(images/Frames/post-v_" + framecolor + ".png)";
    document.getElementById("frameFill").style.backgroundColor = framecolorHEX;
    //Tabs Theme
    document.getElementById("p1tab0").style.backgroundImage = "url(images/Tabs/tab_" + searchTab + ".png)";
    document.getElementById("p1tab1").style.backgroundImage = "url(images/Tabs/tab_" + storesTab + ".png)";
    //Content Frames Theme
    document.getElementById("p1panel0").style.bordercolor = framebordercolor1HEX;
    document.getElementById("p1panel1").style.bordercolor = framebordercolor2HEX;
}
//standard map init code except for the two commented lines.
function displayMap() {
//    loadjscssfile("http://storelocator.mapservice.co.za/storelocator.css", "css");

}

var APIKeyReceived = "";
function initilaizeDependancies() {
    Element.cleanWhitespace('content');
    initTab();
}

var panelID = "p1";
var numDiv = 2;
var numRows = 1;
var tabsPerRow = 2;
var numLocations = numRows * tabsPerRow;
var tabWidth = 147;
var tabHeight = 32;
var vOffset = 0;
var hOffset = 10;
var divLocation = new Array(numLocations);
var newLocation = new Array(numLocations);
for (var i = 0; i < numLocations; ++i) {
    divLocation[i] = i;
    newLocation[i] = i;
}

function getDiv(s, i) {
    var div;
    if (navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion.charAt(0) < 5)
        div = document.all.item(panelID + s + i);
    else
        div = document.getElementById(panelID + s + i);
    return div;
}
function setZIndex(div, zIndex) {
    div.style.zIndex = zIndex;
}
function getLocation(i) {
    return divLocation[i];
}
function setLocation(i, j) {
    divLocation[i] = j;
}
function getNewLocation(i) {
    return newLocation[i];
}
function setNewLocation(i, j) {
    newLocation[i] = j;
}
function updatePosition(div, newPos) {
    div.style.top = (numRows - (Math.floor(newPos / tabsPerRow) + 1)) * (tabHeight - vOffset);
    div.style.left = (newPos % tabsPerRow) * tabWidth + (hOffset * (Math.floor(newPos / tabsPerRow)));
}

function selectTab(n) {
    // n is the ID of the division that was clicked
    // firstTab is the location of the first tab in the selected row
    var firstTab = Math.floor(getLocation(n) / tabsPerRow) * tabsPerRow;
    // newLoc is its new location
    if (n == 1) {
        document.getElementById("p1panel0").style.display = "none";
        document.getElementById("p1panel0").style.height = "auto";
        document.getElementById("p1panel1").style.display = "inline-block";
        document.getElementById("p1panel1").style.height = "auto";
    }
    else {
        document.getElementById("p1panel1").style.display = "none";
        document.getElementById("p1panel0").style.display = "inline-block";
        document.getElementById("p1panel0").style.height = "auto";
    }
    for (var i = 0; i < numDiv; ++i) {
        // loc is the current location of the tab
        var loc = getLocation(i);
        // If in the selected row
        if (loc >= firstTab && loc < (firstTab + tabsPerRow))
            setNewLocation(i, loc - firstTab);
        else if (loc < tabsPerRow)
            setNewLocation(i, firstTab + (loc % tabsPerRow));
        else
            setNewLocation(i, loc);
    }
    // Set tab positions & zIndex
    // Update location
    for (var i = 0; i < numDiv; ++i) {
        var div = getDiv("tab", i);
        var loc = getNewLocation(i);
        updatePosition(div, loc);
        if (i == n)
            setZIndex(div, numLocations + 1);
        else
            setZIndex(div, numLocations - loc);
        div = getDiv("panel", i);
        if (i == n)
            setZIndex(div, numLocations + 1);
        else
            setZIndex(div, numLocations - loc);
        setLocation(i, loc);
    }
}

var clientIdentifier = "";

var bannerpath = "";

var prim = "orange";
var second = "navy";
var alt = "maroon";
var alt2 = "blue";

var icontype = "rd";
var iconcolour = "maroon";
var iconsize = "24";

var buttontype = "rd";
var buttoncolor = "navy";
var buttoncolor2 = "orange";
var buttonsize = "75,23";

var bottombarcolor = "navy";

var framecolor = "navy";
var framecolorHEX = "#000099";

var searchTab = "navy";
var storesTab = "orange";

var searchFrame = "1";
var storeFrame = "2";
var framebordercolor1HEX = "#000099";
var framebordercolor2HEX = "#ff9900";

function changeLocationInputState(id) {
    document.getElementById(id).style.color = "#000000";
    document.getElementById(id).value = "";
}

var currentIDS = "";
httpBase = "http://www.mapservice.co.za/userfeatures.asp";
//update the overlay - ids is a comma delimited list of shp files to render.
function UpdateOverlay(ids) {
    currentIDS = ids;
    featurelayer.SetCustomUrl(httpBase + "?action=image&x=%x%&y=%y%&s=%scale%&w=%width%&h=%height%&id=" + ids);
}

//just some code to create a list of ids from the check boxes and update the overlay
function updateview() {
    var ids = "";
    var cbs = document.getElementsByTagName("input");
    var first = true;
    var overl = document.getElementById("PopOverlay");
    if (overl.checked) {
        //    alert(cbs[i].value.tostring().subtring(0, 1));
        //    for (var i = 0; i < cbs.length; i++)
        //     {
        //        if (cbs[i].checked) {
        //            if (cbs[i].value.tostring().subtring(0, 1) == "{") {
        //                if (!first) ids += ",";
        //                ids += cbs[i].value;
        //                first = false;
        //            }
        //        }
        //     }
        ids = overl.value;
    }
    UpdateOverlay(ids);
    myMap.Init();
}