// JavaScript Document
//<![CDATA[

// arrays to hold copies of the markers and html used by the side_bar
// because the function closure trick doesnt work there
var branchesMap;
var gmarkers = [];
var i = 0;
var lastlinkid;

// This function picks up the click and opens the corresponding info window
      function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
      }

function load() {
    
  if (GBrowserIsCompatible()) { 

      // this variable will collect the html which will eventually be placed in the side_bar
      var side_bar_html = '<ul><li><strong>ACG Local Branches</strong></li>';
      var i = 0;

     // A function to create the marker and set up the event window
      function createMarker(point,name,html) {
        var marker = new GMarker(point);
        var linkid = "link"+i;
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
          document.getElementById(linkid).style.background="#6FAFDF";
          lastlinkid=linkid;
        });
        // save the info we need to use later for the side_bar
        gmarkers[i] = marker;
        // add a line to the side_bar html
        side_bar_html += '<li id="'+linkid+'"><a href="javascript:myclick(' + i + ')">' + name + '</a></li>';
        i++;
        return marker;
      }

      		branchesMap = new GMap2(document.getElementById("map"));
      		branchesMap.addControl(new GLargeMapControl());
      		branchesMap.addControl(new GMapTypeControl());
		branchesMap.addControl(new GOverviewMapControl(new GSize(100, 100)));
      		branchesMap.setCenter(new GLatLng(56.412281, -3.724365), 6); //13 = map scale, zoom from 1 - 17

      		// Set up Scotland map markers with info windows 
     		
		var point = new GLatLng(56.62162, -3.86448);
      		var marker = createMarker(point, 'Aberfeldy', '<div class="caption"><p><strong>Aberfeldy</strong></p><a href="http://www.acgmod.org/branches/detail/aberfeldy">Aberfeldy branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.59276, -3.33891);
      		var marker = createMarker(point, 'Blairgowrie', '<div class="caption"><p><strong>Blairgowrie</strong></p><a href="http://www.acgmod.org/branches/detail/blairgowrie">Blairgowrie branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(58.59287, -3.52539);
      		var marker = createMarker(point, 'Caithness', '<div class="caption"><p><strong>Caithness</strong></p><a href="http://www.acgmod.org/branches/detail/caithness">Caithness branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.41857, -5.24993);
      		var marker = createMarker(point, 'Cruachan', '<div class="caption"><p><strong>Cruachan</strong></p><a href="http://www.acgmod.org/branches/detail/cruachan">Cruachan branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.46133, -2.96841);
      		var marker = createMarker(point, 'Dundee', '<div class="caption"><p><strong>Dundee</strong></p><a href="http://www.acgmod.org/branches/detail/dundee">Dundee branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(55.94682, -4.92301);
      		var marker = createMarker(point, 'Dunoon', '<div class="caption"><p><strong>Dunoon</strong></p><a href="http://www.acgmod.org/branches/detail/dunoon">Dunoon branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(55.77303, -4.16683);
      		var marker = createMarker(point, 'East Kilbride', '<div class="caption"><p><strong>East Kilbride</strong></p><a href="http://www.acgmod.org/branches/detail/east-kilbride">East Kilbride branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(57.60588, -4.44058);
      		var marker = createMarker(point, 'Easter Ross', '<div class="caption"><p><strong>Easter Ross</strong></p><a href="http://www.acgmod.org/branches/detail/easter-ross">Easter Ross branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(55.96568, -3.19444);
      		var marker = createMarker(point, 'Edinburgh', '<div class="caption"><p><strong>Edinburgh</strong></p><a href="http://www.acgmod.org/branches/detail/edinburgh">Edinburgh branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.00065, -3.78437);
      		var marker = createMarker(point, 'Falkirk', '<div class="caption"><p><strong>Falkirk</strong></p><a href="http://www.acgmod.org/branches/detail/falkirk">Falkirk branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(55.9, -4.25728);
      		var marker = createMarker(point, 'Glasgow', '<div class="caption"><p><strong>Glasgow</strong></p><a href="http://www.acgmod.org/branches/detail/glasgow">Glasgow branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(57.46699, -4.19696 );
      		var marker = createMarker(point, 'Inverness', '<div class="caption"><p><strong>Inverness</strong></p><a href="http://www.acgmod.org/branches/detail/inverness">Inverness branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(55.75551, -6.28882);
      		var marker = createMarker(point, 'Isle of Islay', '<div class="caption"><p><strong>Isle of Islay</strong></p><a href="http://www.acgmod.org/branches/detail/islay">Isle of Islay branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(57.47393, -6.42507);
      		var marker = createMarker(point, 'Isle of Skye', '<div class="caption"><p><strong>Isle of Skye</strong></p><a href="http://www.acgmod.org/branches/detail/skye">Isle of Skye branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(55.6100, -4.4992);
      		var marker = createMarker(point, 'Kilmarnock', '<div class="caption"><p><strong>Kilmarnock</strong></p><a href="http://www.acgmod.org/branches/detail/kilmarnock">Kilmarnock branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(58.0303, -4.40243);
      		var marker = createMarker(point, 'Lairg', '<div class="caption"><p><strong>Lairg</strong></p><a href="http://www.acgmod.org/branches/detail/lairg">Lairg branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(55.79446, -4.8698);
      		var marker = createMarker(point, 'Largs', '<div class="caption"><p><strong>Largs</strong></p><a href="http://www.acgmod.org/branches/detail/largs">Largs branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(58.20942, -6.38825);
      		var marker = createMarker(point, 'Lewis', '<div class="caption"><p><strong>Lewis</strong></p><a href="http://www.acgmod.org/branches/detail/lewis">Lewis branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(57.84064, -5.5694);
      		var marker = createMarker(point, 'Loch Ewe', '<div class="caption"><p><strong>Loch Ewe</strong></p><a href="http://www.acgmod.org/branches/detail/loch-ewe">Loch Ewe branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.10033, -5.47613);
      		var marker = createMarker(point, 'Loch Fyne', '<div class="caption"><p><strong>Loch Fyne</strong></p><a href="http://www.acgmod.org/branches/detail/loch-fyne">Loch Fyne branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.54854, -4.12363);
      		var marker = createMarker(point, 'Loch Tayside', '<div class="caption"><p><strong>Loch Tayside</strong></p><a href="http://www.acgmod.org/branches/detail/loch-tayside">Loch Tayside branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.80479, -5.11766);
      		var marker = createMarker(point, 'Lochaber', '<div class="caption"><p><strong>Lochaber</strong></p><a href="http://www.acgmod.org/branches/detail/lochaber">Lochaber branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(53.48077, -2.23437);
      		var marker = createMarker(point, 'Manchester', '<div class="caption"><p><strong>Manchester</strong></p><a href="http://www.acgmod.org/branches/detail/manchester">Manchester branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.41667, -5.9);
      		var marker = createMarker(point, 'Mull and Iona', '<div class="caption"><p><strong>Mull and Iona</strong></p><a href="http://www.acgmod.org/branches/detail/mull-and-iona">Mull and Iona branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.41041, -5.46973);
      		var marker = createMarker(point, 'Oban', '<div class="caption"><p><strong>Oban</strong></p><a href="http://www.acgmod.org/branches/detail/oban">Oban branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(55.84542, -4.42351);
      		var marker = createMarker(point, 'Paisley', '<div class="caption"><p><strong>Paisley</strong></p><a href="http://www.acgmod.org/branches/detail/paisley">Paisley branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(56.12452, -4.08245);
      		var marker = createMarker(point, 'Stirling', '<div class="caption"><p><strong>Stirling</strong></p><a href="http://www.acgmod.org/branches/detail/stirling">Stirling branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
		var point = new GLatLng(58.22091, -6.39545);
      		var marker = createMarker(point, 'Stornoway', '<div class="caption"><p><strong>Stornoway</strong></p><a href="http://www.acgmod.org/branches/detail/stornoway">Stornoway branch details</a></div>')
      		branchesMap.addOverlay(marker);
                
      		
               GEvent.addListener(branchesMap,"infowindowclose", function() {document.getElementById(lastlinkid).style.background="transparent";});
                    
                // put the assembled side_bar_html contents into the side_bar div
                side_bar_html += '</ul>';
                document.getElementById("side_bar").innerHTML = side_bar_html;
        }
    	// display a warning if the browser was not compatible
    	else {
      		alert("Sorry, the Google Maps API is not compatible with this browser");
    	}
}
    //]]>