﻿var map_x;
var map_y;
var currentsitetype = "hsite";
var routeplanner = false;
var routestart = 0;
var routeend = 0;
var sitenamearray = new Array();

function init()
{
    map_x = getLeft(document.getElementById("div_map_" + current_map_ref));
    map_y = getTop(document.getElementById("div_map_" + current_map_ref));
    initSubMenu();
    displayLoadingAnim((map_x + 400), (map_y + 100));  
    img1 = new Image();
    img1.src = "graphics/maps/map" + current_map_ref + "_blank.jpg";          
    img0 = new Image();
    img0.onload = displayMap;
    img0.src = "graphics/maps/map" + current_map_ref + ".jpg";    
    //loadMapImage("graphics/maps/map" + current_map_ref + ".jpg");
}

function displayMap()
{
    hideLoadingAnim();
    if(routeplanner)
    {
        document.getElementById("div_map_" + current_map_ref).style.background = "url(graphics/maps/map" + current_map_ref + "_blank.jpg)";            
    }
    else
    {
        document.getElementById("div_map_" + current_map_ref).style.background = "url(graphics/maps/map" + current_map_ref + ".jpg)";            
    }
    positionDivs(); 
    initMenuSlide();  
}

function positionDivs()
{   
    document.getElementById("div_menu").style.left = (map_x + 720) + "px";
    document.getElementById("div_menu").style.top = (map_y - 32) + "px";
    document.getElementById("div_menu").style.visibility = "visible";    
    displaySites(current_map_ref, currentsitetype, false);    
}

function reSize()
{
    map_x = getLeft(document.getElementById("div_map_" + current_map_ref));
    map_y = getTop(document.getElementById("div_map_" + current_map_ref));
    initSubMenu();
    positionDivs();
}

function getHTTPObject() 
{
    var xmlhttp;
    /*@cc_on
    @if (@_jscript_version >= 5)
    try {
      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      try {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (E) {
        xmlhttp = false;
      }
    }
    @else
    xmlhttp = false;
    @end @*/
    if (!xmlhttp && typeof XMLHttpRequest != 'undefined') 
    {
        try 
        {
          xmlhttp = new XMLHttpRequest();
        } 
        catch (e) 
        {
          xmlhttp = false;
        }
    }
    return xmlhttp;
} 
var http = getHTTPObject(); // We create the HTTP Object 
var busy = false;
var savedref;

function so_clearInnerHTML(obj) {
    while(obj.firstChild) obj.removeChild(obj.firstChild);
}

function removeAllMapIcons(leaveheritagesites)
{
    var divarray = new Array();
    var alldivs = document.body.getElementsByTagName("div");
    var divarraycounter = 0;
    
    //Find map icon divs and put into array - ALL DIVS MUST HAVE AN ID OR WILL BREAK IN FIREFOX
    for(var i = 0; i < alldivs.length; i++)
    {
        var d = alldivs[i]; 
        if(leaveheritagesites)       
        {
            if(d.getAttribute("id").indexOf("div_map_icon") >= 0)
            {
                divarray[divarraycounter] = d.getAttribute("id");
                divarraycounter++;
            }
        }
        else       
        {
            if(d.getAttribute("id").indexOf("div_map_icon") >= 0 || d.getAttribute("id").indexOf("div_hsite_icon") >= 0)
            {
                divarray[divarraycounter] = d.getAttribute("id");
                divarraycounter++;
            }
        }
    }    
    
    //Delete all divs with IDs in array
    for(var i = 0; i < divarray.length; i++)
    {
        var d = document.getElementById(divarray[i]);
        d.parentNode.removeChild(d);
    }    
}
       
function displaySites(map_ref, site_type_ref, leaveheritagesites)
{	
    if(!busy)
    {
        removeAllMapIcons(leaveheritagesites);
        document.getElementById("div_menu_" + currentsitetype).style.backgroundImage = "";
        document.getElementById("div_menu_" + site_type_ref).style.backgroundImage = "url(graphics/menusel.jpg)";
        
        busy = true;
        currentsitetype = site_type_ref;
        http.open("GET", ("AJAXMapSites.asp?MapRef=" + escape(map_ref) + "&SiteTypeRef=" + escape(site_type_ref)), true);
        http.onreadystatechange = displaySitesResponse;
        http.send(null);
    }
}

function displaySitesResponse() 
{    
    if (http.readyState == 4) 
    {                
        if(http.responseText.length > 0)
        {  
            var site_data = eval('(' + http.responseText + ')');
            var isClickable = false;
            for (i=0; i<site_data.map_sites.length; i++)
            { 	
                //Store Site Name in an array
                sitenamearray[site_data.map_sites[i].site.site_ref] = site_data.map_sites[i].site.site_name;
                
                //Work out whether this is a clickable icon with a bubble
                if(site_data.map_sites[i].site.has_page == "true")
                {
                    isClickable = true;
                }
                else
                {
                    isClickable = false;
                }
                
                //Create Container DIV
                div_container = document.createElement('div');
                if(site_data.map_sites[i].site.site_type_ref == 'hsite')
                {
                    div_container.setAttribute("id", "div_hsite_icon" + site_data.map_sites[i].site.site_ref );
                }
                else
                {
                    div_container.setAttribute("id", "div_map_icon" + site_data.map_sites[i].site.site_ref );
                }
                divcss = "position:absolute;";
                divcss += "left:" + (parseInt(map_x) + parseInt(site_data.map_sites[i].site.x_coord)) + "px;";
                divcss += "top:" + (parseInt(map_y) + parseInt(site_data.map_sites[i].site.y_coord)) + "px;";
                divcss += "z-index:500;";
                div_container.style.cssText = divcss; 
                                         
                //Create icon
                img_icon = document.createElement('img');
                if(site_data.map_sites[i].site.site_type_ref == 'hsite')
                {
                    img_icon.setAttribute("width", "26");
                    img_icon.setAttribute("height", "25");
                    img_icon.className = "icon_heritage";
                    img_icon.src = "graphics/icons/" + site_data.map_sites[i].site.site_ref + ".png";
                }
                else
                {
                    img_icon.setAttribute("width", "18");
                    img_icon.setAttribute("height", "18");
                    if(isClickable)
                    {
                        img_icon.className = "icon_other";
                    }
                    else
                    {
                        img_icon.className = "icon_other2";
                    }
                    img_icon.src = "graphics/icons/" + site_data.map_sites[i].site.site_type_ref + ".png";
                }
                img_icon.setAttribute("border", "0");
                img_icon.setAttribute("id", "map_icon" + site_data.map_sites[i].site.site_ref );                 
                
                if(isClickable)
                {
                    img_icon.onclick = function()
                    {
                        if(routeplanner)
                        {
                            var site_ref = this.getAttribute("id").replace(/map_icon/, "");
                            if((this.src.indexOf('_over') < 0) && (routestart == 0 || routeend == 0))
                            {
                                this.src = this.src.replace(/.png/, "_over.png");
                            }
                            selectRoutePoint(site_ref);
                        }
                        else
                        {
                            var site_ref = this.getAttribute("id").replace(/map_icon/, "");
                            document.location.href = "site.asp?siteref=" + escape(site_ref);
                        }
                    };
                    img_icon.onmouseover = function()
                    {
                        var site_ref = this.getAttribute("id").replace(/map_icon/, "");
                        if(!routeplanner)
                        {
                            if((routestart == 0 && routeend == 0))
                            {
                                this.src = this.src.replace(/.png/, "_over.png");
                            }
                        }
                        document.getElementById("div_site_bubble").style.left = (getLeft(this) - 54) + "px";
                        document.getElementById("div_site_bubble").style.top = (getTop(this) - 208) + "px";
                        document.getElementById("div_site_bubble").style.visibility = "visible";
                        document.getElementById("div_site_" + site_ref).style.left = (getLeft(this) - 37) + "px";
                        document.getElementById("div_site_" + site_ref).style.top = (getTop(this) - 194) + "px";
                        document.getElementById("div_site_" + site_ref).style.visibility = "visible";
                        fadeIn(document.getElementById("div_site_" + site_ref), 0);
                    };
                    img_icon.onmouseout = function()
                    {
                        var site_ref = this.getAttribute("id").replace(/map_icon/, "");
                        if(!routeplanner)
                        {
                            if((routestart == 0 && routeend == 0))
                            {
                                this.src = this.src.replace(/_over.png/, ".png");
                            }
                        }
                        document.getElementById("div_site_bubble").style.visibility = "hidden";
                        document.getElementById("div_site_" + site_ref).style.visibility = "hidden";
                    }; 
                }         
                
                div_container.appendChild(img_icon);                 
                document.body.appendChild(div_container); 
	        }	        
        } 
        busy = false;             
    }
}

function displayInfo(map_ref, data_type_ref)
{	
    if(!busy)
    {
        removeAllMapIcons(false);
        document.getElementById("div_menu_" + currentsitetype).style.backgroundImage = "";
        document.getElementById("div_menu_" + data_type_ref).style.backgroundImage = "url(graphics/menusel.jpg)";
        
        busy = true;
        currentsitetype = data_type_ref;
        http.open("GET", ("AJAXMapData.asp?MapRef=" + escape(map_ref) + "&DataTypeRef=" + escape(data_type_ref)), true);
        http.onreadystatechange = displayInfoResponse;
        http.send(null);
    }
}

function displayInfoResponse() 
{    
    if (http.readyState == 4) 
    {                
        if(http.responseText.length > 0)
        {  
            var site_data = eval('(' + http.responseText + ')');
            for (i=0; i<site_data.map_sites.length; i++)
            { 	
                //Store Site Name in an array
                sitenamearray[site_data.map_sites[i].site.site_ref] = site_data.map_sites[i].site.site_name;
                                             
                //Create Container DIV
                div_container = document.createElement('div');
                div_container.setAttribute("id", "div_map_icon" + site_data.map_sites[i].site.site_ref );
                divcss = "position:absolute;";
                divcss += "left:" + (parseInt(map_x) + parseInt(site_data.map_sites[i].site.x_coord)) + "px;";
                divcss += "top:" + (parseInt(map_y) + parseInt(site_data.map_sites[i].site.y_coord)) + "px;";
                divcss += "z-index:500;";
                div_container.style.cssText = divcss; 
                                         
                //Create icon
                img_icon = document.createElement('img');
                img_icon.setAttribute("width", "18");
                img_icon.setAttribute("height", "18");
                img_icon.className = "icon_other";
                img_icon.src = "graphics/icons/" + site_data.map_sites[i].site.data_type_ref + ".png";
                img_icon.setAttribute("border", "0");
                img_icon.setAttribute("id", "map_icon" + site_data.map_sites[i].site.site_ref );                 
                if(site_data.map_sites[i].site.data_type_ref == "lhist")
                {
                    img_icon.setAttribute("alt", "Click to view local historical information for " + site_data.map_sites[i].site.site_name);
                    img_icon.setAttribute("title", "Click to view local historical information for " + site_data.map_sites[i].site.site_name);
                }
                else
                {
                    img_icon.setAttribute("alt", "Click to view "  + site_data.map_sites[i].site.num_items + " " + site_data.map_sites[i].site.data_type + " for " + site_data.map_sites[i].site.site_name);
                    img_icon.setAttribute("title", "Click to view "  + site_data.map_sites[i].site.num_items + " " + site_data.map_sites[i].site.data_type + " for " + site_data.map_sites[i].site.site_name);
                }
                img_icon.setAttribute("data_type_ref", site_data.map_sites[i].site.data_type_ref);
                
                img_icon.onclick = function()
                {
                    var site_ref = this.getAttribute("id").replace(/map_icon/, "");
                    document.location.href = "site.asp?siteref=" + escape(site_ref) + "&datatyperef=" + escape(this.getAttribute("data_type_ref"));
                };
                img_icon.onmouseover = function()
                {
                    var site_ref = this.getAttribute("id").replace(/map_icon/, "");
                    this.src = this.src.replace(/.png/, "_over.png");
                };
                img_icon.onmouseout = function()
                {
                    var site_ref = this.getAttribute("id").replace(/map_icon/, "");
                    this.src = this.src.replace(/_over.png/, ".png");
                };        
                
                div_container.appendChild(img_icon);                 
                document.body.appendChild(div_container); 
	        }	        
        } 
        busy = false;             
    }
}

/////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////Slider code

function initMenuSlide()
{
    endHeight["div_menu_key"] = getHeight(document.getElementById("div_menu_key"));
    obj["div_menu_key"] = document.getElementById("div_menu_key");
    catlink["div_menu_key"] = document.getElementById("div_menu_key");
    document.getElementById("div_menu_key").className = "hiddenmotiondiv";
    
    endHeight["div_menu_info"] = getHeight(document.getElementById("div_menu_info"));
    obj["div_menu_info"] = document.getElementById("div_menu_info");
    catlink["div_menu_info"] = document.getElementById("div_menu_info");
    document.getElementById("div_menu_info").className = "hiddenmotiondiv";
    
    endHeight["div_menu_route"] = getHeight(document.getElementById("div_menu_route"));
    obj["div_menu_route"] = document.getElementById("div_menu_route");
    catlink["div_menu_route"] = document.getElementById("div_menu_route");
    document.getElementById("div_menu_route").className = "hiddenmotiondiv";
    
    toggleSlide('div_menu_key');
}

var ns4 = document.layers;
var op5 = (navigator.userAgent.indexOf("Opera 5")!=-1) 
    ||(navigator.userAgent.indexOf("Opera/5")!=-1);
var op6 = (navigator.userAgent.indexOf("Opera 6")!=-1) 
    ||(navigator.userAgent.indexOf("Opera/6")!=-1);
var agt=navigator.userAgent.toLowerCase();
var mac = (agt.indexOf("mac")!=-1);
var ie = (agt.indexOf("msie") != -1); 
var mac_ie = mac && ie;

function getHeight(elem) {
    if (op5) { 
        xPos = elem.style.pixelHeight;
    } else {
        xPos = elem.offsetHeight;
    }
    return xPos;
}

function getWidth(elem) {
    if (op5) {
        xPos = elem.style.pixelWidth;
    } else {
        xPos = elem.offsetWidth;
    }
    return xPos;
}

var timerlen = 5;
var slideAniLen = 400;

var timerID = new Array();
var startTime = new Array();
var obj = new Array();
var catlink = new Array();
var endHeight = new Array();
var moving = new Array();
var dir = new Array();

function slidedown(objname)
{   
    if(moving[objname])
            return;
    
    if(document.getElementById(objname).className != "hiddenmotiondiv")
            return; // cannot slide down something that is already visible

    moving[objname] = true;
    dir[objname] = "down";
    slideUpAll();
    startslide(objname);
}

function slideup(objname)
{
    if(moving[objname])
            return;
    
    if(document.getElementById(objname).className == "hiddenmotiondiv")
            return; // cannot slide up something that is already hidden

    moving[objname] = true;
    dir[objname] = "up";
    startslide(objname);
}

function startslide(objname)
{
    //obj[objname] = document.getElementById(objname);
    //endHeight[objname] = getHeight(obj[objname]);
    
    startTime[objname] = (new Date()).getTime();

    if(dir[objname] == "down"){
            obj[objname].style.height = "1px";
    }

    obj[objname].className = "visiblemotiondiv";

    timerID[objname] = setInterval('slidetick(\'' + objname + '\');',timerlen);
}

function slidetick(objname)
{
    var elapsed = (new Date()).getTime() - startTime[objname];

    if (elapsed > slideAniLen)
            endSlide(objname)
    else {
            var d =Math.round(elapsed / slideAniLen * endHeight[objname]);
            if(dir[objname] == "up")
                    d = endHeight[objname] - d;

            obj[objname].style.height = d + "px";
    }

    return;
}

function endSlide(objname)
{
        clearInterval(timerID[objname]);

        if(dir[objname] == "up")
            obj[objname].className = "hiddenmotiondiv";

        obj[objname].style.height = endHeight[objname] + "px";

        delete(moving[objname]);
        delete(timerID[objname]);
        delete(startTime[objname]);
        delete(dir[objname]);

        return;
}

function toggleSlide(objname)
{
    if(currentsitetype == "hsite")
    {
        //displaySites(current_map_ref,'hsite',true);
    }
  
      if(document.getElementById(objname).className == "hiddenmotiondiv"){
        // div is hidden, so let's slide down
        slidedown(objname);
      }else{
        // div is not hidden, so slide up
        slideup(objname);
      }
}

function slideUpAll()
{
    for(i in obj)
    {
        slideup(obj[i].getAttribute("id"));
    }
}

/////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////Route Planner

function resetAllMapIcons()
{
    var alldivs = document.body.getElementsByTagName("div");
    
    //Find map icon divs and put into array - ALL DIVS MUST HAVE AN ID OR WILL BREAK IN FIREFOX
    for(var i = 0; i < alldivs.length; i++)
    {
        var d = alldivs[i];        
        if(d.getAttribute("id").indexOf("div_map_icon") >= 0 || d.getAttribute("id").indexOf("div_hsite_icon") >= 0)
        {
            d.childNodes[0].src = d.childNodes[0].src.replace(/_over/, "");
        }
    }  
}

function convertDecimalToTime(num) 
{
    var timestr = "";
    if(parseInt(num) == 1)
    {
        timestr += parseInt(num) + "hr ";
    }
    else if(parseInt(num) > 1)
    {
        timestr += parseInt(num) + "hrs ";
    }
    num -= parseInt(num); num *= 60;
    if(parseInt(num) == 1)
    {
        timestr += parseInt(num) + "min ";
    }
    else if(parseInt(num) > 1)
    {
        timestr += parseInt(num) + "mins ";
    }
    return timestr;
}

function routePlanner()
{    
    toggleSlide("div_menu_route");    
    if(!routeplanner)
    {
        routeplanner = true;
        if(currentsitetype != "hsite")
        {
            displaySites(current_map_ref,'hsite',false);
        }
    } 
    else
    {
        resetRoutePlanner();
    }
}

function resetRoutePlanner()
{
    routeplanner = false;
    routestart = 0;
    routeend = 0;
    removeAllDistanceGraphics();
    resetAllMapIcons();
    document.getElementById("div_map_" + current_map_ref).style.background = "url(graphics/maps/map" + current_map_ref + ".jpg)";        
    
    document.getElementById("div_route_result").style.display = "none";
    document.getElementById("div_route_end_text").style.display = "none";
    document.getElementById("div_route_result").innerHTML = '';
    document.getElementById("div_route_end_text").innerHTML = '<img src="graphics/selectpoint.png" width="26" height="25" alt="Select an End Point" \/>Select an End Point';
    document.getElementById("div_route_start_text").innerHTML = 'Click on the numbered Heritage Site from which you wish to star, followed by the site at which you wish your route to end.<br \/><br \/><img src="graphics/selectpoint.png" width="26" height="25" alt="Select a Starting Point" \/>Select a Starting Point';
    document.getElementById("div_menu_route").className = "hiddenmotiondiv";
}

function selectRoutePoint(p)
{
    if(routestart == 0)
    {
        routestart = parseInt(p);
        document.getElementById("div_route_start_text").innerHTML = "<b>Start:<\/b> " + sitenamearray[p];
        document.getElementById("div_route_end_text").style.display = "block";
        
        maxh = 20 + getHeight(document.getElementById("div_route_start_text")) + getHeight(document.getElementById("div_route_end_text"));
        timerID["div_menu_route"] = setInterval('slidetick2(\'div_menu_route\', ' + maxh + ');',timerlen);
    }
    else if(routeend == 0)
    {
        routeend = parseInt(p); 
        if(routeend == 1)
        {
            routeend = 50;
        }
        if(routeend == routestart)
        {
            routestart = (routeend - 1)
        }
        if((routeend < routestart) && (parseInt(current_map_ref) != 1))
        {
           var newroutestart = routeend;
           routeend = routestart;
           routestart = newroutestart;
        }
        document.getElementById("div_route_start_text").innerHTML = "<b>Start:<\/b> " + sitenamearray[routestart];
        if(routeend == 50)
        {
            document.getElementById("div_route_end_text").innerHTML = "<b>End:<\/b> " + sitenamearray[1];
        }
        else
        {
            document.getElementById("div_route_end_text").innerHTML = "<b>End:<\/b> " + sitenamearray[routeend];
        }
        
        displayDistances(routestart, (routeend - 1));
    }
}

function slidetick2(objname, maxh)
{
    h = getHeight(obj[objname]);
    if(h >= maxh)
    {
        clearInterval(timerID[objname]);
        delete(timerID[objname]);
    }
    else
    {        
        obj[objname].style.height = (h + 1) + "px";
        return;
    }
}

function displayDistances(minref, maxref)
{	
    if(!busy)
    {
        document.getElementById("div_map_" + current_map_ref).style.background = "url(graphics/maps/map" + current_map_ref + "_blank.jpg)";        
        
        busy = true;
        //alert("AJAXMapDistances.asp?MapRef=" + current_map_ref + "&MinSiteRef=" + escape(minref) + "&MaxSiteRef=" + escape(maxref));
        http.open("GET", ("AJAXMapDistances.asp?MapRef=" + current_map_ref + "&MinSiteRef=" + escape(minref) + "&MaxSiteRef=" + escape(maxref)), true);        
        http.onreadystatechange = displayDistancesResponse;
        http.send(null);
    }
}

function displayDistancesResponse() 
{   
    if (http.readyState == 4) 
    {                
        if(http.responseText.length > 0)
        {  
            var distance_data = eval('(' + http.responseText + ')');
            var total_distance = 0;
            for (i=0; i<distance_data.map_distances.length; i++)
            { 
                total_distance += parseInt(distance_data.map_distances[i].distance.distance_to_next);
            
                //Create Container DIV
                div_container = document.createElement('div');
                div_container.setAttribute("id", "div_distance_graphic" + distance_data.map_distances[i].distance.site_ref );
                  
                divcss = "position:absolute;";
                divcss += "left:" + (parseInt(map_x) + parseInt(distance_data.map_distances[i].distance.left_px)) + "px;";
                divcss += "top:" + (parseInt(map_y) + parseInt(distance_data.map_distances[i].distance.top_px)) + "px;";
                divcss += "width:" + distance_data.map_distances[i].distance.width_px + "px;";
                divcss += "height:" + distance_data.map_distances[i].distance.height_px + "px;";
                divcss += "z-index:" + (300 + parseInt(i)) + ";";
                div_container.style.cssText = divcss; 
                                       
                //Create icon
                img_distance = document.createElement('img');                
                img_distance.setAttribute("width", distance_data.map_distances[i].distance.width_px);
                img_distance.setAttribute("height", distance_data.map_distances[i].distance.height_px);
                img_distance.src = "graphics/distances/map" + current_map_ref + "/" + distance_data.map_distances[i].distance.site_ref + ".jpg";
                img_distance.setAttribute("border", "0");
                img_distance.setAttribute("id", "img_distance_graphic" + distance_data.map_distances[i].distance.site_ref );                                 
                
                div_container.appendChild(img_distance);                 
                document.body.appendChild(div_container); 
	        }
	        //Write out results
	        var distance_km = (total_distance / 1000);
	        var distance_miles = (distance_km * 0.621371192);
	        var approx_time;
	        if(distance_miles > 0)
	        {
	            approx_time = convertDecimalToTime(distance_miles / 3);
	        }
	        else
	        {
	            approx_time = "0mins";
	        }
	        
	        document.getElementById("div_route_result").innerHTML = "<p><b>Distance (km):<\/b> " + distance_km.toFixed(1) + "<\/p>";
	        document.getElementById("div_route_result").innerHTML += "<p><b>Distance (miles):<\/b> " + distance_miles.toFixed(1) + "<\/p>";
	        document.getElementById("div_route_result").innerHTML += "<p><b>Estimated Time:<\/b> " + approx_time + "<\/p>";
	        document.getElementById("div_route_result").innerHTML += '<a href="javasc'+'ript:resetRoutePlanner();routePlanner();toggleSlide(\'div_menu_route\');">Reset<\/a>';
	        document.getElementById("div_route_result").style.display = "block";
            maxh = 30 + getHeight(document.getElementById("div_route_start_text")) + getHeight(document.getElementById("div_route_end_text"))+ getHeight(document.getElementById("div_route_result"));
            timerID["div_menu_route"] = setInterval('slidetick2(\'div_menu_route\', ' + maxh + ');',timerlen);                           
            routeplanner = false;
        } 
        busy = false;             
    }
}

function removeAllDistanceGraphics()
{
    var divarray = new Array();
    var alldivs = document.body.getElementsByTagName("div");
    var divarraycounter = 0;
    
    //Find divs and put into array - ALL DIVS MUST HAVE AN ID OR WILL BREAK IN FIREFOX
    for(var i = 0; i < alldivs.length; i++)
    {
        var d = alldivs[i];        
        if(d.getAttribute("id").indexOf("div_distance_graphic") >= 0)
        {
            divarray[divarraycounter] = d.getAttribute("id");
            divarraycounter++;
        }
    }    
    
    //Delete all divs with IDs in array
    for(var i = 0; i < divarray.length; i++)
    {
        var d = document.getElementById(divarray[i]);
        d.parentNode.removeChild(d);
    }    
}
