//
// File : weeds-rtwgmap-ui.js
//
// Description : Javascript functions for rendering components on a RTWGMap
//               implementation. Overrides several functions found in the 
//               RTWGMap's javascript lib
//
//  

 
    //
    // Custom Rendering for Hay Listings on the sidebar
    //
    var renderMarkerForSideListing = function(marker){
        var html = "";
        if(marker != null)
        {
	        //
            // render the marker as a link that calls "myclick(marker.id)" when it's selected
            // (shows the gmap bubble - information bubble usually)
            // with the marker's icon changing colour if/when the mouse is over the link
            //
            // In this implementation the sideListing text will be : 
            //                 <marker.name> - with a href/link to call myclick() to show the info bubble
            //       <marker.additionalInfo.summary>  - number of listings per category
            //      
            
			var weed = "";
			var severityLevel;

			if(selectedFilters && selectedFilters.length > 0)  {
			   	weed = selectedFilters[0].label;
				severityLevel = marker.severityLevels[weed];
			}

			var summary = "";

			if(severityLevel)                    	
				summary = marker.severityLevelLabels[weed];

			var tooltip = marker.name.entityify() + ' - ' + summary;
          
            // open the marker's info bubble if the sideListing link is clicked
            html += '<a class="smallText" href="javascript:myclick(' + marker.id + ')"';

            // add js to make the marker change it's icon if/when the mouse is over the link
            var highliteImage = '/app68/listings/icons/maps/green.png';
            normalImage = '/app68/listings/icons/maps/weeds/' + severityLevel + '.png';
   
                   
            html += '  onmouseover="gmarkers['+marker.id+'].setImage(\''+ highliteImage + '\'); showTooltip(gmarkers['+marker.id+'], \''+tooltip+'\');  "';
            html += '  onmouseout="gmarkers['+marker.id+'].setImage(\'' + normalImage + '\'); hideTooltip();"';
			
			//side listing text
            html += '  >' +marker.name + '</a><br/><span class="smallText">'  + summary  + '</span><br/><br/>';
        }
        
        return (html);
    }   
   
        
  
 
   

    //
    // Overrides showInfoTabs in rtwgmap-ui.js
    //
    // show the info tabs for a markerObj when the user clicks it's gmarker
    // see createGMarker(markerObj)
    //
    var showInfoTabs = function(gmarker, markerObj) {
              
        if(markerObj.additionalInfo.participating == 'N') {
        	showNonParticipatingInfo(gmarker, markerObj);
        	return;
        }
        
		var weed = selectedFilters[0].label;            
		var severityLevel = markerObj.severityLevels[weed];
		var summary = "";
		
		if(severityLevel)                    	
		  summary = markerObj.severityLevelLabels[weed];
                
       // Build the gmarker's window tabs 
       var tabs = [];
       var tabToSelect = 0;
	   var i=0;
       for(tabLabel in markerObj.infoTabs)	{
        	var label = tabLabel;
        	var html = markerObj.infoTabs[tabLabel];
        	html = html.replace(weed, "<b><u>" + weed + "</u></b>"); // underline the current filtered weed
        	if(label == summary)
        	  tabToSelect = i;
        	tabs[i++] = new GInfoWindowTab(label, html);        	
    	}
       

       var opts = {maxWidth:340, selectedTab:tabToSelect}; 
       gmarker.openInfoWindowTabs(tabs, opts);
    }

   //
   // Initialize the side listing with some simple instructions/overview
   //
   var initSideListing = function() {
	    document.getElementById("sideListing").innerHTML = "<br/>Choose a weed in the list above to show the survey results for counties in Alberta.";
   }




    //
    // show the info tabs for a markerObj when the user clicks a
    // non-participating justicition marker
    //
    function showNonParticipatingInfo(gmarker, markerObj) {
       var infoHtml = markerObj.additionalInfo.html;    
       var infoTabs = [];
       infoTabs[0] = new GInfoWindowTab("Info", infoHtml);

       map.panTo( gmarker.getPoint() ); //gmarker.getLatLng());
       var opts = {maxWidth:340}; 
       hideTooltip();
       gmarker.openInfoWindowTabs(infoTabs, opts);
    }
    

	var noDataIcon = null;

    //
    // returns the icon used for no data
    //
    function getNoDataIcon() {
		if(noDataIcon) return noDataIcon;
		
		noDataIcon = new GIcon();
		iconsArray['nodata'] = noDataIcon;
      	noDataIcon.image = "/app68/listings/icons/maps/weeds/circle.png";
      	//noDataIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
	    noDataIcon.iconSize = new GSize(20, 20);
      	noDataIcon.shadowSize = new GSize(37, 34);
      	noDataIcon.iconAnchor = new GPoint(6, 34);
      	noDataIcon.infoWindowAnchor = new GPoint(5, 1);
      	noDataIcon.infoShadowAnchor = new GPoint(18, 25);
      	//noDataIcon.transparent = "http://www.google.com/intl/en_ALL/mapfiles/markerTransparent.png";
      	//noDataIcon.printImage = "/app68/listings/icons/maps/weeds/circle.png";
      	//noDataIcon.mozPrintImage = "/app68/listings/icons/maps/weeds/circle.png";
    
     	return noDataIcon;
    }

     
     
     
    //
    // called within createGMarker()
    //
    var loadIcons = function () {
    	if(iconsArray['red']) return;  // already loaded
    	
    	var colors = new Array('red','green','yellow','purple','orange','white');
	    for (var i=0;i<colors.length;i++) {
    		//icon graphic
		    eval('iconsArray[\''+colors[i] +'\'] = new GIcon(G_DEFAULT_ICON);');
    		eval('iconsArray[\''+colors[i] +'\'].image =  "/app21/rtw/icons/maps/' + colors[i] +'.png";');
    		eval('iconsArray[\''+colors[i] +'\'].url =  "/app21/rtw/icons/maps/' + colors[i] +'.png";');
		    eval('iconsArray[\''+colors[i] +'\'].shadow = "/app21/rtw/icons/maps/shadow50.png";');
    		eval('iconsArray[\''+colors[i] +'\'].iconSize = new GSize(20, 34);');
	    	eval('iconsArray[\''+colors[i] +'\'].shadowSize =new GSize(37, 34);');
	    	eval('iconsArray[\''+colors[i] +'\'].iconAnchor = new GPoint(6, 34);');
		    eval('iconsArray[\''+colors[i] +'\'].infoWindowAnchor = new GPoint(5, 1);');
	    }
	    getNoDataIcon();
  }