$(window).load(function() {
	if (document.namespaces && !document.namespaces["v"]) {
		try{
			// vml for gmaps and other applications that might use vml
			document.namespaces.add('v', 'urn:schemas-microsoft-com:vml', "#default#VML");
			document.createStyleSheet().addRule("v\\:*", "behavior:url(#default#VML)");
		}catch(e){}
	}
});

$(document).ready(function() {
	Wpg.Webshop.init();
});

var Wpg = {

	version : '1.0',

	//example usage: onclick="Wpg.emptyFn();"
	emptyFn : function() {
	
	},
	
	/**
	 * Log error messages
	 */
	log : function(msg) {
		if(console) {
			console.error("%s: %o", msg, this);
		}
	},
	
	/**
	 * Replacement <a href="history.go(-1); return false;" /> with
	 * <a href="return Wpg.back();" />
	 */
	back : function() {
		history.go(-1);
		return false;
	},
	
	/**
	 * Preload an image or array of images
	 * Optional callback, when loading of all images is finished
	 */
	preloadImages : function(images, options, fnCallback) {
	
		var loadedImages = 0;
		var arrayImages = (typeof(images)==='string') ? [images] : images ;
		for (var i = arrayImages.length-1; i >= 0 ; i--) {
			$('<img/>').attr("src", arrayImages[i])
				.load(function(){
					loadedImages++;
					if (arrayImages.length == loadedImages) {
						if(fnCallback) fnCallback();
					}
				});
		}
	
		if(options.timeout){
			setTimeout(function(){
				if(arrayImages.length != loadedImages);
					if(fnCallback) fnCallback();
			}, options.timeout);
		}
	},
	
	/**
	 *  Refocuses page either by hash in location or by cookie set in a form.
	 */
	refocus : function() {
		var anchorId = document.location.hash;				//refocus upon page refresh
		var cookie = ($.cookie('wpg-refocus'));				//refocus upon pagination, using cookie

		anchorId = (anchorId == '' && cookie) ? cookie : anchorId;

		if (anchorId != '') {
			var el = $('a[href='+anchorId+']');				//find matching anchor
			el.click();										//trigger click to focus
		}
	},
	
	/**
	 * Submit value to a hidden form using GX Form Class and GX FormPart Class
	 * @param {String} formClass The classname using in the form
	 * @param {String} options classname/value couple used in the text formPart
	 * @return boolean
	 * 
	 * usage: Wpg.Webshop.jumpSearchResultsPage(pageNr)
	 */
	_submitToHiddenForm : function(formClass, options) {
		var formClass = formClass;
		var options = options;
		
		if($(formClass).length == 0) {
			Wpg.log("GX Form with class '"+formClass+"' does not exist");
			return false;
		}
		
		var frm = $(formClass).parents('form');
		
		if(options) {
			for(var name in options) {
				var fieldClassName = name;
				if (fieldClassName.charAt(0) != '.') {        //prepend . when not exists
					fieldClassName = "." + fieldClassName;
				}
				$(frm).find(fieldClassName + " input[type=text]").val(options[name]);
			}
	 	}
		
		$(frm).submit();
					
		return true;
	}
		
};

Wpg.Website = {

	/**
	 * Place item in shopping cart and goto big shopping cart directly
	 * usage: Wpg.Webshop.order()
	 */
	orderBookDirect: function(eanCode) {
		Wpg._submitToHiddenForm('.product-add-direct', {ean:eanCode});
		return false;
	},
	
	/**
	 * Place item in shopping cart and goto big shopping cart directly
	 * usage: Wpg.Webshop.order()
	 */
	orderBook: function(eanCode) {
		Wpg._submitToHiddenForm('.product-add', {ean:eanCode});
		return false;
	},
	
	/**
	 * Sends new pageNumber to a hidden form so the new search results can be obtained
	 * usage: Wpg.Webshop.order()
	 */
	changeSitesearchPage: function(pageNumberValue) {
		Wpg._submitToHiddenForm('.changeSiteSearch', {pageNumber:pageNumberValue});
		return false;
	},
	
	Voting : {
		submitRating : function(mediaItemVersionId,optionId){
			document.getElementById('vote'+mediaItemVersionId).value = optionId;
			document.getElementById('votingform'+mediaItemVersionId).submit();
			return false;
		}
	}
	
};

Wpg.Webshop = {
	
	init : function() {
		var el = $('body.webshop');
		
		//execute only on webshop pages
		if(el.length > 0) {
			//add class .wait to body on ajax calls
			el.ajaxStart(function(){ el.addClass('wait'); });
			el.ajaxComplete(function(){ el.removeClass('wait'); });
			
			Wpg.refocus();
		}
		
	},
	
	toggleSearchResults : function(el) {
		function toggleContainerClass(){
			$('.search-results-container').toggleClass('all');
		}

		var clickedItem = $(el).parent('li');
		if($(clickedItem).hasClass('active') == false){
			$(clickedItem).parent('ul').children().toggleClass('active');;
			toggleContainerClass();
		}
	},

	_updateShoppingCartMini : function(html) {
		var elCart = $('body.webshop #related-content .shopping-cart.mini');
		(elCart.length > 0) ?
			elCart.replaceWith(html) :
			$('body.webshop #related-content').prepend(html);
	},
	
	_updateShoppingCartSmall : function(html) {
		var elCart = $('body.webshop #related-content .shopping-cart.small');
		(elCart.length > 0) ?
			elCart.replaceWith(html) :
			$('body.webshop #related-content').prepend(html);
	},
	
	_updateShoppingCartLarge : function(html) {
		var elCart = $('body.webshop #main-content .shopping-cart.large');
		if (elCart.length > 0)
			elCart.replaceWith(html);
	},
	
	//update mini, small and large cart
	_updateShoppingCarts : function(options) {
		var urlCartMini  = options.minicart;
		var urlCartSmall = options.smallcart;
		var urlCartLarge = options.largecart;
		
		if(urlCartLarge){
			$.get(urlCartLarge, function(html){
				Wpg.Webshop._updateShoppingCartLarge(html);
			});
		}

		if($('body.webshop #related-content .shopping-cart.small').length > 0) {
			if(urlCartSmall){
				$.get(urlCartSmall, function(html){
					Wpg.Webshop._updateShoppingCartSmall(html);
				});
			}
		}
		
		if($('body.webshop #related-content .shopping-cart.mini').length > 0) {
			if(urlCartMini){
				$.get(urlCartMini, function(html){
					Wpg.Webshop._updateShoppingCartMini(html);
				});
			}
		}
	
	},
	
	/**
	 * Adds book to shoppingcart
	 * @param {String} eanCode The EAN code
	 * @param {String} url The url to submit to and which returns html fragmants of the product
	 * @return void
	 * 
	 * usage: Wpg.Webshop.add({eanCode)
	 */
	add : function(eanCode, url, options) {
		$.get(url, {ean:eanCode}, function(){
			Wpg.Webshop._updateShoppingCarts(options);
		});
	},
	
	/**
	 * Update book in shoppingcart
	 * @param {String} itemNumber The item number of the book in the shoppingcart
	 * @param {Number} amount The amount of books to update to
	 * @return void
	 * 
	 * usage: Wpg.Webshop.update(itemNumber, amount, url)
	 */
	update : function(itemNumber, amount, url, options) {
		$.get(url, {item:itemNumber, aantal:amount}, function(){
			Wpg.Webshop._updateShoppingCarts(options);
		});
	},
	
	/**
	 * Remove book in shoppingcart
	 * @param {String} itemNumber The item number of the book in the shoppingcart
	 * @return void
	 * 
	 * usage: Wpg.Webshop.remove(itemNumber)
	 */
	remove : function(itemNumber, url, options) {
		$.get(url, {item:itemNumber}, function(){
			Wpg.Webshop._updateShoppingCarts(options);
		});
	},
	
	/**
	 * Place item in shopping cart and goto big shopping cart directly
	 * usage: Wpg.Webshop.order()
	 */
	orderDirect: function(eanCode) {
		Wpg._submitToHiddenForm('.product-add-direct', {ean:eanCode});
		return false;
	},
	
	/**
	 * Goto big shopping cart
	 * usage: Wpg.Webshop.order()
	 */
	order : function(){
		Wpg._submitToHiddenForm('.goto-shoppingcart');
	},
	
	goReserve : function(eanCode, options){
		//store cookie to detect and goto achor #afhalen
		var COOKIE_NAME = 'GOTOMAPS';
		var opt = {path:'/', expires:1};
		$.cookie(COOKIE_NAME, 'true', opt);
		
		//jump to book detail page
		if(options && options.all == true) {
			Wpg.Webshop.searchAll(eanCode);
		} else {
			Wpg.Webshop.search(eanCode);
		}
		return false;
	},
	
	goReserveMenu : function(eanCode, options){
		//store cookie to detect and goto achor #afhalen
		var COOKIE_NAME = 'GOTOMAPS';
		var opt = {path:'/', expires:1};
		$.cookie(COOKIE_NAME, 'true', opt);
		
		Wpg.Webshop.searchMenu(eanCode);
		return false;
	},
	
	goReserveAll : function(eanCode){
		Wpg.Webshop.goReserve(eanCode, {all:true});
	},
	
	reserve: function(eanCode, storeId) {
		Wpg._submitToHiddenForm('.product-reserve', {ean:eanCode, storeid:storeId});
		return false;
	},
	
	/**
	 * Goto payment page
	 * usage: Wpg.Webshop.pay()
	 */
	pay : function(){
		Wpg._submitToHiddenForm('.goto-payment');
	},
	
	/**
	 * Jump to another page of searchresults
	 * @param {Number} itemNumber The item number of the book in the shoppingcart
	 * @return false
	 * 
	 * usage: Wpg.Webshop.jumpSearchResultsPage(pageNr)
	 */
	jumpSearchResultsPage : function(pageNr) {
		Wpg._submitToHiddenForm('.searchChangePage', {pageNumber:pageNr});
		return false;
	},
	
	jumpSearchResultsPageAll : function(pageNr) {
		Wpg._submitToHiddenForm('.searchChangePageAll', {pageNumberAll:pageNr});
		return false;
	},
	
	jumpSearchResultsMenuPage : function(pageNr) {
		Wpg._submitToHiddenForm('.searchChangePageMenu', {pageNumber:pageNr});
		return false;
	},

	search : function(refNr) {
		Wpg._submitToHiddenForm('.retrieve-product', {ean:refNr});
		return false;
	},
	
	searchAll : function(refNr) {
		Wpg._submitToHiddenForm('.retrieve-product-all', {ean:refNr});
		return false;
	},
	
	searchMenu : function(refNr) {
		Wpg._submitToHiddenForm('.retrieve-product-menu', {ean:refNr});
		return false;
	},
	
	/**
	 * usage: Wpg.Webshop.changeOrderDelivery(v)
	 */
	changeOrderDelivery : function(action){
		Wpg._submitToHiddenForm('.change-order-delivery', {action:action});
		return false;
	},
	
	
	/**
	 * Removes the delivery address
	 * @param {String} itemNumber The item number of the book in the shoppingcart
	 * @return void
	 * 
	 * usage: Wpg.Webshop.remove(itemNumber)
	 */
	removeOrderDelivery : function(url) {
		$.get(url, function(html){
			var el = $('body.webshop #main-content .customer-info-short .delivery-address');
			if (el.length > 0)
				el.replaceWith(html);
		});
		return false;
	},
	
	/**
	 * usage: Wpg.Webshop.changeOrderInvoice(v)
	 */
	changeOrderInvoice : function(action){
		Wpg._submitToHiddenForm('.change-order-invoice', {action:action});
		return false;
	},
	
	/**
	 * usage Wpg.Webshop.parametricSearchHomepage(v)
	 */
	parametricSearchHomepage : function(parametric){
		Wpg._submitToHiddenForm('.parametric-search-homepage', {'search-string':parametric});
		return false;
	},
	
	/**
	 * usage Wpg.Webshop.parametricMenu(contentid, id)
	 */
	parametricMenu : function(contentId, id){
		Wpg._submitToHiddenForm('.parametric-search-menu', {'contentid':contentId, 'id':id});
		return false;
	},
	
	/**
	 * modified version of parametricMenu();
	 * usage Wpg.Webshop.parametricMenu2(contentid, id)
	 */
	parametricMenu2 : function(itemId){
		Wpg._submitToHiddenForm('.parametric-search-menu2', {'itemid':itemId});
		return false;
	}	
	
};

Wpg.Webshop.Gmaps = function(){
	var stores = [];		/* stores with know stock */
	var storesOther = [];	/* stores with unknow stock */
	var map;
	var mgr;
	var shownStores = {}	/* buffered stores, so it won't show again on maps */

	var baseIcon, availableIcon, notAvailableIcon, otherIcon;
	
	function createIcons() {
		// Create a base icon for all of our markers that specifies the
		// shadow, icon dimensions, etc.
		baseIcon = new GIcon(G_DEFAULT_ICON);
		// Icon indicating available
		availableIcon = new GIcon(baseIcon);
		availableIcon.image = "/static/project/global/img/maps/marker-available.png";
		// Icon indicating not available
		notAvailableIcon = new GIcon(baseIcon);
		notAvailableIcon.image = "/static/project/global/img/maps/marker-notavailable.png";
		// Icon indicating not affiliated with WPG
		otherIcon = new GIcon();
		otherIcon.image = "/static/project/global/img/maps/marker-others.png";
		otherIcon.shadow = "/static/project/global/img/maps/marker-others.png";
		otherIcon.iconSize = new GSize(10, 10);
		otherIcon.shadowSize = new GSize(10, 10);
		otherIcon.iconAnchor = new GPoint(0, 4);
		otherIcon.infoWindowAnchor = new GPoint(0, 4);

	}

	// Creates a marker	whose info window displays store info
	function createMarker(point, store)	{

		var icon = (store.available >= 1) ? availableIcon : (store.available == 0 ) ? notAvailableIcon : otherIcon;

		var markerOptions	= {
			title :	store.name,
			icon : icon
		};
		
		var marker = new GMarker(point, markerOptions);
		
		var ballonHtml =	"<div class='vcard'>" +
								"<strong class='fn org url'>"+store.name+"</strong><br />"+
								"<span class='adr'>" +
									"<span class='street-address'>"+store.address+"</span><br />"+
									"<span class='postal-code'>"+store.zipcode+"</span>&nbsp;"+
									"<span class='locality'>"+store.city+"</span><br />";
								
									if(store.picture && store.picture != '') ballonHtml += "<img class='photo' src='"+store.picture+"' alt='Foto van winkel "+store.name+"' width='200' height='150'/ ><br />";
									if(store.website && store.website != '') ballonHtml += "<a class='url' title='"+store.website+"' href='"+store.website+"'>website</a>&nbsp;";
									if(store.email && store.email != '')     ballonHtml += "<a class='email' title='"+store.email+"' href='mailto:"+store.email+"'>e-mail</a>";
									if(store.phone && store.phone != '')     ballonHtml += "<br /><span class='tel'><span class='type'>tel:&nbsp;</span>"+store.phone+"</span><br />";
								ballonHtml += "</span>"
						
		if(store.storeid && store.ean && store.available && store.available >= 1) {
			ballonHtml +=	"<br /><button class='reserve' onclick=\"return Wpg.Webshop.reserve(" + store.ean + "," + store.storeid + ")\"><span>Reserveer</span></button><br />";
		}

		ballonHtml +=	"<br /><br /><br /></div>";

		GEvent.addListener(marker, "click", function() {
			marker.openInfoWindowHtml(ballonHtml);
			map.savePosition();
		});
		
		//returnToSavedPosition after close
		GEvent.addListener(marker, "infowindowclose", function() {
			map.returnToSavedPosition();
		});

		return marker;
	}

	// Adds markers to the map
	function addMarkers(options) {
		//?options.showAvailable: true|false
		//?options.showNotAvailable: true|false
		//?options.showOther: true|false
		
		var markers = []; 

		function bufferMarkers(arrayStores){
			var stores = arrayStores;
			var storeCount = stores.length;

			for	(var i = storeCount-1; i >= 0; i--)	{
				if (!shownStores[stores[i].storeid]) {
					var	marker;
					var	point =	new	GLatLng(stores[i].lat, stores[i].lng);
					marker = createMarker(point, stores[i]);

					if(!options) {
						markers.push(marker); //show all stores
					}else{
						if(options.showAvailable && options.showAvailable === true) {
							if(stores[i].available >= 1) markers.push(marker); //push when book is available
						}
						if(options.showNotAvailable && options.showNotAvailable === true) {
							if(stores[i].available == 0) markers.push(marker); //push when book is not available
						}
						if(options.showOther && options.showOther === true) {
							if(stores[i].available <= -1) markers.push(marker); //push when book from not affiliated stores
						}
					}
					shownStores[stores[i].storeid] = stores[i].storeid;		/*cache storeid*/
				}
			}
		}
		
		if (stores && stores.length > 1 && (options.showAvailable || options.showNotAvailable)) {
			bufferMarkers(stores);
		}
		
		if (storesOther && storesOther.length > 1 && (options.showOther)) {
			bufferMarkers(storesOther);
		}
		
//		Wpg.log('found new markers: ' + markers.length);
		if(markers.length > 0) {
			mgr.addMarkers(markers, 8);
			mgr.refresh();
		}
//		Wpg.log('total markers: ' + mgr.getMarkerCount(8));
	}
	
	// Init tabs functionality
	function initTabs() {
		$('#stocks-gmaps-tabs li a').click(function(){
			toggleGmapsTabs($(this));
		});
	}
	
	function toggleGmapsTabs(el) {

		function toggleContainerClass(){
			$('.book-stocks').toggleClass('show-list');
		}

		var clickedItem = $(el).parent('li');
		if($(clickedItem).hasClass('active') == false){
			$(clickedItem).parent('ul').children().toggleClass('active');;
			toggleContainerClass();
		}
	}
	
	function getNonWpgStores(callback) {
		var zoom = map.getZoom();
		if(zoom < 11){
			//Wpg.log('zoome deeper to see other markers');
			return;
		}
	
		var ajaxUrl = Wpg.Webshop.Gmaps.BOOKSTOCKSOTHER_URL;
		
		var data = {swlat : map.getBounds().getSouthWest().lat(),
					nelat : map.getBounds().getNorthEast().lat(),
					swlng : map.getBounds().getSouthWest().lng(),
					nelng : map.getBounds().getNorthEast().lng()};
					
		$.getJSON(ajaxUrl, data, function(json) {
			storesOther = [];
			for(var i = json.length-1; i >= 0; i--){
				if (!shownStores[json[i].storeid]) {
					storesOther.push({
						storeid:  json[i].storeid,
						lat:      json[i].lat,
						lng:      json[i].lng,
						name:     json[i].name,
						address:  json[i].address,
						zipcode:  json[i].zipcode,
						city:     json[i].city,
						website:  json[i].website,
						email:    json[i].email,
						phone:    json[i].phone,
						available:-1
					});
				}
			}
			
			if(callback) callback();
		});
		
	}
	
	return {
		init : function(arrayWpgStores){
			if (GBrowserIsCompatible() && document.getElementById("map_canvas")) {
				stores = arrayWpgStores;

				map	= new GMap2(document.getElementById("map_canvas"));
				map.setCenter(new GLatLng(52.286897, 5.233743),	7);
				
				
				function _updateMarkers(){
					addMarkers({showAvailable:true, showOther:true});
				}
				
				GEvent.addListener(map, 'dragend', function(){
					getNonWpgStores(_updateMarkers);
				});
				GEvent.addListener(map, 'zoomend', function(oldzoom, newzoom){
					if(!newzoom >= 12) getNonWpgStores(_updateMarkers);
				});
				
				
				mgr = new MarkerManager(map); // Create a new instance of the MarkerManager 

				// Controls
				map.setUIToDefault();
				
				// Create icons
				createIcons();
				
				// Add markers of stores
				//addMarkers();
				
				// Attach events on tabs
				initTabs();
				
				// On window unload, clean unload Google API
				$(window).unload(function(){ GUnload(); });
				
				// If cookie 'GOTOMAPS' is set, jump to gmaps
				var COOKIE_NAME = 'GOTOMAPS';
				if($.cookie(COOKIE_NAME) == 'true'){
					Wpg.Webshop.Gmaps.scrollTo();                //scrollTo #book-stocks
					$.cookie(COOKIE_NAME, null, {path: "/"});    //delete cookie
				}

			}
		},
		
		showStoresAll : function(){
			addMarkers();
		},
		
		showStoresAvailable : function(){
			addMarkers({showAvailable:true});
		},
		
		showStoresAvailable_Other : function(){
			addMarkers({showAvailable:true});	//show normal markers first
			
			getNonWpgStores(function(){
				addMarkers({showAvailable:true, showOther:true});	//show others a little later
			});
		},
		
		locate : function(place, country) {
			var geocoder = new GClientGeocoder();
			var defaultZoom = 12; //city level
			var zoom = [defaultZoom, defaultZoom-4, defaultZoom-3, defaultZoom, defaultZoom+1, defaultZoom+2, defaultZoom+3, defaultZoom+4, defaultZoom+5, defaultZoom+6];
			var address = (place!='') ? place+', '+country : country;
			
			geocoder.setViewport(map.getBounds());
			geocoder.getLocations(address, function(response){
				if (!response || response.Status.code != 200) {
					alert("Unable to locate '"+place+"' in "+country);
				} else {
					var place = response.Placemark[0];
					var point = new GLatLng(place.Point.coordinates[1],
											place.Point.coordinates[0]);
					var accuracy = place.AddressDetails.Accuracy;
					
					map.setCenter(point, zoom[accuracy]);
					
					Wpg.Webshop.Gmaps.showStoresAvailable_Other();
				}
			});
			
			return false;
		},
		
		scrollTo : function(){
			//document.location='#afhalen';
			$.scrollTo( '.book-stocks', 800 );
			return false;
		}
	}
}();

/**
 * @author sc
   @description adds tabs interaction on "Collection Element Tabs"
 * @example var WpgTab123 = new Wpg.Tabs();
            WpgTab123.init('elements-collection-tabs-123');
 * @return {}
 */
Wpg.Tabs = function() {
	var tabElement;
	
	function detectEmptyTabContent() {
		$(tabElement).find('.tabs-content>ul>li>fieldset').each(function(){
			// get tab content without legend
			var tabContent = $(this).html().replace(/<legend>.+<\/legend>/, '');
			// when it contains nothing...
			if (tabContent.match(/^\s*$/)) {
				// get tab index
				var position = ($(this).parent().attr('class')).split(' ')[0].replace('tab-content-','');
				// add class=empty on navigation and content
				$(tabElement).find('.tabs-navigation>ul>li').eq(position-1).addClass('empty');
				$(tabElement).find('.tabs-content>ul>li').eq(position-1).addClass('empty');
			}
		});
	}
	
	function syncTabs(idx){
		$(tabElement).find('.tabs-navigation>ul>li').removeClass('current');
		$(tabElement).find('.tabs-navigation>ul>li').eq(idx-1).addClass('current');
	}
	
	function showTabContainer(idx){
		// hide all containers
		$(tabElement).find('.tabs-content>ul>li').addClass('hidden');
		//show container with idx...
		$(tabElement).find('.tabs-content>ul>li').eq(idx-1).removeClass('hidden');
		
		syncTabs(idx);
	}
	
	function handleTabClick() {
		// get tab index
		var tabPosition = ($(this).parent().attr('class')).split(' ')[0].replace('tab-','');
		showTabContainer(tabPosition);
	}
	return {
		init : function(elementId) {
			tabElement = $('#'+elementId);
			$(tabElement).find('.tabs-navigation a').click(handleTabClick);
			detectEmptyTabContent();
		}
	}
};