var icons;
var map;
initLoader();

function mapsLoaded() {
	map = new google.maps.Map2(document.getElementById("map"));
	map.addMapType(G_PHYSICAL_MAP);
	map.setMapType(G_PHYSICAL_MAP);
	var zoom = 4;
	var center = new google.maps.LatLng(49.236249, 18.584798);
	// Mittelpunkt bestimmen, wenn per URL übergeben
	if (location.search)
	{
		var lat, lng, zoomfactor;
		var ele = location.search.substr(1).split('&');
		for (i=0; i<ele.length; i++)
		{
			var str = ele[i].split("=");
			for (j=0; j<str.length; j++)
			{
				if (str[j] == 'lat') lat = str[j+1];
				if (str[j] == 'lng') lng = str[j+1];
				if (str[j] == 'zoom') {
					zoomfactor = str[j+1];
					
				}
			}
		}
		if (lat && lng)
		{
			center = new google.maps.LatLng(lat, lng);
		}
		if(zoomfactor) {
			zoom = parseFloat(zoomfactor);
		}
		
	}
	map.setCenter(center, zoom);
	

	var baseIcon = new GIcon();
	baseIcon.iconSize = new GSize(34, 34);
	baseIcon.iconAnchor = new GPoint(17, 34);
	baseIcon.infoWindowAnchor = new GPoint(34, 2);

	var nlIcon = new GIcon(baseIcon);
	nlIcon.image = '/we_images/icon/google_marker_nl.png';
	nlIcon.iconSize = new GSize(65, 59);
	nlIcon.iconAnchor = new GPoint(34, 59);
	var avIcon = new GIcon(baseIcon);
	avIcon.image = '/we_images/icon/google_marker_av.png';
	var aIcon = new GIcon(baseIcon);
	aIcon.image = '/we_images/icon/google_marker_a.png';
	var vIcon = new GIcon(baseIcon);
	vIcon.image = '/we_images/icon/google_marker_v.png';

	icons = {"nl":nlIcon,"av":avIcon,"a":aIcon,"v":vIcon};


	function HWCategoryControl(overlay) {
		this.overlay = overlay;
	}
	HWCategoryControl.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.
	HWCategoryControl.prototype.initialize = function(map) {
		var container = document.createElement("div");
		var containerClass = document.createAttribute("class");
		containerClass.nodeValue = "pa pb20";
		container.setAttributeNode(containerClass);

		container.appendChild(createButton("all", "oc100", "Alle anzeigen"));
		container.appendChild(createButton("nl", "oc66", "Niederlassungen"));
		container.appendChild(createButton("a", "oc66", "Modulare Spannsysteme"));
		container.appendChild(createButton("v", "oc66", "Vakuum Spanntechnik"));

		map.getContainer().appendChild(container);
		return container;
	}

	HWCategoryControl.prototype.getDefaultPosition = function() {
		return new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(7, 7));
	}

	map.addControl(new GHierarchicalMapTypeControl());
	map.addControl(new GLargeMapControl());
	map.addControl(new HWCategoryControl());

	for (var i=0; i<partners.length; i++)
	{
		map.addOverlay(createPartnerHtmlMarker(partners[i]));
	}
}

function loadMaps() {
	google.load("maps", "2.x", {"callback" : mapsLoaded});
}

function initLoader() {
	var script = document.createElement("script");
	script.src = "http://www.google.com/jsapi?key=ABQIAAAAJl8r4JrcAvfECvE-cdRWPxTnMIw7L2r5HDKlkae3kbjHW0f7WRTlIsXXVx6PF_-McWt747DljW3-IQ&callback=loadMaps";
	script.type = "text/javascript";
	document.getElementsByTagName("head")[0].appendChild(script);
}

/**
 * Erstellt einen Marker mit HTML Fenster
 */
function createPartnerHtmlMarker(p)
{
	// Icon bestimmen
	if (p.category.indexOf('nl') != -1) c = 'nl';
	else if (p.category.indexOf('a') != -1 && p.category.indexOf('v') != -1) c = 'av';
	else if (p.category.indexOf('a') != -1) c = 'a';
	else if (p.category.indexOf('v') != -1) c = 'v';
	// (END) Icon

	var markerOptions = { icon:icons[c], title:p.company };
	var marker = new GMarker(new GLatLng(p.lat, p.lng), markerOptions);
	marker.bindInfoWindowHtml(createHtmlMarkerContent(p), {"maxWidth":250});

	// MarkerGroup zuweisen
	if (c == 'av')
	{
		markerGroups['a'].push(marker);
		markerGroups['v'].push(marker);
	}
	else
	{
		markerGroups[c].push(marker);
	}
	// (END) MarkerGroup

	return marker;
}

/**
 * Setzt den Inhalt für den PartnerHTMLMarker zusammen
 */
function createHtmlMarkerContent(p)
{
	var html = '<h2>' + p.company + '</'+'h2>';
	if (p.img > 0)       html = html + '<img src="' + p.imgPath + '" alt="" border="0" />';
	if (p.focus != '')   html = html + '<p>' + p.focus + '</'+'p>';
	if (p.street != '') html = html + '<p>' + p.street + '<br />' + p.zip + ', ' + p.city + '</'+'p>';
	if (p.tel != '')     html = html + '<div><span class="tel"><span class="print">Tel: </'+'span>' + p.tel + '</'+'span></'+'div>';
	if (p.fax != '')     html = html + '<div><span class="fax"><span class="print">Fax: </'+'span>' + p.fax + '</'+'span></'+'div>';

	html = html + '<div><b class="links">';
	if (p.email != '') html = html + '<a href="mailto:' + p.email + '" class="mailto">' + p.email + '</'+'a>';
	html = html + '<a href="http://' + p.homepage + '" target="_blank">' + p.homepage + '</'+'a>';
	html = html + '</'+'b></'+'div>';
	return html;
}

/**
 * Erstellt einen neuen Button aus Vorgabewerten
 */
function createButton(id, css, text)
{
	// Elemente erstellen
	var holder = document.createElement("div");
	var spacer = document.createElement("div");
	var button = document.createElement("a");

	// HREF Attribut
	var href = document.createAttribute("href");
	href.nodeValue = "#";
	button.setAttributeNode(href);
	button.setAttribute("onclick", "return false;");

	// CLASS Attribut (CSS Klasse)
	var buttonClass = document.createAttribute("class");
	buttonClass.nodeValue = id + " " + css;
	button.setAttributeNode(buttonClass);

	// ID Attribut
	var buttonId = document.createAttribute("id");
	buttonId.nodeValue = 'gmap_button_cat_'+id;
	button.setAttributeNode(buttonId);

	// Beschriftung
	button.appendChild(document.createTextNode(text));

	// Abstands-Halter
	var spacerClass = document.createAttribute("class");
	spacerClass.nodeValue = "cb pt2";
	spacer.setAttributeNode(spacerClass);

	// Click-Event registrieren
	GEvent.addDomListener(button, "click", function() {
		clickButton(this);
	});

	// Alles zusammenfügen & zurückgeben
	holder.appendChild(button);
	holder.appendChild(spacer);
	return holder;
}

/**
 * Funktionen zum Ein-/Ausblenden der Marker-Kategorien
 */
// markerGroups nimmt die Marker der verschiedenen Kategorien auf
var markerGroups = {"nl":[], "a":[], "v":[]}
var group = new Array('nl','a','v');

// Wenn ein Button zum Umschalten der Kategorien geklickt wird
function clickButton(e) {
	var cat = e.id.split('_').pop();
	if (cat == 'all')
	{
		// Alle Kategorien durchlaufen und anzeigen lassen
		//  Parameter 2 (true) sorgt dafür...
		for (var i=0; i<group.length; i++)
		{
			showMarkers(group[i], true);
		}
	}
	else
	{
		showMarkers(cat);
	}

	buttonsOff();
	buttonOn(e);
}

// Alle Marker verstecken und die der übergebenen Kategorie anzeigen
// "hide" sollte nur bei Kategorie = "all" übergeben werden
function showMarkers(category, hide)
{
	// In der Standardeinstellung alle Marker verstecken
	if (!hide)
		{
		for (var i=0; i<group.length; i++)
		{
			for (var j=0; j<markerGroups[group[i]].length; j++)
			{
				 markerGroups[group[i]][j].hide();
			}
		}
	}
	// Marker der übergebenen Kategorie zeigen
	for (var i=0; i<markerGroups[category].length; i++)
	{
		markerGroups[category][i].show();
	}
}

// Button aktivieren
function buttonOn(e) {
	e.className = e.className.replace(/oc66/g, 'oc100');
}

// Button deaktivieren
function buttonOff(e) {
	e.className = e.className.replace(/oc100/g, 'oc66');
}

// Alle Buttons deaktivieren
function buttonsOff()
{
	buttonOff($('gmap_button_cat_all'));
	buttonOff($('gmap_button_cat_nl'));
	buttonOff($('gmap_button_cat_a'));
	buttonOff($('gmap_button_cat_v'));
}