//<![CDATA[
    //the left manage control that control of goole maps direction abd zoom
     function TextualZoomControl() {
    }
    TextualZoomControl.prototype = new GControl();

    // Creates a one DIV for each of the buttons and places them in a container
    // DIV which is returned as our control element. We add the control to
    // to the map container and return the element for the map class to
    // position properly.
    TextualZoomControl.prototype.initialize = function(map) {
      var container = document.createElement("div");
      container.style.backgroundColor = "transparent";
      container.align = "center";
      
      
        
       var image;
        //	Zoom In Button
      image = document.createElement("img");
      image.src = "Images/zoomin.gif";
      image.alt = "Zoom In";
      image.title = image.alt;
      image.hspace = "1";
      image.vspace = "1";
      image.style.cursor = "pointer";
      GEvent.addDomListener(image, "click", function() { map.zoomIn(); });
      container.appendChild(image);
      container.appendChild(document.createElement("br"));
      

      // Zoom Out Button
      image = document.createElement("img");
      image.src = "Images/zoomout.gif";
      image.alt = "Zoom Out";
      image.hspace = "1";
      image.vspace = "1";
      image.title = image.alt;
      image.style.cursor = "pointer";
      GEvent.addDomListener(image, "click", function() { map.zoomOut(); });
      container.appendChild(image);
      container.appendChild(document.createElement("br"));

      
     
      image = document.createElement("img");
      image.src = "Images/arrowUp.gif";
      image.alt = "Move To Up";
      image.hspace = "1";
      image.vspace = "1";
      image.title = image.alt;
      image.style.cursor = "pointer";
      GEvent.addDomListener(image, "click", function() { map.panDirection(0, 1); UpdateMapUI(true); });
      container.appendChild(image);
      container.appendChild(document.createElement("br"));

      image = document.createElement("img");
      image.src = "Images/arrowLeft.gif";
      image.alt = "Move To Left";
      image.hspace = "1";
      image.hspace = "1";
      image.vspace = "1";
      image.title = image.alt;
      image.style.cursor = "pointer";
      GEvent.addDomListener(image, "click", function() { map.panDirection(1, 0); UpdateMapUI(true); });
      container.appendChild(image);
     
      
      image = document.createElement("img");
      image.src = "Images/center.gif";
      image.alt = "RE-Center Map";
      image.hspace = "1";
      image.vspace = "1";
      image.title = image.alt;
      image.style.cursor = "pointer";
      GEvent.addDomListener(image, "click", function() { map.returnToSavedPosition(); UpdateMapUI(true); });
      container.appendChild(image);
      
       
      
      image = document.createElement("img");
      image.src = "Images/arrowRight.gif";
      image.alt = "Move To Right";
      image.hspace = "1";
      image.vspace = "1";
      image.title = image.alt;
      image.style.cursor = "pointer";
      GEvent.addDomListener(image, "click", function() { map.panDirection(-1, 0); UpdateMapUI(true); });
      container.appendChild(image);
      container.appendChild(document.createElement("br"));


      image = document.createElement("img");
      image.src = "Images/arrowDown.gif";
      image.alt = "Move To Down";
      image.hspace = "1";
      image.vspace = "1";
      image.title = image.alt;
      image.style.cursor = "pointer";
      GEvent.addDomListener(image, "click", function() { map.panDirection(0, -1); UpdateMapUI(true); });
      container.appendChild(image);
      container.appendChild(document.createElement("br"));
      
     // container.appendChild(starDIV);    
          
       //add these control to div map container
       map.getContainer().appendChild(container);
       
      return container;
    }

    // By default, the control will appear in the top left corner of the
    // map with 7 pixels of padding.
    TextualZoomControl.prototype.getDefaultPosition = function() {
      return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(6, 6));
    }
    TextualZoomControl.prototype.printable = function()
    {
      return false;
    }

    TextualZoomControl.prototype.selectable = function()
    {
      return false;
    }
    // Sets the proper CSS for the given button element.
//    TextualZoomControl.prototype.setButtonStyle_ = function(button) {
//      button.style.textDecoration = "underline";
//      button.style.color = "#0000cc";
//      button.style.backgroundColor = "white";
//      button.style.font = "small Arial";
//      button.style.border = "1px solid black";
//      button.style.padding = "2px";
//      button.style.marginBottom = "3px";
//      button.style.textAlign = "center";
//      button.style.width = "6em";
//      button.style.cursor = "pointer";
//    }
    
    
    function initialize() {
    //resize the page
   //self.resizeTo(1000,800);

    if (GBrowserIsCompatible()) { 

      // ========== Read paramaters that have been passed in ==========
      
      // Before we go looking for the passed parameters, set some defaults
      // in case there are no patameters
      
      //document.getElementById("map").style.height = "300px";
     // document.getElementById("map").style.width = "500px";
     
   
     
     var Country =0
      var lat = 0;
      var lng = 0;
      var zoom = 0;
      var maptype = G_NORMAL_MAP;
      var Region = 0 ;
      var city = 0;
      var Quarter = 0;
      // var to make visible or not visible of control right div
      var pageid = 0;
      // var to check that admin can change kml file
      var admin=0;
      var pagename = 0;
      var GasStationId = 0;
      var PersonId = 0;
      //to control the height of map div
      var height = 0;
      //determine the show map mode if 0 in simple or if 1 is complete 
      var mode = 0;
      // If there are any parameters at eh end of the URL, they will be in  location.search
      // looking something like  "?lat=50&lng=-3&zoom=10&type=h"

      // skip the first character, we are not interested in the "?"
      var query = location.search.substring(1);
       // alert("i am here");
	  // split the rest at each "&" character to give a list of  "argname=value"  pairs
      var pairs = query.split("&");
      for (var i=0; i<pairs.length; i++) {
        // break each pair at the first "=" to obtain the argname and value
	  var pos = pairs[i].indexOf("=");
	  var argname = pairs[i].substring(0,pos).toLowerCase();
	  var value = pairs[i].substring(pos+1).toLowerCase();
        
        // process each possible argname
        if (argname == "gasstationid"){GasStationId = value;}
        if (argname == "country"){Country = value;}
        if (argname == "personid"){PersonId = value;}
        if (argname == "region"){Region = value;}
        if (argname == "city"){city = value;}
        if (argname == "quarter"){Quarter = value;}
        if (argname == "lat") {lat = parseFloat(value);}
        if (argname == "lng") {lng = parseFloat(value);}
        if (argname == "zoom") {zoom = parseInt(value);}
        if (argname == "admin") {admin = value;}
        if (argname == "pageid") {pageid = value;}
        if (argname == "mode") {mode = value;}
        if (argname == "height") {height = value;}
        if (argname == "type") {
        if (value == "m") {maptype = G_NORMAL_MAP;}
        if (value == "k") {maptype = G_SATELLITE_MAP;}
        if (value == "h") {maptype = G_HYBRID_MAP;}
        
        }
      document.getElementById("txtlat").value= lat;
      document.getElementById("txtlon").value= lng;
      }
      //check if mode is 1 to make divmain display block or else to make display none
      if(mode == "1")
      {
        document.getElementById("divamin").style.display ="block";
        document.getElementById("map").style.width ="100%";
        if(height > 0)
        {
        document.getElementById("map").style.height =height+"px";
       // document.getElementById("map").style.width =height+"px";
        }
        else
        document.getElementById("map").style.height ="650px";
        
        var map = new GMap2(document.getElementById("map"));
      }
      else
      {
       document.getElementById("divamin").style.display ="none";
       document.getElementById("divSimple").style.display ="block";
        var map = new GMap2(document.getElementById("map2"));
      }
    
       
      // ========== Create the map using the information obtained above ========
      //check if map exist
     if (map != null)
       {

         
         
        
//       map.addControl(new GScaleControl());
//       var overControl = new GOverviewMapControl();
//       map.addControl(overControl);
//       this.overMap = overControl.getOverviewMap();
//       map.setCenter(new GLatLng(lat,lng), zoom, maptype);
       
        //map.setCenter(new GLatLng(37.4419, -122.1419), 13);
        
        var mapTypeControl = new GMapTypeControl();
        var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10,10));
        var topLeft = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(10,10));
        
        if(mode == "1")
        map.addControl(mapTypeControl, topRight);
        GEvent.addListener(map, "dblclick", function() {
          map.removeControl(mapTypeControl);
          if(mode == "1")
            map.addControl(new GMapTypeControl(), topRight);
          else
          {
          window.open(getURLParam());
          }
          
          
        });
        
        if(mode == "1")
            map.addControl(new GScaleControl());
        var overControl = new GOverviewMapControl();
        if(mode == "1")
            map.addControl(overControl);
            
        this.overMap = overControl.getOverviewMap();
        
        map.setCenter(new GLatLng(lat,lng), zoom, maptype);
        
        if(mode == "1")
            map.addControl(new TextualZoomControl(),topLeft);
        
        
        
       //show map in traffic mode
//        var trafficInfo = new GTrafficOverlay();
//        map.addOverlay(trafficInfo);
        //map.addControl(new ExtMapTypeControl({showTraffic: true, showTrafficKey: true}));
//        map.addControl(new GTrafficOverlay(),topRight);
//        var toggleState = 1;

        // these code to put icon or image
        
        
     
        
       

        
     //add image to show where i am
        var blueIcon = new GIcon(G_DEFAULT_ICON);
        blueIcon.image = "Images/Mark1.png";
//		// Set up our GMarkerOptions object
		markerOptions = { icon:blueIcon };
		var latlng = new GLatLng(lat,lng);
		var marker = new GMarker(latlng, markerOptions);
        var varcmbQuarter = "";
        var varcmbCity = "";
        var openerTitle ="";
        //show the data of where i am when click on image
          GEvent.addListener(marker, "click", function() 
          {
          
          if(pageid != "2")
          {
          //alert(document.getElementById('cmbQuarter'));
            if(document.getElementById('cmbQuarter')!= null)
                varcmbQuarter= document.getElementById('cmbQuarter')[document.getElementById('cmbQuarter').selectedIndex].innerHTML ;
            if(document.getElementById('cmbCity')!= null)
                varcmbCity= document.getElementById('cmbCity')[document.getElementById('cmbCity').selectedIndex].innerHTML ;
           }
//           if(opener != null)
//            openerTitle = opener.document.title;
//            
           //alert(openerTitle);
//            
            marker.openInfoWindowHtml( "<b>الموقع</b> <br/>"+varcmbCity+"<br/>"+varcmbQuarter);
            
          });
          
        //
       
//       if(pageid !=  3)
//        map.addOverlay(marker);
      
         // map.addOverlay("test");
         
         //add image in the center of screen
         map.setCenter(new GLatLng(lat,lng), zoom, maptype);
        var starDIV = document.createElement("div");
        starDIV.style.color = "red";
        starDIV.style.font = "40px, bold";
        
        //starDIV.style = "position: absolute; top: 30%; right: 60%; color: red; font: 40px, bold;";
        starDIV.style.position = "relative";
        starDIV.style.top = "50%";
        //starDIV.style.left = "350px";
       // starDIV.style.top = "250";
        //starDIV.innerHTML = "*";
        starDIV.innerHTML = "<img src=Images/MarkStr.png /> " ;
        //starDIV.setAttribute("style","vertical-align:middle");
        starDIV.setAttribute("align","center");
        starDIV.setAttribute("valign","middle");
        
        map.setCenter(new GLatLng(lat,lng), zoom, maptype);
        
       if(pageid ==3 || pageid ==1)
        document.getElementById("map").appendChild(starDIV); 

        
        }
      // code to generate Small map
        
        // A TextualZoomControl is a GControl that displays textual "Zoom In"
    // and "Zoom Out" buttons (as opposed to the iconic buttons used in
    // Google Maps).
   
      
      
	  
      

      // ========== This function will create the "link to this page"
    // -------- to check for page type and user type
      if(admin == 1)
      {
       pagename = "ChangeKmlFile.aspx" ;
      }
      else
      pagename = "InsertGasStation.aspx";
     function getcord()
     {
    // alert("hiiiiiiiiiii");
      document.getElementById("txtlat").value= map.getCenter().lat().toFixed(6);
      document.getElementById("txtlon").value= map.getCenter().lng().toFixed(6);
      }
      
      function makeLink() {
      
        getcord();
      
         var a= pagename+"?do=register&Region="+Region+"&city="+city+"&Quarter="+Quarter+"&GasStationId="+GasStationId+"&PersonId="+PersonId
           + "&lat=" + map.getCenter().lat().toFixed(6)
           + "&lng=" + map.getCenter().lng().toFixed(6)
           + "&zoom=" + map.getZoom()
           + "&type=" + map.getCurrentMapType().getUrlArg();
         //document.getElementById("link").innerHTML = '<br><p style="font-family: Times New Roman;	font-size: 16px;color: #003399;	font-weight: bold;"  >الرجاء تكبير الخريطة باستخدام قائمة التحكم التي تظهر على اليسار ثم حتى تجد اقرب صورة لمنزلك أو المبنى  الذي تقيم فيه تأكد أن النجمة الحمراء على المبنى تماما<strong><a href="' +a+ '" class=mapLink>إضغط هنا</a></strong></p>';
         document.getElementById("link").innerHTML = '<br><p style="font-family: Times New Roman;	font-size: 16px;color: #003399;	font-weight: bold;"  ><strong><a href="#" class=mapLink onclick="self.close();return false;">اغلق النافذة</a></strong></p>';
      
        
        
      }
      
      
      function SetCoord()
      {
          getcord();
            
         var a= pagename+"?do=register&Region="+Region+"&city="+city+"&Quarter="+Quarter+"&GasStationId="+GasStationId+"&PersonId="+PersonId
           + "&lat=" + map.getCenter().lat().toFixed(6)
           + "&lng=" + map.getCenter().lng().toFixed(6)
           + "&zoom=" + map.getZoom()
           + "&type=" + map.getCurrentMapType().getUrlArg();
           document.getElementById("link").innerHTML = '<br><p style="font-family: Times New Roman;	font-size: 16px;color: #003399;	font-weight: bold;"  ><strong><a href="#" class=mapLink onclick="self.close();return false;"> اغلق النافذة</a></strong></p>';
           
           //lat 
         if(opener != null)
         {
          var parent_lat = opener.document.addlistingForm.fieldUserDefinedDoubleNumber4TextBox.value;
          if(parent_lat != "")
           frmSelect.lat.value = parent_lat;
          else
           frmSelect.lat.value = -1;
          //lng
          var parent_lng = opener.document.addlistingForm.fieldUserDefinedDoubleNumber3TextBox.value;
          if(parent_lng != "")
           frmSelect.lng.value = parent_lng;
          else
           frmSelect.lng.value = -1;
         }
                       
       
      }
      
      function getURLParam(){


          var strReturn = "";
          var strQueryString = "";
//          var strHref = window.location.href;
//          if ( strHref.indexOf("?") > -1 )
//          {
//          
//             strQueryString = "tttttttttttt";
//             alert(strQueryString);
//           }
           strQueryString = "GoogleEarth.aspx?Country="+Country+"&Region"+Region+"&city="+city+"&Quarter="+Quarter+"&GasStationId="+GasStationId+"&PersonId="+PersonId
           + "&lat="+lat 
           + "&lng=" + lng
           + "&zoom=15" 
            + "&pageid=2"  
           + "&type=m" 
           +"&mode=1" ;
           
          return strQueryString;
  
     } 



     
      
//    function RemoveLink()
//        {
//        getcord();
//        document.getElementById("link").innerHTML = '<br><p style="font-family: Times New Roman;	font-size: 16px;color: #003399;	font-weight: bold;"  >عند الانتهاء من رؤية موقعك على الخريطة الرجاء <strong><a href="#" class=mapLink onclick="self.close();return false;">الضغط هنا</a></strong></p>';
//        }
      // Make the link the first time when the page opens
      
      //general of google map all feature but remove star
       if(pageid == "1")
        {
         makeLink();
         GEvent.addListener(map, 'moveend', makeLink);
         map.addOverlay(marker);
        
        }
      //show marker and remove right control , and  make page read only
      else if(pageid == "2")
        {
        makeLink();
        GEvent.addListener(map, 'moveend', makeLink);
        map.addOverlay(marker);
        }
        
      //in insert mode , control panel is appear and show star here
      else if(pageid == "3")
        {
             document.getElementById("map").appendChild(starDIV); 
             GEvent.addListener(map, 'moveend', makeLink);
             SetCoord();
            
      
        }
        
        map.setCenter(new GLatLng(lat,lng), zoom, maptype);
        
      // Make the link again whenever the map changes
      
      
      // to check for the link div to appear  or not
//      if(pageid == 1)
//      {
//       document.getElementById("link").innerHTML  = '';
//      }
      
      
      
        
    }
    
    // display a warning if the browser was not compatible
    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }

    // This Javascript is based on code provided by the
    // Blackpool Community Church Javascript Team
    // http://www.commchurch.freeserve.co.uk/   
    // http://www.econym.demon.co.uk/googlemaps/

    //]]>
   
  }