/*This file contains the JVC NZ site specific Java Scripts*/

		
		// Create a base icon for all of our markers that specifies the
		// shadow, icon dimensions, etc.
		var baseIcon = new GIcon(G_DEFAULT_ICON);
		baseIcon.shadow = "/maps/jvc_shadow.png";;
		baseIcon.iconSize = new GSize(35, 45);
		baseIcon.shadowSize = new GSize(58, 45);
		baseIcon.iconAnchor = new GPoint(14, 45);
		baseIcon.infoWindowAnchor = new GPoint(30, 2);
		baseIcon.imageMap = [0,0, 34,0, 34,44, 0,44];

		// Creates a marker whose info window displays Shop or Service Centre Specific details
		function createMarker(point, index, html) {
		  // create custom Icon
		  var customIcon = new GIcon(baseIcon);
		  customIcon.image = "/maps/jvc_marker.png";
		  customIcon.iconAnchor = new GPoint(14, 45);

		  // Set up our GMarkerOptions object
		  markerOptions = { icon:customIcon };
		  var marker = new GMarker(point, markerOptions);

		  //initialise the info window
		  GEvent.addListener(marker, "click", function() {
			marker.openInfoWindowHtml(html);
		  });
		  return marker;
		}

	  
	  //Initialize function for the service centre page - this will be calles upon page load
      function initializeService() {
		
		var clustered_markers = [];
		
        if(GBrowserIsCompatible()) {
 
			 var map = new GMap2(document.getElementById("map"));
			map.addControl(new GSmallMapControl());
			map.addControl(new GMapTypeControl());
			map.setCenter(new GLatLng(-41.095912,172.814941), 5);
			
			/*
			//load general marker data that includes all service centres
			GDownloadUrl("/maps/service/markerdata.xml", function(data, responseCode) {
			  var xml = GXml.parse(data);
			  var markers = xml.documentElement.getElementsByTagName("marker");
			  
			  //genereate the individual markers
			  for (var i = 0; i < markers.length; i++) {
				var name = markers[i].getAttribute("name");
				var address = markers[i].getAttribute("address");
				var phone = markers[i].getAttribute("phone");
				var type = markers[i].getAttribute("type");
				var type = type.replace(/\;/g, "\; ");
				var types = type.split("; ");
				
				//this formats the output of the serviced products section in the info window
				//in order to limit the width of the info window
				var new_type = "";
				var y = 0;
				for (var x = 0; x < types.length; x++) {
				
					var new_type = new_type + types[x] + "; ";
										
					if (y == 3){ 
						var new_type = new_type + "<br> ";
						var y = 0;
						}
					var y = y+1;
				}
					
				var store = {name: name, address: address, type: new_type, phone: phone};
				var html = "<b>" + store.name + "</b> <br/>" + store.address + "<br/>Ph:" + store.phone + "<br/><br/><b>Products Serviced:</b> <br/><font size=\"1px\">" + store.type + "</font>" ;			  
				  
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
										parseFloat(markers[i].getAttribute("lng")));
				
				//create the actual marker
				var marker = new createMarker(point, 6, html);
				//fill the array "clustered_markers" for the clustered marker function
				clustered_markers.push(marker);								
			  }
				
			//this initialises the clustered marker
			var mc = new MarkerClusterer(map, clustered_markers);			  
			  			  
			});		
*/			
		}
	}
	
	  //Initialize function for the service centre page - this will be calles upon page load
      function initializeShops() {
		
		var clustered_markers = [];
		
        if(GBrowserIsCompatible()) {
 
			 var map = new GMap2(document.getElementById("map"));
			map.addControl(new GSmallMapControl());
			map.addControl(new GMapTypeControl());
			map.setCenter(new GLatLng(-41.095912,172.814941), 5);
			
			//load general marker data that includes all service centres
			GDownloadUrl("/maps/shops/markerdata.xml", function(data, responseCode) {
			  var xml = GXml.parse(data);
			  var markers = xml.documentElement.getElementsByTagName("marker");
			  
			  //genereate the individual markers
			  for (var i = 0; i < markers.length; i++) {
				var name = markers[i].getAttribute("name");
				var address = markers[i].getAttribute("address");
				var city = markers[i].getAttribute("city");
				var postcode = markers[i].getAttribute("post_code");
				//var phone = markers[i].getAttribute("phone");
				//var type = markers[i].getAttribute("type");
				//var type = type.replace(/\;/g, "\; ");
				//var types = type.split("; ");
				
				//this formats the output of the serviced products section in the info window
				//in order to limit the width of the info window
				/*var new_type = "";
				var y = 0;
				for (var x = 0; x < types.length; x++) {
				
					var new_type = new_type + types[x] + "; ";
										
					if (y == 3){ 
						var new_type = new_type + "<br> ";
						var y = 0;
						}
					var y = y+1;
				}*/
					
				//var store = {name: name, address: address, type: new_type, phone: phone};
				var store = {name: name, address: address};
				//var html = "<b>" + store.name + "</b> <br/>" + store.address + "<br/>Ph:" + store.phone + "<br/><br/><b>Products Serviced:</b> <br/><font size=\"1px\">" + store.type + "</font>" ;			  
				var html = "<b>" + store.name + "</b> <br/>" + store.address + "<br/></font>" ;			  
				  
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
										parseFloat(markers[i].getAttribute("lng")));
				
				//create the actual marker
				var marker = new createMarker(point, 6, html);
				//fill the array "clustered_markers" for the clustered marker function
				clustered_markers.push(marker);								
			  }
				
			//this initialises the clustered marker
			var mc = new MarkerClusterer(map, clustered_markers);			  
			  			  
			});
			
		}
	}	
		
	  //this function loads the data for the individual service / shop 
	  //category and displays the markers on the map - this is called upon category selection
	  function showServiceCenter(category) {
	  
		var clustered_markers = [];
		
		//category will only be set if either "Video" or "Car Audio" is selected from the links at the top
		if (!category) {
			category = get_radio_value();
		}
		
		//load corresponding xml file
		var marker_filename = "/maps/service/markerdata_" + category + ".xml";
				
		if(GBrowserIsCompatible()) {
		 
			 var map = new GMap2(document.getElementById("map"));
			map.addControl(new GSmallMapControl());
			map.addControl(new GMapTypeControl());
			
			//if any other category than "Video" or "Car Audio" is selected the 
			//zoom level should be rougher
			if (category > 2) { 
				map.setCenter(new GLatLng(-41.095912,172.814941), 5);
			}
						
			GDownloadUrl(marker_filename, function(data, responseCode) {
			  var xml = GXml.parse(data);
			  var markers = xml.documentElement.getElementsByTagName("marker");
			  
			  //genereate the individual markers
			  for (var i = 0; i < markers.length; i++) {
				var name = markers[i].getAttribute("name");
				var address = markers[i].getAttribute("address");
				var phone = markers[i].getAttribute("phone");
				//var type = markers[i].getAttribute("type");
				//var type = type.replace(/\;/g, "\; ");
				//var types = type.split("; ");
				
				//this formats the output of the serviced products section in the info window
				//in order to limit the width of the info window
				//var new_type = "";
				//var y = 0;
				//for (var x = 0; x < types.length; x++) {
				
				//	var new_type = new_type + types[x] + "; ";
										
				//	if (y == 3){ 
				//		var new_type = new_type + "<br> ";
				//		var y = 0;
				//		}
				//	var y = y+1;
				//}
					
				var store = {name: name, address: address, phone: phone};
				var html = "<b>" + store.name + "</b> <br/>" + store.address + "<br/>Ph:" + store.phone //+ "<br/><br/><b>Products Serviced:</b> <br/><font size=\"1px\">" + store.type + "</font>" 
				;			  
				  
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
										parseFloat(markers[i].getAttribute("lng")));
				
				//if  "Video" or "Car Audio" is selected the 
				//zoom level should be finer
				if (category <= 2) { 
					map.setCenter(new GLatLng(parseFloat(markers[i].getAttribute("lat")),parseFloat(markers[i].getAttribute("lng"))), 10);
				}				
				
				//create the actual marker
				var marker = new createMarker(point, 6, html);
				//fill the array "clustered_markers" for the clustered marker function
				clustered_markers.push(marker);									
			  }
			  //this initialises the clustered marker
			  var mc = new MarkerClusterer(map, clustered_markers);
			  
			});
		}
		
		setActiveTab(category);
	}
	
	
	  //this function loads the data for the individual service / shop 
	  //category and displays the markers on the map - this is called upon category selection
	  function showShops(category) {
	  
		var clustered_markers = [];
		//var category = get_radio_value();
		
		//category will only be set if either "Video" or "Car Audio" is selected from the links at the top
//		if (!category) {
//			category = get_radio_value();
//		}
		
		//load corresponding xml file
		var marker_filename = "/maps/shops/markerdata_" + category + ".xml";
				
		if(GBrowserIsCompatible()) {
		 
			 var map = new GMap2(document.getElementById("map"));
			map.addControl(new GSmallMapControl());
			map.addControl(new GMapTypeControl());
			
			//if any other category than "Video" or "Car Audio" is selected the 
			//zoom level should be rougher
			//if (category > 2) { 
				map.setCenter(new GLatLng(-41.095912,172.814941), 6);
			//}
						
			GDownloadUrl(marker_filename, function(data, responseCode) {
			  var xml = GXml.parse(data);
			  var markers = xml.documentElement.getElementsByTagName("marker");
			  
			  //genereate the individual markers
			  for (var i = 0; i < markers.length; i++) {
				var name = markers[i].getAttribute("name");
				var address = markers[i].getAttribute("address");
				var city = markers[i].getAttribute("city");
				var postcode = markers[i].getAttribute("post_code");
				//var phone = markers[i].getAttribute("phone");
				//var type = markers[i].getAttribute("type");
				//var type = type.replace(/\;/g, "\; ");
				//var types = type.split("; ");
				
				//this formats the output of the serviced products section in the info window
				//in order to limit the width of the info window
				/*var new_type = "";
				var y = 0;
				for (var x = 0; x < types.length; x++) {
				
					var new_type = new_type + types[x] + "; ";
										
					if (y == 3){ 
						var new_type = new_type + "<br> ";
						var y = 0;
						}
					var y = y+1;
				}*/

				//get directions link to googel maps
				var directions = "http://maps.google.co.nz/maps?f=d&source=s_q&hl=en&geocode=&q=" + address + "+" + city + "+" + postcode + "&sll=" + parseFloat(markers[i].getAttribute("lat")) + "," + parseFloat(markers[i].getAttribute("lng")) + "&sspn=&ie=UTF8&hnear=" + address + ",+" + city + "+" + postcode + "&hq=&ll=" + parseFloat(markers[i].getAttribute("lat")) + "," + parseFloat(markers[i].getAttribute("lng")) + "&spn=&z=14&iwloc=A&daddr="+ address + ",+" + city + "+" + postcode
				//http://maps.google.co.nz/maps?f=d&source=s_q&hl=en&geocode=&q=355+Flaxton+Road+Rangiora&sll=-45.02578,168.688792&sspn=0.076073,0.124111&ie=UTF8&hq=&hnear=355+Flaxton+Rd,+Southbrook,+Rangiora+7400&ll=-43.321868,172.603111&spn=0.021855,0.056648&z=14&iwloc=A&daddr=355+Flaxton+Rd,+Southbrook,+Rangiora+7400
				
				//var store = {name: name, address: address, type: new_type, phone: phone};
				var store = {name: name, address: address, city: city, postcode: postcode};
				//var html = "<b>" + store.name + "</b> <br/>" + store.address + "<br/>Ph:" + store.phone + "<br/><br/><b>Products Serviced:</b> <br/><font size=\"1px\">" + store.type + "</font>" ;			  
				var html = "<b>" + store.name + "</b> <br/>" + store.address + "<br/>" + store.city + "&nbsp;" + store.postcode + "<br/><br/>" + "<a href=\"" + directions + "\" target=\"_blank\" >Get directions </a>";	
				
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
										parseFloat(markers[i].getAttribute("lng")));
				
				//if  "Video" or "Car Audio" is selected the 
				//zoom level should be finer
				//if (category <= 2) { 
				//	map.setCenter(new GLatLng(parseFloat(markers[i].getAttribute("lat")),parseFloat(markers[i].getAttribute("lng"))), 10);
				//}				
				
				//create the actual marker
				var marker = new createMarker(point, 6, html);
				//fill the array "clustered_markers" for the clustered marker function
				clustered_markers.push(marker);									
			  }
			  //this initialises the clustered marker
			  var mc = new MarkerClusterer(map, clustered_markers);
			  
			});
		}
	}	
		
	//this function extracts the category selected with the radio buttons
	function get_radio_value()
	{
		for (var i=0; i < document.select_category.catergory.length; i++)
		   {
		   if (document.select_category.catergory[i].checked)
			  {
			  var rad_val = document.select_category.catergory[i].value;
			  }
		   }
		   return rad_val;
	}

	
	function setActiveTab(tabID) {

		//first reset all class tags to standard
		for (var i=3; i <=7; i++){
			
			var currTabElem = document.getElementById(i);

			currTabElem.setAttribute("class", "top_link");
			currTabElem.setAttribute("className", "top_link");		
		}
				
		//then set only for the current the class id to "curren_link"
		var currTabElem = document.getElementById(tabID);

		currTabElem.setAttribute("class", "current_link");
		currTabElem.setAttribute("className", "current_link");

		return;
	}