/**
 * prod/detail
 * @autor:Christoph Gentsch
 * Ironshark Entertainment
 */

//Aktuelle Instanz (this) der ProdDetail-Klasse
var prodDetail_instance;

//Ist für die Produktdetailansicht zuständig
var ProdDetail = Class.create();

//Prototyp-Klasse
ProdDetail.prototype = 
{
	//Initialisierung
	initialize:function()
	{
		initMetaData();
		prodDetail_instance = this;
		//Loadergrafiken verstecken
		if($("loaderbig")!=null) $("loaderbig").hide();
		if($("mainImage")!=null) $("mainImage").show();

		//Produkt-ID auslesen
		this.prodId = $("prodId").value;

		//Hash anlegen für Produktattribute
		this.attr = new Hash();

		//Über jedes Produktdetailelement laufen
		$$(".detailSelect").each(function(item)
		{
			//Alle Produkteigenschaften ausser Stückzahl und Farb-Größe-SelectBox (wird extra verarbeitet) berücksichtigen
			if(( item.id!="amountSelect" ) && (item.id!="colorSizeBox")){
                            
				//REGEX zum auslesen der Produktattribute
				var regexp = /cart_add_variation_([0-9]*)/;
				
				//Attribute-ID lesen
				var attrId = parseInt( regexp.exec(item.name)[1] );

				//Attributwert lesen
				//var value = parseInt( item.value );
                var value = item.value;

				//Attributwert=-1 falls nicht numerisch
				if(isNaN(value) || value.length==0)
				{
					value = -1;
				}

				//Attribut in produktdetail-instanz aktualisieren wenn die Attribut-ID numerisch ist
				if(!isNaN(attrId)){
					prodDetail_instance.attr.set(attrId,value);
				}
			}
			//ProduktFarbe und Produktgröße lesen
			if(item.id=="colorSizeBox"){
				//Attribut-ID für Farbe
				var colorAttributeId=$('colorAttributeId').value;
				
				//Attribut-ID für Größe
				var sizeAttributeId=$('sizeAttributeId').value;

				//RegEx zum auslesen des Farbewertes (Zahl vor dem Trennzeichen[Unterstrich])
				var colorValueRegExp = /([0-9]*)_/;
				
				//RegEx zum auslesen des Größenwertes (Zahl nach dem Trennzeichen[Unterstrich])
				var sizeValueRegExp = /_([0-9]*)/;
				
				//Farbwert per Regex ermitteln
				var colorValue = parseInt( colorValueRegExp.exec(item.value)) || item.value; 

				//Größenwert per Regex ermitteln
				var sizeValue = sizeValueRegExp.exec(item.value);// || item.value;
				if(sizeValue) {
					sizeValue = parseInt(sizeValue[1]);
				}
				
				//Farbwert=-1 falls nicht numerisch oder 0
				if(isNaN(colorValue) || (0==colorValue) || null==colorValue)
				{
					colorValue = -1;
				}
				prodDetail_instance.attr.set(colorAttributeId,colorValue);
				
				//Größenwert=-1 falls nicht numerisch oder 0
				if(isNaN(sizeValue) || (0==sizeValue) || null==sizeValue)
				{
					sizeValue = -1;
				}
				prodDetail_instance.attr.set(sizeAttributeId,sizeValue);
			}
		});
		
		//"Magnifier" für die Vergrößerung initialisieren 
		var mags = [$("magnifier1"),$("magnifier2")];
		$A( mags ).each( function(item)
		{

			if(!item) return;

			//Regulären Ausdruck formulieren für Produktgalerielinks
			var regexp = /shop\/prod\/gallery\/([0-9]*)\/img\/([0-9]*)/;

			//Links für Galerieansicht per Regex auslesen
			var index = regexp.exec(item.href);
			
			if(!index) return;

			//Linkadresse für Betrieb ohne JS entfernen
			item.writeAttribute("href",null);
			item.addClassName("pointer");

			//Attribute setzen
			$(item).setAttribute('prod',index[1]);
			$(item).setAttribute('img',index[2]);

			//"OnClick-Observer"
			$(item).observe('click', function(event)
			{
				//-------------------------------------------------------------------------------------------
				//Workaround IE6 (Selectboxen müssen versteckt werden damit sie nicht durch overlay scheinen)
				$A( $$("select") ).each( function(item)
				{
					(item).hide();
				});
				//Workaround IE6 ENDE
				//-------------------------------------------------------------------------------------------
				
				$("ajaxLoader").hide();
				$$("div.overlay")[0].show();
				Effect.Appear( $("galleryDummy"), { duration: 0.3 } );

				//Ajax-Loader initialisieren
				new Ajax.Updater( 
					$("ajaxLoader"),
					Core.url(
						"shop/prodGallery/show/"
						+this.getAttribute("prod")
						+"/"+this.getAttribute("img")),
						{ method:'get', onComplete:function()
							{ prodGallery.init();}
						}
				);

				//Loadergrafikzeigen für die Dauer des ladens
				new PeriodicalExecuter(function(pe)
				{
					if ( prodGallery.ready )
					{
						prodGallery.ready = false;
						$("galleryDummy").hide();
						$("ajaxLoader").show();
					pe.stop();
					}
				}, 0.3);
			});
		});

		/**
		 * get all elements that will trigger the product detail view: <a href="..." do="openProductDetails" ...>
		 */
		var elements = $('globalWrapper').select('a[do="openProductDetails"]');

		//per schleife über die elemente laufen
		for(var i=0;i<elements.length;i++)
		{
			var item = elements[i];
			if(item)
			{
				var regexp = /shop\/prod\/details\/([0-9]*\/[0-9]*)/;
				var index = regexp.exec(item.href);

				//Links überschreiben für JS
				item.writeAttribute("href",null); 
				item.addClassName("pointer");

				//Onclick-Ereignisse behandeln (Produktdetailansicht zeigen)
				$(item).observe('click', function(event) {
					//-------------------------------------------------------------------------------------------
					//Workaround IE6 (Selectboxen müssen versteckt werden damit sie nicht durch overlay scheinen)
					$A( $$("select") ).each( function(item)
					{
						(item).hide();
					});
					//Workaround IE6 ENDE
					//-------------------------------------------------------------------------------------------

					//Loadergrafik verstecken und DIV-Overlay für Produktdetails anzeigen
					$("ajaxLoader").hide();
					$$("div.overlay")[0].show();
					Effect.Appear( $("detailDummy"), { duration: 0.3 } );
					
					//
					new Ajax.Updater
					( 
						$("ajaxLoader"), 
							Core.url("shop/prodDetail/show/"+index[1]), 
							{
								method:'get', onComplete:function()
								{	
									prodDetailView.init();
								}
							}
					);

					//Loadergrafik während das Ajax-Updatevorgangs anzeigen
					new PeriodicalExecuter(function(pe) {
						if ( prodDetailView.ready ) {
							prodDetailView.ready = false;
							$("detailDummy").hide();
							$("ajaxLoader").show();
						pe.stop();
						}
					}, 0.3);

				});
			}			

		//Auswahl der Produktfarbe
		$A( $$("#colorChooser a") ).each( function(item)
		{
			//regulärer Ausdruck zum parsen der Links
			var regexp = /shop\/prod\/([0-9]*)\/1\/([0-9]*)/;
			var index = regexp.exec(item.href);

			//Link für die Verwendung mit JS überschreiben
			item.writeAttribute("href",null); 
			item.addClassName("pointer");
			$(item).setAttribute('color',index[2]);

			//OnClick-Ereignisse behandeln
			$(item).observe('click', function(event) 
			{
				//Produktbild verstecken udn Loadergrafik zeigen
				$("mainImage").hide();
				$("loaderbig").show();

				//Neues Farbattribut setzen für die Instanz
				prodDetail.attr.set("1", this.getAttribute("color"));

				//Updater ausführen
				prodDetail.update();
			});
		});
		}
		//////////////////////////////////////////////

		//Produktdetailauswahl 
		$$("select.detailSelect").each(function(item)
		{
			//Alles ausser Auswahl für die Stückzahl,Farbe oder Größe
			
			if((item.id!="amountSelect")&&(item.id!="colorSizeBox"))
			{
				//Veränderungen überwachen
				$(item).observe('change', function(event)
				{
					//regulärer ausdruck für die Produkt-Attribute
					var regexp = /cart_add_variation_([0-9]*)/;

					//Attribut-ID ermitteln 
					attrId = parseInt( regexp.exec( this.name)[1] );

					//Attributwert ermitteln
					value = parseInt( this.value );
					
					//Handelt es sich nicht um einen Numerischen wert ?
					if(!isNaN(value))
					{
						//Produktattribut aktualisieren
						prodDetail.attr.set(attrId, value);
					}

					//Produktdetails aktualisieren
					prodDetail.update();
				});
			}
			//ProduktFarbe und Produktgröße lesen
			if(item.id=="colorSizeBox"){
				//Veränderungen überwachen
				$(item).observe('change', function(event)
				{

					//Attribut-ID für Farbe
					var colorAttributeId=$('colorAttributeId').value;
					var colorSizeBox=$('colorSizeBox');
					var selectedColor = colorSizeBox.options[colorSizeBox.selectedIndex].value;

					// Ampel ausblenden, wenn keine Farbe existiert
					if(selectedColor != "")
					{
					    $('ampel').style.display = 'block';
					}
					else
					{
					    $('ampel').style.display = 'none';
					}
					
					//Attribut-ID für Größe
					var sizeAttributeId=$('sizeAttributeId').value;
				
					//RegEx zum auslesen des Farbewertes (Zahl vor dem Trennzeichen[Unterstrich])
					var colorValueRegExp = /([0-9]*)_/;
				
					//RegEx zum auslesen des Größenwertes (Zahl nach dem Trennzeichen[Unterstrich])
					var sizeValueRegExp = /_([0-9]*)/;
				
					//Farbwert per Regex ermitteln
					var colorValue = parseInt( colorValueRegExp.exec(item.value)) || item.value;
					
					//Größenwert per Regex ermitteln
					var sizeValue = sizeValueRegExp.exec(item.value);
					if(sizeValue) {
						sizeValue=parseInt(sizeValue[1]);
					}else{
						sizeValue=0;
					}
				
					//Farbwert=-1 falls nicht numerisch oder 0
					if(isNaN(colorValue) || (0==colorValue))
					{
						colorValue = -1;
					}
					prodDetail_instance.attr.set(colorAttributeId,colorValue);
					//Größenwert=-1 falls nicht numerisch oder 0
					if(isNaN(sizeValue) || (0==sizeValue))
					{
						sizeValue = -1;
					}
					prodDetail_instance.attr.set(sizeAttributeId,sizeValue);
					//Produktdetails aktualisieren
					prodDetail.update();
				});
			}
		});

		//Verfügbarkeitsabhängige Anzeige des Bestellknopfes für den Warenkorb (submit-Button)
		if($("availability")==null || $("availability").value==1)
		{
			//Onlick-Ereignis für den Submit-Button überwachen,--> Produkt in den Warenkorb legen 
			$("mysubmit").observe('click', function(event)
			{
				if($("colorSizeBox").value == '')
				{
				    // wenn keine Variation gewählt ist, dann abbrechen und nichts machen
				    Event.stop(event);
				}
				else
				{
				    var e = event || window.event;
				    Event.stop(e);

				    //URL speichern
				    var url = Core.url("cart/add/"+prodDetail.prodId+"/");

				    //Stückzahl auslesen
				    var amount = parseInt( $("amountSelect").getValue() );

				    //Menge auf 1 setzen falls nicht angegeben
				    if(isNaN(amount))
				    {
					    amount=1;
				    }

				    //URL um Stückzahl erweitern
				    url += String(amount);

				    //URL um Produktatrribute erweitern

				    prodDetail.attr.each( function(item)
				    {
					    url += "/"+item[0]+"/"+item[1];
				    });
				    //Prüfen ob Daten übermittelt wurden
				    regexp = /-1/;
				    var erg = regexp.exec(url);
				    /*
				    //auskommentiert, da vorauswahl der attribute noch nicht funktional
				    if( erg!=null )
				    {
					    return;
				    }*/

				    //AJAX-Get-Request zum Übermitteln an den Warenkorb
				    new Ajax.Request(url, {method:'get', onSuccess:function(transport)
				    {
					    new Ajax.Updater( $$("div.moduleShopCart")[0], Core.url("cart/applet"), {method:'get'});
						
						
						
						//HTML-DIV für den Hinweistext einblenden
						if (!$("noticeArea").visible()) {
							//Rückmeldung ausgeben vom cartcontroller
							$("noticeArea").update(transport.responseText);
							Effect.BlindDown($("noticeArea"));
							
							//Effekt für kurzzeitiges Erscheinen des Hinweistextfeldes
							new PeriodicalExecuter(function(pe){
								Effect.BlindUp($("noticeArea"));
								pe.stop();
							}, 5);
						}
						
						if($('pDetail').value == 'true')
						{
							$('pOverlay').show();
							var content = $('pNotice').innerHTML;
							$('pNotice').innerHTML = '';
							$('pOverlay').innerHTML = content;
							
							$('closeOverlay').observe('click',function(evt)
							{
								evt.stop();
								$('pOverlay').hide();
							});
							
							
						}
					   
				    } });
				Effect.ScrollTo('globalWrapper',{duration:0.5});
			    }
			});
		}

		//Submitbutton für das Hinzufügen zum Merkzettel auf Klickereignisse überwachen
		$("noticeFeature").onclick = function(event)
		{
			var e = event || window.event;
			Event.stop(e);

			//Url aufbauen
			var url = Core.url("cart/wishlistAdd/"+prodDetail.prodId+"/");

			//Stückzahl auslesen
			var amount = parseInt( $("amountSelect").getValue() );

			//Stückzahl = 1 falls Fehlerhaft oder kleiner 0
			if(isNaN(amount)) amount=1;

			//Stückzahl an URL anhängen
			url += String(amount);

			//Informationen über Produktattribute an URL anhängen
			prodDetail.attr.each( function(item)
			{
				url += "/"+item[0]+"/"+item[1];
			});
	
			//AJAX-Get-Request zum Übermitteln an den Server
			new Ajax.Request(url, {method:'get', onSuccess:function(transport)
			{
				//Get Anfrage per vorher generierter URL
				new Ajax.Request(Core.url("cart/wishlistApplet"),
				{
					method:'get',
					//Bei Erfolgreichem Request Statusmeldung und Postenanzahl auf dem Merkzettel lesen
					onSuccess:function(trans)
					{
						var re = /<span id="wishlist_product_count">([.\s\S]*)<\/span>/g;
						var r = trans.responseText.match(re);

						//Posten-Anzeige des Merkzettel-Applets aktualisieren
						$("wishlist_product_count").replace(r[0]);
					}
				});

				//Hinweis feld sichtbar machen und Statustext vom Server anzeigen
				if(!$("noticeArea").visible())
				{
					$("noticeArea").update( transport.responseText );
					Effect.BlindDown( $("noticeArea") );
	
					new PeriodicalExecuter(function(pe) {
							Effect.BlindUp( $("noticeArea") );
							pe.stop();
						}, 5
					);
				}
			} });
		};
		
		//Eigene Fix-Url-Methode zum "Warten der URL" aufrufen
		//this.fixUrl();
	},

	//TODO: Was macht diese Funktion ??
	fixUrl:function(){
		var a = $('prodDetails').select('div.detailRow')[2].select('a');
		if(a) 
		{
			for(var i = 0; i<a.length;i++)
			{
				var el = a[i];
				var elHref = el.readAttribute('href');
				if(elHref)
				{
					var currPath = window.location.pathname;
					var tmp = currPath.split('__');
					var ctmp = elHref.split('__');
					var rep = window.location.protocol + '//' + window.location.host + Core.url('/');
					if(ctmp.length < 2) {
						var sub = elHref.split(rep).join('/');
						sub = sub.split(Core.url('')).join('/');
						a[i].writeAttribute('href',tmp[0]+'__'+Core.filterUrl(sub));
					}
				}
			}
		}
	},
	
	//Produktansicht per Ajax aktualisieren
	update: function(url)
	{
		//URL aufbauen
		url = "shop/prod/"+prodDetail.prodId;

		//Url um Produktattribute erweitern
		prodDetail.attr.each( function(item)
		{
			url += "/"+item[0]+"/"+item[1];
		});
		//Zeichenkette für "outlet" an URL anhängen
		url+=outlet;

		//Produktbild vorübergehend durch Ladegrafik ersetzen
		if ($("mainImage")!=null)
		{
			$("mainImage").hide();
		}
		$("loaderbig").show();

		//Ajex-Get-Request ausführen
		new Ajax.Request( Core.url(url), { method:'get', onSuccess:function(trans){
			$("prodDetails").replace(trans.responseText);  
			prodDetail.initialize();
			cz.initialize();
			
			} });
	}
}

 var ProdGallery = Class.create();
 ProdGallery.prototype = {
 	
 	ready:false,
 	
 	initialize:function(){
 		
 	},
 	
 	init:function() {
 
 		this.ready = true;
 		
 		$("bigloaderImage").hide();
 		$("bigImage").show()
 		
 		var item = $("galleryClose");
 		if(item) { 		
 			item.writeAttribute("href",null);
 			item.addClassName("pointer");
	 		$(item).observe('click', function(event) {	
	 			Effect.Fade($("ajaxLoader"), { duration: 0.3 });
	 			Effect.Fade($$("div.overlay")[0], { duration: 0.4 });
	 			//Workaround IE 6 (selectboxen wieder anzeigen wenn overlay geschlossen wird)
	 			$A( $$("select") ).each( function(item)
	 		 	{
	 		 		(item).show();
	 		 	});
	 	 		//Workaround IE 6 Ende
	 		});
 		}
 		
 		$A( $$("a.thumbs") ).each( function(item) {
	 		var regexp = /shop\/prod\/gallery\/([0-9]*)\/img\/([0-9]*)/;
			var index = regexp.exec(item.href);	item.writeAttribute("href",null); 
			item.addClassName("pointer");
			$(item).setAttribute('prod',index[1]); $(item).setAttribute('img',index[2]);
	 		
	 		$(item).observe('click', function(event) {
	 			$("bigImage").hide(); $("bigloaderImage").show();
	 			new Ajax.Request( 
	 				Core.url("shop/getProdImage/"+this.getAttribute("prod")+"/"+this.getAttribute("img")), 
	 						{ method:'get', onSuccess:function(trans){ 
	 							$("bigImage").setAttribute("src",trans.responseText);
	 							$("bigloaderImage").hide(); 
	 							$("bigImage").show();
	 							//Effect.Appear( $("bigImage"), { duration: 0.3 } ); 
	 						} });
	 		});
 		});
 	}
 }
 
 
 var ProdDetailView = Class.create();
 ProdDetailView.prototype = {
 	
 	ready:false,
 	
 	initialize:function(){},
 	
 	init:function() {
 				
 		var closer = [$("detailsClose1"),$("detailsClose2")];
 		
 		$A( closer ).each( function(item) {
 			item.writeAttribute("href",null);
 			item.addClassName("pointer");
	 		$(item).observe('click', function(event) {	
	 			Effect.Fade($("ajaxLoader"), { duration: 0.3 });
	 			Effect.Fade($$("div.overlay")[0], { duration: 0.3 });
	 			//Workaround IE 6 (selectboxen wieder anzeigen wenn overlay geschlossen wird)
	 			$A( $$("select") ).each( function(item)
	 		 	{
	 		 		(item).show();
	 		 	});
	 	 		//Workaround IE 6 Ende
	 		});
 		});
 		
 		this.ready = true;
 	}
 } 
 
var tabBrowsing = Class.create({
	initialize:function()
	{
		this.tabSwitch();
	},
	tabSwitch:function(){
		$$('div.tab').invoke('hide');
		$('tab1show').show();
		$('tab5show').show();

		$($('tab1').firstChild).addClassName('tabon');
		$($('tab5').firstChild).addClassName('tabon');
		
		var self = this;
		$$('input.taboff').invoke('observe','click',function(e)
		{
			Event.stop(e);
			$$('input.tabon').invoke('removeClassName','tabon');
			$$('div.tab').invoke('hide');
			$('tab5show').show();
			$($('tab5').firstChild).addClassName('tabon');
			
			this.addClassName('tabon');
			self.showDescription(this.parentNode.getAttribute('id'));
		});
		$('tab5').firstChild.observe('click', function(event) 
		{
			Event.stop(event);
		});
	},
	showDescription:function(showDescription){
		tabshow = showDescription+'show';
		$(tabshow).show();
	}
});

var MoreImages = Class.create({
	initialize:function()
	{
		var length = $('altImageLength').value;
		var self = this;
		
		for(var i=0;i<length;i++)
		{
			$('altImage'+i).observe('mouseover', function(event) 
			{	
				self.setMainAndZoomImage(this.getAttribute('url'), 280, 280, 560, 560);
			});
		}
		/*
		$('productLeftColumn').observe('mouseout',function(event)
		{
		    self.setMainAndZoomImage($('altImage0').getAttribute('url'), 280, 280, 560, 560);
		})
		*/
	},
	setMainAndZoomImage:function(image, imageWidth, imageHeight, zoomWidth, zoomHeight)
	{
		if(!$('mainImage')) return;
		if(!$('zoomImage')) return;
		$('mainImage').src=image;
		$('mainImage').style.width=imageWidth+'px';
		$('mainImage').style.height=imageHeight+'px';
		
		$('zoomImage').src=image;
		$('zoomImage').style.width=zoomWidth+'px';
		$('zoomImage').style.height=zoomHeight+'px';
	}
});

/**
 * Initialisiert die Buttons für das Rating des Produkts
 */
function initRating()
{
	
	var ratingbuttons = $('ratingButtons').select('li');
	
	$('ratingButtons').className = 'rating';
	
	ratingbuttons.each(function(rb){
		$(rb).onclick = function(e){
			var e = e||window.event;
			Event.stop(e);
			
			var rating = rb.readAttribute('rating');
			//Standardwert
			var ratingReadable = 4;
			
			$('ratingValue').value = rating;
			 
			switch(parseInt(rating))
			{
				case 1: 	
					ratingReadable = 'onestar';
				break; 
				
				case 2: 	
					ratingReadable = 'twostars';
				break; 
				
				case 3: 	
					ratingReadable = 'threestars';
				break; 
				
				case 4: 	
					ratingReadable = 'fourstars';
				break;
				
				case 5: 	
					ratingReadable = 'fivestars';
				break;  				
			}
			
			$('ratingButtons').className = 'rating '+ratingReadable;
		}			
	});	
}

/**
 * Liefer die Ergebnisliste der Fragebogenantworten der Kunden  für den PageBrowser zum akutellen Produkt
 *
 * @param int prodID ProduktID des Produktes zu dem der Fragebogen gehört
 * @param int start Start für das Limit
 * @param int length Länge für das Limit 
 */
function reviewBrowser(prodID, start, length, loader)
{
	//Ladegrafik anzeigen 
	if(loader == 1)
	{
		$('reviewDiv').innerHTML = $('reviewLoader').innerHTML;		
	}
	var url = Core.url("question/AJAX_getReviewsByProduct");
	var pars = 'prodID='+prodID+'&start='+start+'&length='+length;
	var req = new Ajax.Request
					(
	                    url, 
	                    {
							method: 'post', 
							parameters: pars, 
							onComplete:function(r)
							{
								$('reviewDiv').innerHTML = r.responseText;
								$('reviewLoader').hide();
							}
						}
					); 
	
	
					  
}

function initMetaData()
{
	browsing.tabSwitch();

	//Ratingbuttons 
	if($('ratingButtons'))
	{
		initRating();
	}
	
	//Reviews initilisieren
	if($('reviewDiv'))
	{
		reviewBrowser($('prodId').value, 1, $('reviewsPerPage').value);
	}
}
 
var browsing;
 
$(window).onload = function()
{
	browsing = new tabBrowsing();

	initMetaData();
		
	$('printFeature').onclick = function() { window.print(); }
	$('printFeature').show();
	$('noticeFeature').show();
	
	prodDetail = new ProdDetail();
	rodDetailView = new ProdDetailView();
	prodGallery = new ProdGallery();

	// Am ende noch einen DIV Container anhängen für AJAXausgabe
	newDiv = document.createElement('div');
	newDiv.id = "ajaxLoader";
	document.body.appendChild(newDiv);

	newDiv = document.createElement('div');
	newDiv.id = "galleryDummy";
	document.body.appendChild(newDiv);
	
	newDiv = document.createElement('div');
	newDiv.id = "detailDummy";
	document.body.appendChild(newDiv);
	
	$("ajaxLoader").hide();

	$("galleryDummy").hide();
	new Ajax.Updater( $("galleryDummy"), Core.url("shop/prodGallery/aload"), { method:'get'} );
	
	$("detailDummy").hide();
	new Ajax.Updater( $("detailDummy"), Core.url("shop/prodDetail/aload"), { method:'get'});
	
	var moreImages = new MoreImages();
 };