﻿//Global variables
var map;
var gmarkers;
var baseIcon;
var tooltip;

function InitMap() 
{
    if ((typeof(GBrowserIsCompatible) == "function") && GBrowserIsCompatible()) 
    {    
          var mapDiv = document.getElementById("map");
          if (mapDiv!=null) 
          {   
              gmarkers = []; // arrays to hold copies of the markers and html used by the side_bar
              //var numberBlocks = 11;     
              
              baseIcon = new GIcon();
              //baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
              baseIcon.iconSize = new GSize(32, 14);
             // baseIcon.shadowSize = new GSize(37, 34);
              baseIcon.iconAnchor = new GPoint(1, 0);
              //baseIcon.infoWindowAnchor = new GPoint(0, 0);
             // baseIcon.infoShadowAnchor = new GPoint(18, 25);
              tooltip = document.createElement("div");  
                 
              map = new GMap2(mapDiv);
              //map.enableScrollWheelZoom();
              map.addControl(new GLargeMapControl());
              map.addControl(new GMapTypeControl());
              map.addControl(new GScaleControl());
              map.addControl(new GOverviewMapControl());
              //map.setCenter(new GLatLng(0, 0), 2);
          }   
    }
    else 
    {
        map = null;
      //alert("Sorry, the Google Maps API is not compatible with this browser");
    }
}

function GoogleMapUnload()
{
    if (typeof(GUnload) == "function") GUnload();
}


  // A function to create the marker and set up the event window
  function createMarker(id, point, iconType, xoffset, yoffset) {
       
    var marker = new GMarker(point, {icon:iconType});

    GEvent.addListener(marker,"mouseover", function() {
    //showStoreTooltip(marker, xoffset, yoffset);
   // marker.openInfoWindowHtml("");
    }
    ); 
    GEvent.addListener(marker,"mouseout", function() {
    //hideStoreToolTip()
    }
    ); 
      
   GEvent.addListener(marker,"click", function() {
       showStoreTooltip(marker, xoffset, yoffset);
      }
    ); 
  

    return marker;
  }
      
  function deleteMarkers() {
   for (var i=0;i<gmarkers.length;i++)
   {
    map.removeOverlay(gmarkers[i]);   
   }
  }

  function hideStoreToolTip() 
  {
    tooltip.style.visibility="hidden"
  }
  
  function showStoreTooltip(marker, xoffset, yoffset) {
    var mapDiv  = document.getElementById("map");
    mapDiv.appendChild(tooltip);
    tooltip.style.visibility="hidden";
    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 iconAnchor=marker.getIcon().iconAnchor;
    var iconWidth=marker.getIcon().iconSize.width;
    
    var tooltipH = tooltip.clientHeight; 
    var tooltipW = tooltip.clientWidth;

    var mapH = mapDiv.clientHeight;
    var mapW = mapDiv.clientWidth;
    
    var tooltipPosX = offset.x - point.x; //bottom left corner
    var tooltipPosY = - offset.y + point.y;
    
    if (tooltip.childNodes && tooltip.childNodes[0])
    {
        //??
        tooltipH = tooltip.childNodes[0].clientHeight;
        tooltipW = tooltip.childNodes[0].clientWidth;
    }

    tooltipPosY = tooltipPosY + yoffset + iconAnchor.y;
    var ycorr = tooltipH / 2;
    if (tooltipPosY + ycorr > mapH) {
        tooltipPosY = mapH - tooltipH + yoffset + iconAnchor.y;
    }
    else if (tooltipPosY - ycorr < 0) {
        tooltipPosY = yoffset + iconAnchor.y;
    }
    else {
        tooltipPosY = tooltipPosY - ycorr;
    }

    tooltipPosX = tooltipPosX + iconWidth + xoffset + iconAnchor.x;
    if ((tooltipPosX + tooltipW) > (mapW + MapXOverflowSpace)) {
        tooltipPosX = tooltipPosX - tooltipW - iconWidth - iconAnchor.x;
    }
    
    //var pos = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(offset.x - point.x - anchor.x - xoffset*width,- offset.y + point.y +yoffset * (anchor.y + ycorr))); 
     var pos = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(tooltipPosX,tooltipPosY)); 
    //var bounds = map.getBounds();

   // if(map.getBounds().containsLatLng(marker.getPoint()))
   // {
        pos.apply(tooltip);
        tooltip.style.visibility="visible";
   // }
//    else
//    {
//        alert('Tooltip not visible from here');
//        tooltip.innerHTML = "";
//    }
    }
 
 function showMap(storesTableId, defStoreId, defLat, defLong, defZoom, startAddress)
 {
    InitMap();
    if (map==null) 
    {
        //alert('map not initialized')
        return;
    }
    map.setCenter(new GLatLng(defLat, defLong), defZoom);
    
    var StoresTable = document.getElementById(storesTableId);     
    
    var itemsTodisplay;
    var marker;
      
    if(StoresTable != null && StoresTable.rows.length > 0)
    {   
        deleteMarkers();

        //Start from 1; 0 - HeaderRow
        var storesTableColumnsCount = StoresTable.rows[0].cells.length;
        for(var j = 1 ; j < StoresTable.rows.length ; j++)
        {
         if(StoresTable.rows[j] != null)
         {
           
          var standardIcon = new GIcon(baseIcon);
          standardIcon.image = "/_layouts/BelCompany/bc.gif"; 

          var storename = StoresTable.rows[j].cells[0].innerHTML;
          var storeid = StoresTable.rows[j].cells[1].innerHTML;
          var latitude = StoresTable.rows[j].cells[2].innerHTML;
          var longitude = StoresTable.rows[j].cells[3].innerHTML;
          var city = StoresTable.rows[j].cells[4].innerHTML;
          var streetAddress = StoresTable.rows[j].cells[5].innerHTML;
          var postCode = StoresTable.rows[j].cells[6].innerHTML;
          var phone1 = StoresTable.rows[j].cells[7].innerHTML;
          var phone2 = StoresTable.rows[j].cells[8].innerHTML;  //fax??
          var monWork = StoresTable.rows[j].cells[9].innerHTML;
          var tueWork = StoresTable.rows[j].cells[10].innerHTML;
          var wedWork = StoresTable.rows[j].cells[11].innerHTML;
          var thuWork = StoresTable.rows[j].cells[12].innerHTML;
          var friWork = StoresTable.rows[j].cells[13].innerHTML;
          var satWork = StoresTable.rows[j].cells[14].innerHTML;
          var sunWork = StoresTable.rows[j].cells[15].innerHTML;
          var email = StoresTable.rows[j].cells[16].innerHTML;
          var imageUrl = StoresTable.rows[j].cells[17].innerHTML;
          //if (imageUrl == null || imageUrl == '') 
          //{
          //  imageUrl = "/_layouts/BelCompany/No_Image_thumb.jpg";
          //} 
          if(!((longitude == 0)&&(latitude == 0)))
          {
               latitude = latitude.replace(",", ".");
               longitude = longitude.replace(",", ".");
               var googleRouteApi = "http://maps.google.nl/?saddr="
               if (startAddress!=null)
               {
                    googleRouteApi = googleRouteApi + startAddress;
               }
               googleRouteApi = googleRouteApi +"&daddr="+streetAddress+"," + city +",Nederland";
              
               var point = new GLatLng(latitude,longitude);
               var xoffset = 0;
               var yoffset = 0;
               var marker = createMarker(storeid, point, standardIcon, xoffset, yoffset);

               var tooltipHtml ='<div class="popup2 popupStore"><div class="close"><img onclick="hideStoreToolTip();" src="/_layouts/BelCompany/pop-x.gif" /></div>'
               + '<div class="popTop">'+ storename + '</div><div class="popMain"><div><img src="'
               + imageUrl + '" align="left" alt="'+storename+'" title="'+storename+'"/>'
               + streetAddress + '<br />' + postCode;
               if (phone1 != null && phone1!='') 
               {
                    tooltipHtml = tooltipHtml + '<br />tel.'+ phone1;
               } 
               if (phone2 != null && phone2!='') 
               {
                    tooltipHtml = tooltipHtml + '<br />tel.'+ phone2;
               } 
               if (email != null && email!='') 
               {
                    tooltipHtml = tooltipHtml + '<br/>email: <a href="mailto:' + email + '">' + email + '</a>';
               } 
              
               tooltipHtml = tooltipHtml
               + '<input type="button" class="btnNormal floatRight" title="'+PlanRouteLongText+'" value="'+PlanRouteButtonText+'" onclick="window.open(\''+ googleRouteApi + '\',\'planroute\')"/>'
               + '</div><div class="clear">&nbsp;</div><div class="clear">&nbsp;</div>'
               + '<div class="workTime"><label><strong>'+WorkTimeText+'</strong></label><br />'
               + '<label>'+Monday+'</label>&nbsp;<label>' + monWork + '</label><br />'
               + '<label>'+Tuesday+'</label>&nbsp;<label>' + tueWork + '</label><br />'
               + '<label>'+Wednesday+'</label>&nbsp;<label>' + wedWork + '</label><br />'
               + '<label>'+Thursday+'</label>&nbsp;<label>' + thuWork + '</label><br />'
               + '<label>'+Friday+'</label>&nbsp;<label>' + friWork + '</label><br />'
               + '<label>'+Saturday+'</label>&nbsp;<label>' + satWork + '</label><br />'
               + '<label>'+Sunday+'</label>&nbsp;<label>' + sunWork + '</label><br />'
               + '<div class="clear">&nbsp;</div><div class="vspace">&nbsp;</div></div>';

               if (storesTableColumnsCount > 18) {
                   tooltipHtml = tooltipHtml + '<div>';
                   tooltipHtml = tooltipHtml + unescape(DeliveryEstimateText) + '<br /><br />';
                   tooltipHtml = tooltipHtml + '</div><div class="clear">&nbsp;</div>'
                        + '<div><input type="button" class="btnNormal floatRight" value="' + ChooseStoreButtonText + '" ' +
                        'onclick="GoogleMapUnload();__doPostBack(\'' + PostBackTarget + '\', \'' + storeid + '\');" /></div>' +
                        '<div class="clear">&nbsp;</div>';
               }

               tooltipHtml = tooltipHtml + '</div><div class="popBot">&nbsp;</div></div>';
   
               marker.tooltip = tooltipHtml;
                
               gmarkers[j] = marker;
          
               map.addOverlay(gmarkers[j]);
               
               if (defStoreId != null  &&  defStoreId == storeid)
               {
                    showStoreTooltip(marker,xoffset,yoffset);      
               }

           }//end !((longitude == 0) && (latitude == 0)) 
           }// end StoresTable.rows[j] != null
          } //end for
         }//if StoresTable != null       
}   //end showMap function

 //Default values
 
 var PostBackTarget = 'StoreSelected';
 
 var FewProductsMaxBorder = 100;
 var FewProductsMinBorder = 1; 
 //Resources
 var NotAvailableText = 'Not available';
 var FewInStockText = 'Few in stock';
 var InStockText = 'In stock';
 var PlanRouteLongText='Plan route naar deze winkel';
 var PlanRouteButtonText = 'Plan route'
 var WorkTimeText = 'Openingstijden';
 var Monday = 'Maandag'; 
 var Tuesday = 'Dinsdag';
 var Wednesday = 'Woensdag';
 var Thursday = 'Donderdag';
 var Friday = 'Vridjdag';
 var Saturday = 'Zaterdag';
 var Sunday = 'Zondag';
 var ProductText = 'Product';
 var StockStatusText = 'Stock Status';
 var ChooseStoreButtonText = 'Kies deze winkel';
 var DeliveryEstimateText = '';
 var MapXOverflowSpace = 222;
      
if(typeof(Sys) != "undefined") {
    if (typeof(Sys.Application) != "undefined") { 
       Sys.Application.notifyScriptLoaded();
    }
}
