/**
 * @fileoverview This demo is used for MarkerClusterer. It will show 100 markers
 * using MarkerClusterer and count the time to show the difference between using
 * MarkerClusterer and without MarkerClusterer.
 * @author Xiaoxi Wu
 */
// display the loading message
(function() {
   var map = null;
   var stores = null;
   var markerClusterer = null;
   var markers = [];      
   var om = null;
   



   function $(element) {
     return document.getElementById(element);
   }

   var AMC = {
     init: function() {
      if(GBrowserIsCompatible()) {
      om = new OverlayMessage(document.getElementById('map'));      
      om.Set('<b>Loading...<\/b>');

         map = new GMap2($('map'));
		 // Baulkham Hills
         //map.setCenter(new GLatLng(-33.73833, 151.001244), 9);
		 // Newcastle
          map.setCenter(new GLatLng(-32.926357, 151.78122), 9);
		 
		 map.addControl(new GLargeMapControl());
         stores = data.store;
         showMarkers(true);
       }
     },
     showMarkers: function(isInit) {
       showMarkers(isInit);
     },
     changeType: function() {
       //$("tcounts").innerHTML = "cleaning...";
       setTimeout("AMC.showMarkers()", 0);
     },
     changeNums: function() {
       //$("tcounts").innerHTML = "cleaning...";
       $('markerlist').innerHTML = "";
       setTimeout("AMC.showMarkers(true)", 0);
     },
     timing: function() {
       //var start = new Date();
       //if ($("usegmm").checked) {
         markerClusterer = new MarkerClusterer(map, markers);
       om.Clear(); // Clear the loading message
       /*} else {
         for (var i = 0; i < markers.length; i++) {
           map.addOverlay(markers[i]);
         }
       }*/
       /*var end = new Date();
       $("tcounts").innerHTML = end - start;*/
     }
   };

	function showMarkers(init) {
		map.clearOverlays();
		markers = [];
		var iconRail = new GIcon(G_DEFAULT_ICON);
		iconRail.image = "http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,ff0000,000000&ext=.png";
		//iconRail.iconSize = new GSize(12, 20);
		//iconRail.iconAnchor = new GPoint(6, 20);
		iconRail.infoWindowAnchor = new GPoint(5, 1);      

		iconTransit = new GIcon(iconRail,"http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,C893D9,000000&ext=.png"); 
		iconFerry = new GIcon(iconRail,"http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,00ff00,000000&ext=.png"); 
		iconReseller = new GIcon(iconRail,"http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,D7C414,000000&ext=.png");	 
	 
	 
	 
/*     var type = 1;

     if($("usegmm").checked) {
       type = 0;
     }
*/
     if(markerClusterer != null) {
       markerClusterer.clearMarkers();
     }

     var panel = document.getElementById('markerlist');
	 
     for (var i = 0; i < stores.length; i++) {
       /*var title = stores[i].photo_title;
       if (title == "") {
         title = "No title";
       }
       if (init) {
         var item = document.createElement("div");
         var tit = document.createElement("div");
         tit.innerHTML = stores[i].name;
         item.style.cssText = 'padding:2px 0;width:265px;border-bottom:1px solid #E0ECFF;cursor:pointer;overflow:hidden; ';
         panel.appendChild(item);
         item.appendChild(tit);
         GEvent.addDomListener(item, "mouseover", function() {
                                 this.style.backgroundColor = "#E0ECFF";
                               });
         GEvent.addDomListener(item, "mouseout", function() {
                                 this.style.backgroundColor = "white";
                               });
       }*/
	   var icon = null;
	   switch (stores[i].channel) {
		   case 'Ferry Wharves':
		   	icon = iconFerry;
		   	break;
			/*case 'Transit Shop':
		   	icon = iconTransit;
			break;*/
			case 'Rail Stations':
		   	icon = iconRail;
			break;
			default:
		   	icon = iconReseller;
			break;
	   }
       var latlng = new GLatLng(stores[i].lat, stores[i].long);
       var marker = new GMarker(latlng, {icon: icon});
       var fn = markerClickFn(stores[i], latlng);
       GEvent.addListener(marker, "click", fn);
	   
       /*if (init) {
         GEvent.addDomListener(tit, "click", fn);
       }*/
       markers.push(marker);
     }       
     //$("tcounts").innerHTML = "timing...";
     setTimeout("AMC.timing()", 0);
	 }

   function markerClickFn(store, latlng) {
     return function() {
		 var name = store.name;
		 var html = store.code;
       /*var title = pic.photo_title;
       var url = pic.photo_url;
       var fileurl = pic.photo_file_url;
       var infoHtml = '<div style="width:210px;"><h3>' + title
         + '</h3><div style="width:200px;height:200px;line-height:200px;margin:2px 0;text-align:center;">'
         + '<a id="infoimg" href="' + url + '" target="_blank">Loading...</a></div>'
         + '<a href="http://www.panoramio.com/" target="_blank">'
         + '<img src="http://maps.google.com/intl/en_ALL/mapfiles/iw_panoramio.png"></img></a><br/>'
         + '<a href="' + pic.owner_url + '" target="_blank">' + pic.owner_name + '</a>';
       var img = document.createElement("img");
       GEvent.addDomListener(img, "load", function() {
                               if ($("infoimg") == null) {
                                 return;
                               }
                               img = adjustImage(img, 200, 200);
                               img.style.cssText = "vertical-align:middle;padding:1px;border:1px solid #EAEAEA;";
                               $("infoimg").innerHTML = "";
                               $("infoimg").appendChild(img);
                             });
       img.src = fileurl;
       if(img.readyState == "complete" || img.readyState == "loaded") {
         img = adjustImage(img, 280, 200);
         infoHtml += '<img width=' + img.width + ' height=' + img.height
           + ' style="vertical-align:middle;padding:1px;border:1px solid #aAaAaA"></img>';
       }*/
	   var infoHtml = '<b>' + name + '</b><br />' + html;
       map.openInfoWindowHtml(latlng, infoHtml);
     };
	 
   }
   
   /*function adjustImage(img, maxwidth, maxheight) {
     var wid = img.width;
     var hei = img.height;
     var newwid = wid;
     var newhei = hei;
     if(wid / maxwidth > hei / maxheight){
       if(wid > maxwidth){
         newwid = maxwidth;
         newhei = parseInt(hei * newwid / wid);
       }
     } else {
       if(hei > maxheight) {
         newhei = maxheight;
         newwid = parseInt(wid * newhei / hei);
       }
     }
     var src = img.src;
     img = document.createElement("img");
     img.src = src;
     img.width = newwid;
     img.height = newhei;
     return img;
   }*/
   window.AMC = AMC || window.AMC;
 })();

window.onload=AMC.init;
window.onunload=GUnload;