//<![CDATA[
 
	var side_bar_html = "";
	var gmarkers = [];
   var htmls = [];
   var map;
   var mapdiv;
   var tooltip;
   var closeitdiv;

	function showMap(id) {

		if (GBrowserIsCompatible()) {

			// hide the previous map if exists
			if (mapdiv) mapdiv.style.display="none";
			if (closeitdiv) closeitdiv.style.display="none";
			
			
			

         mapdiv = document.getElementById("mapdiv");
         //mapdiv.style.display="visible";
         mapdiv.style.display="block";
         mapdiv.style.width="828px";
         mapdiv.style.height="500px";
         mapdiv.style.position="relative";
         mapdiv.style.top="0px";
         mapdiv.style.left="0px";
         //mapdiv.style.borderWidth = "medium";


         mapbox = document.getElementById("mapbox");
         mapdiv.style.display="visible";
         mapbox.style.display="block";
         mapbox.style.width="828px";
         mapbox.style.height="500px";
         mapbox.style.position="relative";
         mapbox.style.top="0px";
         mapbox.style.left="0px";
         //mapbox.style.borderWidth = "medium";


		   var i = 0;
			//alert("Creating map for "+id+" "+phpmarkers[id]);
		        // create the map

			map = new GMap2(document.getElementById("mapbox"));
	      map.setCenter(phpmarkers[0], 10);

	      map.addControl(new GSmallMapControl());
         map.addControl(new GMapTypeControl());
         map.enableScrollWheelZoom();
         map.enableContinuousZoom();
         map.enableDoubleClickZoom();
         //new GKeyboardHandler(map);
         // ====== set up marker mouseover tooltip div ======
         tooltip = document.createElement("div");
         document.getElementById("mapdiv").appendChild(tooltip);
         tooltip.style.visibility = "hidden";

	//		var marker = new GMarker(phpmarkers[0]);
   //      map.addOverlay(marker);

			//alert(phpmarkers.length);
         for (var i = 0; i < phpmarkers.length; i ++ ) {
             // obtain the attribues of each marker
             var point = phpmarkers[i];
             var html = phphtmls[i];
             //alert(html);
             var label = phpnames[i];
             // create the marker
             var marker = createMarker(point, label, html, i);
             //sidebar(label, i);
         }


			msgwintxt = label+" "+html;
//			map.openInfoWindowHtml(map.getCenter(), html);

         map.zoomToMarkers();

//         closebtn = "closeit_"+id;
//         alert(closebtn);
//         closeitdiv = document.getElementById(closebtn);
//		   if (closeitdiv) {
//	         closeitdiv.style.display="block";
//	         closeitdiv.style.width="25";
//	         closeitdiv.style.position="absolute";
//	         closeitdiv.style.left="600px";
//			}
		}
		 else {
		    alert("Sorry, the Google Maps API is not compatible with this browser");
		}
	}




    // A function to create the marker and set up the event window
    function createMarker(point, name, html, i) {
        var icon = new GIcon();
        icon.shadow = "";
        icon.iconSize = new GSize(20, 34);
        icon.iconAnchor = new GPoint(19, 27);
        icon.image = "http://www.paintballfield.com/images/markers/blank.png";

        var marker = new PdMarker(point, icon);
        // === store the name so that the tooltip function can use it ===
        marker.tooltip = '<div class="tooltip">' + html + '</div>';
        marker.setHoverImage("http://www.paintballfield.com/images/mapicon2.gif");
        gmarkers[i] = marker;
        htmls[i] = html;

        map.addOverlay(marker);

        //  ======  The new marker "mouseover" and "mouseout" listeners  ======
        GEvent.addListener(marker, "mouseover", function() {
			marker.setTitle(name);
        	marker.topMarkerZIndex(); // bring marker to top
            showTooltip(marker);
            //document.getElementById("sidebar").getElementsByTagName("div")[i].style.background = "yellow";
        });
        GEvent.addListener(marker, "mouseout", function() {
        	      marker.restoreMarkerZIndex();
            tooltip.style.visibility = "hidden";
            //document.getElementById("sidebar").getElementsByTagName("div")[i].style.background = "white";
        });
        GEvent.addListener(marker, "click", function() {
			document.location.href = phpurls[i];

        });
    }


    var teksti = " ";
    function sidebar(line, j) {
        teksti += "<div class='sidebar_row'";
        teksti += "onclick='GEvent.trigger(gmarkers[" + j + "],\"click\")' ";
        teksti += "onmouseover='GEvent.trigger(gmarkers[" + j + "],\"mouseover\")' ";
        teksti += "onmouseout='GEvent.trigger(gmarkers[" + j + "],\"mouseout\")' ";
        teksti += ">" + (j+1) +". ";
        teksti += line;
        teksti += "</div>";
        document.getElementById("sidebar").innerHTML = teksti;
    }

    // ====== This function displays the tooltip ======
    // it can be called from an icon mousover or a side_bar mouseover
    function showTooltip(marker) {
        tooltip.innerHTML = marker.tooltip;
        var point = map.getCurrentMapType().getProjection().fromLatLngToPixel(map.getBounds().getSouthWest(), map.getZoom());
        var offset = map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(), map.getZoom());
        var anchor = marker.getIcon().iconAnchor;
        var width = marker.getIcon().iconSize.width;
        var pos = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(offset.x - point.x - anchor.x + width ,- offset.y + point.y + anchor.y - 90));
        pos.apply(tooltip);
        tooltip.style.visibility = "visible";
    }



//]]>