/**
 * @author joachim.kliemann
 */

if (!YAHOO.hmmh) YAHOO.namespace("hmmh.openSchriftenLayer");

YAHOO.hmmh.openSchriftenLayer = function() {
	
	return {
			prozess : null, // Thread for opening and closing delayed layers
			init : function() {
				/* Elemente der Klasse .kauflayerSchriften werden geholt */
				var openLayerButton = $D.getElementsByClassName('warenkorbSchriften','img');
				var openSchnitteButton = $D.getElementsByClassName('schnitte','span');
				
				$D.generateId(openLayerButton, 'panelView-');
				$D.generateId(openSchnitteButton, 'schnitteView-');
				
				/* Listener werden gesetzt */
				$E.on(openLayerButton, 'click', this.showPanelLayer );
				//$E.on(openSchnitteButton, 'click', this.showSchnitteLayer );

			},
		
			showPanelLayer : function(obj,id) {
			    if (YAHOO.hmmh.dialog1) {
			      YAHOO.hmmh.dialog1.destroy
			    }
				/* Funktion Anfang */
				  $D.replaceClass(this, 'kauflayerSchriften', 'kauflayerAktiv');
					
					var html2dialog ='<div class=bd> <form name=dlgForm method=POST action=php/post.php> <table style="padding:	0 0 0 8px;"> <tr> <td style="vertical-align: top; padding-top:2px;"> <table class=layerRahmen> <tr> <td><input type=radio name=paket value=1 /></td> <td><label for=paket><strong>Paket</strong></label></td> <td class=schnitt_preis>ab &euro; <strong>135</strong></td></tr> <tr> <td>&nbsp;</td> <td colspan=2 class=schnitteKomplett>46 Schnitte komplett</td></tr></table> <table class="layerRahmen layerRahmenBg"> <tr> <td><input type=radio name=paket value=1 /></td> <td><label for=paket><strong>Einzelschnitte</strong></label></td> <td class=schnitt_preis>ab &euro; <strong>22</strong></td></tr> <tr> <td colspan=3> <select multiple size=10 style="padding: 0 5px;"> <option value="">Neue Helvetica - 01</option> <option value="">Neue Helvetica - 02</option> <option value="">Neue Helvetica - 03</option> <option value="">Neue Helvetica - 04</option> <option value="">Neue Helvetica - 05</option> <option value="">Neue Helvetica - 06</option> <option value="">Neue Helvetica - 07</option> <option value="">Neue Helvetica - 08</option> <option value="">Neue Helvetica - 09</option> <option value="">Neue Helvetica - 10</option> <option value="">Neue Helvetica - 11</option> <option value="">Neue Helvetica - 12</option> <option value="">Neue Helvetica - 13</option> <option value="">Neue Helvetica - 14</option> </select></td></tr> <tr> <td colspan=3><span class=selectText>Mehrere markieren:<br>Strg-Klick (PC), Apfel-Klick (Mac)</span></td></tr></table> </td> <td style="width: 20px; padding: 10px;">&nbsp;</td> <td style="vertical-align: top;"> <table class=whitelayerRahmen> <tr> <td colspan=3><strong>Plattform und Format</strong></td></tr> <tr> <td class=leftboxes><input type=checkbox name=paket value=1 /><img src=img/btbg/font_ps.gif style="vertical-align: bottom; padding: 2px 2px 0 5px;"></td> <td class=rightboxes><input type=checkbox name=paket1 value=1 /><img src=img/btbg/font_ps_apple.gif style="vertical-align: bottom; padding: 2px 2px 0 5px;"></td></tr> <tr> <td>&nbsp;</td> <td class=rightboxes><input type=checkbox name=paket value=1 /><img src=img/btbg/font_tt.gif style="vertical-align: bottom; padding: 2px 2px 0 5px;"></td></tr> <tr colspan=2><td>&nbsp;</td></tr></table> <table class=whitelayerRahmen> <tr> <td colspan=3><strong>Versand</strong></td></tr> <tr> <td class=versandLeft><input type=radio name=paket value=1 /></td> <td class=versandMiddle><img src=img/icon_download_fonts_s.gif style="vertical-align: bottom; padding: 2px 2px 0 5px;" /></td> <td class=versandRight>Download</td></tr> <tr> <td class=versandLeft><input type=radio name=paket value=1 /></td> <td class=versandMiddle><img src=img/icon_cd_fonts_s.gif style="vertical-align: bottom; padding: 2px 2px 0 5px;" /></td> <td class=versandRight>Versand</td></tr> <tr colspan=3><td>&nbsp;</td></tr></table> <table class=whitelayerRahmen> <tr> <td><strong>Lizenz</strong></td></tr> <tr> <td class=lizensboxes><label for=paket>CPU-Anzahl</label><input type=text name=paket style="width: 30px;" /></td></tr> <tr><td>&nbsp;</td></tr></table> <table class=priceRahmen> <tr> <td style=color:#006FB7>Ihre Auswahl: <span style=font-size:24px;>&euro;<strong> 66</strong></span></td> <td style="text-align: right;"><img src=img/icon_font_warenkorb.gif /></td></tr></table></td></tr></table>  </form> </div>';
					/* var html2dialog ='<div class=bd_schriften> <form name=dlgForm method=POST action=php/post.php> <table> <tr> <td style="vertical-align: top;"> <table class=layerRahmen> <tr> <td><input type=radio name=paket value=1 /></td> <td><label for=paket><strong>Paket</strong></label></td> <td style="text-align: right;">ab &euro; <strong>135</strong></td></tr> <tr> <td>&nbsp;</td> <td colspan=2>46 Schnitte komplett</td></tr></table> <table class="layerRahmen layerRahmenBg"> <tr> <td><input type=radio name=paket value=1 /></td> <td><label for=paket><strong>Einzelschnitte</strong></label></td> <td style="text-align: right;">ab &euro; <strong>22</strong></td></tr> <tr> <td colspan=3> <select multiple size=10 style="padding: 0 5px;"> <option value="">Neue Helvetica - 01</option> <option value="">Neue Helvetica - 02</option> <option value="">Neue Helvetica - 03</option> <option value="">Neue Helvetica - 04</option> <option value="">Neue Helvetica - 05</option> <option value="">Neue Helvetica - 06</option> <option value="">Neue Helvetica - 07</option> <option value="">Neue Helvetica - 08</option> <option value="">Neue Helvetica - 09</option> <option value="">Neue Helvetica - 10</option> <option value="">Neue Helvetica - 11</option> <option value="">Neue Helvetica - 12</option> <option value="">Neue Helvetica - 13</option> <option value="">Neue Helvetica - 14</option> </select></td></tr> <tr> <td colspan=3>Mehrere markieren:<br>Strg-Klick (PC), Apfel-Klick (Mac)</td></tr></table> </td> <td style="width: 20px; padding: 10px;">&nbsp;</td> <td style="vertical-align: top;"> <table class=whitelayerRahmen> <tr> <td colspan=3><strong>Plattform und Format</strong></td></tr> <tr> <td><input type=checkbox name=paket value=1 /><img src=img/btbg/font_ps.gif style="vertical-align: bottom; padding: 2px 2px 0 5px;"></td> <td><input type=checkbox name=paket1 value=1 /><img src=img/btbg/font_ps_apple.gif style="vertical-align: bottom; padding: 2px 2px 0 5px;"></td></tr> <tr> <td>&nbsp;</td> <td><input type=checkbox name=paket value=1 /><img src=img/btbg/font_tt.gif style="vertical-align: bottom; padding: 2px 2px 0 5px;"></td></tr></table> <table class=whitelayerRahmen> <tr> <td colspan=3><strong>Versand</strong><br><br></td></tr> <tr> <td><input type=radio name=paket value=1 /> CD Versand</td> <td><input type=radio name=paket value=1 /> Download</td></tr></table> <table class=whitelayerRahmen> <tr> <td colspan=2><strong>Lizenz</strong><br><br></td></tr> <tr> <td><label for=paket>CPU-Anzahl</label></td> <td><input type=text name=paket style="width: 30px;" /></td></tr></table> <table> <tr> <td colspan=2 style=color:#006FB7>Ihre Auswahl: <span style=font-size:24px;>&euro;<strong> 66</strong></span></td></tr></table></td></tr></table>  </form> </div>';*/
					/* var html2dialog ='<div id="innerdlg_kaufen" class="schriftenKaufen"><div class="bd"><form name="dlgForm" method="POST" action="php/post.php"><p>Please enter your personal contact information:</p><label for="firstname" style="width: 200px;">First Name:</label><input type="textbox" name="firstname" /><br/><label for="lastname">Last Name:</label><input type="textbox" name="lastname" /><br/><label for="email">E-mail:</label><input type="textbox" name="email" /><br/><label for="state[]">State:</label><select multiple name="state[]" ><option value="California">California</option><option value="New Jersey">New Jersey</option><option value="New York">New York</option></select><br/><label for="radiobuttons">Radio buttons:</label><input type="radio" name="radiobuttons[]" value="1" checked="checked" /> 1<input type="radio" name="radiobuttons[]" value="2" /> 2<br/><label for="check">Single checkbox:</label><input type="checkbox" name="check" value="1" />1<br/><label for="textarea">Text area:</label><textarea name="textarea"></textarea><br/><label for="cbarray">Multi checkbox:</label><input type="checkbox" name="cbarray[]" value="1" />1<input type="checkbox" name="cbarray[]" value="2" />2</form></div></div>'; */
				/* Definieren der Event Handler */
					var handleSubmit = function() {
						this.submit();
					};
					var handleCancel = function() {
						this.cancel();
					};
					var handleSuccess = function(o) {
						var response = o.responseText;
						response = response.split("<!")[0];
						document.getElementById("resp").innerHTML = response;
						eval(response);
					};
					var handleFailure = function(o) {
						alert("Submission failed: " + o.status);
					};
				
				
			
				/* Instanzieren des Dialoglayers */
				YAHOO.hmmh.dialog1 = new YAHOO.widget.Overlay("dlg_kaufen", 
																			{ width : "465px",
																			  height : "390xp",
																			  zindex : "9999",
																			  fixedcenter : true,
																			  visible : true,
																			  constraintoviewport : true,
																			  effect:{effect:YAHOO.widget.ContainerEffect.FADE,duration:0.25} }
																		 );
																					 
				/* YAHOO.hmmh.dialog1.cfg.queueProperty("buttons", [ { text:"Submit", handler:handleSubmit, isDefault:true },
																						  						{ text:"Cancel", handler:handleCancel } ]); */
				/* Validierung der Formularfelder: Vor- und Nachname */
					YAHOO.hmmh.dialog1.validate = function() {
						var data = this.getData();
						if (data.firstname == "" || data.lastname == "") {
							alert("Please enter your first and last names.");
							return false;
						} else {
							return true;
						}
					};

					// Wire up the success and failure handlers
					YAHOO.hmmh.dialog1.callback = { success: handleSuccess,failure: handleFailure };
					
					// Render the Dialog
					//YAHOO.hmmh.dialog1.setHeader(this.id);
					YAHOO.hmmh.dialog1.setHeader("Helvetica&trade; Neue Complete Familie<div id=\"overlayFontsClose\">&nbsp;</div>");
					YAHOO.hmmh.dialog1.setBody(html2dialog);
					//YAHOO.hmmh.dialog1.setFooter("<br><br>");
					YAHOO.hmmh.dialog1.render(document.body);
					YAHOO.hmmh.dialog1.show();
					//YAHOO.hmmh.dialog1.showEvent.subscribe(hidePanelLayer);
					
					$E.on("overlayFontsClose", 'click', YAHOO.hmmh.dialog1.destroy, YAHOO.hmmh.dialog1, true);
					
			/* Funktion Ende*/	
			},
			
			showSchnitteLayer : function(ev, obj, elId, htmlContentForm, htmlTitle, fontPK) {
				$E.stopEvent(ev);
				/* Funktion Anfang */
				if (YAHOO.hmmh.dialog2) {
			      YAHOO.hmmh.dialog2.destroy;
			    }
				
				var distBody = '<div id="innerdlg_schnitte"><div class="bd_schnitte"></div></div>';;
				
				$D.replaceClass(this, 'kauflayerSchriften', 'kauflayerAktiv');
					
					var html2dialog ='<div id="innerdlg_schnitte"><div class="bd_schnitte"><form action="select.htm"><select name="top5" size="16" multiple><option>Neue Helvetica - 01</option><option>Neue Helvetica - 02</option><option>Neue Helvetica - 03</option><option>Neue Helvetica - 04</option><option>Neue Helvetica - 05</option><option>Neue Helvetica - 06</option><option>Neue Helvetica - 07</option><option>Neue Helvetica - 08</option><option>Neue Helvetica - 09</option><option>Neue Helvetica - 10</option><option>Neue Helvetica - 11</option><option>Neue Helvetica - 12</option><option>Neue Helvetica - 13</option><option>Neue Helvetica - 14</option><option>Neue Helvetica - 15</option><option>Neue Helvetica - 16</option><option>Neue Helvetica - 17</option><option>Neue Helvetica - 18</option><option>Neue Helvetica - 19</option><option>Neue Helvetica - 20</option><option>Neue Helvetica - 21</option><option>Neue Helvetica - 22</option><option>Neue Helvetica - 23</option><option>Neue Helvetica - 24</option><option>Neue Helvetica - 25</option><option>Neue Helvetica - 26</option><option>Neue Helvetica - 27</option><option>Neue Helvetica - 28</option><option>Neue Helvetica - 29</option><option>Neue Helvetica - 30</option><option>Neue Helvetica - 31</option><option>Neue Helvetica - 32</option><option>Neue Helvetica - 33</option></select></form></div></div>';
				/* Definieren der Event Handler */
					var handleSubmit = function() {
						this.submit();
					};
					var handleCancel = function() {
						this.cancel();
					};
					var handleSuccess = function(o) {
						var response = o.responseText;
						response = response.split("<!")[0];
						document.getElementById("resp").innerHTML = response;
						eval(response);
					};
					var handleFailure = function(o) {
						alert("Submission failed: " + o.status);
					};
					
				/* Instanzieren des Dialoglayers */
				YAHOO.hmmh.dialog2 = new YAHOO.widget.Overlay("dlg_schnitte", 
																			{ width : "400px",
																			  zindex : "100",
																			  context:[elId, "tr", "bl"], //was :: this.id
																			  fixedcenter : false,
																			  constraintoviewport : true,
																			  underlay: "shadow",
																			  effect:{effect:YAHOO.widget.ContainerEffect.FADE,duration:0.25} }
																		 );
				
				/* Validierung der Formularfelder: Vor- und Nachname */
					YAHOO.hmmh.dialog2.validate = function() {
						var data = this.getData();
						if (data.firstname == "" || data.lastname == "") {
							alert("Please enter your first and last names.");
							return false;
						} else {
							return true;
						}
					};

					// Wire up the success and failure handlers
					YAHOO.hmmh.dialog2.callback = { success: handleSuccess,	failure: handleFailure };
					
					// Render the Dialog
					//YAHOO.hmmh.dialog2.setHeader(this.id);
					
					if (htmlContentForm!= null && htmlTitle!= null && fontPK != null) {
						//reset
						YAHOO.hmmh.dialog2.setHeader("")
						YAHOO.hmmh.dialog2.setBody("");
						YAHOO.hmmh.dialog2.setFooter("");
						//set anew
						
						YAHOO.hmmh.dialog2.setHeader(htmlTitle + "<div id=\"overlayFontsClose\">&nbsp;</div>");
						distBody = '<div id="innerdlg_schnitte"><div class="bd_schnitte">' + htmlContentForm + '</div></div>';
						YAHOO.hmmh.dialog2.setBody(distBody);
						
						YAHOO.hmmh.dialog2.setFooter("<a href='fontdetails.htm?fontProductPK=" + fontPK + "'" +
								"onclick=\"switchToDetailsPageFonts('" + fontPK + "', 'fontdetails.htm', true); return false\"" +
								">alle Schnitte anzeigen</a>");
					} else {
						YAHOO.hmmh.dialog2.setHeader("Helvetica&trade; Neue Complete Familie<div id=\"overlayFontsClose\">&nbsp;</div>");
						YAHOO.hmmh.dialog2.setBody(html2dialog);
						YAHOO.hmmh.dialog2.setFooter("<a href='#'>alle Schnitte anzeigen</a>");
					}
					
					YAHOO.hmmh.dialog2.render(document.body);
					YAHOO.hmmh.dialog2.show();
					YAHOO.hmmh.dialog2.cfg.setProperty("x", 200);  // Set x - position fixed
					//YAHOO.hmmh.dialog2.showEvent.subscribe(hideSchnitteLayer);
					$E.on("overlayFontsClose", 'click', YAHOO.hmmh.dialog2.hide, YAHOO.hmmh.dialog2, true);
			
					$E.on(document.getElementsByTagName("body")[0], 'click', YAHOO.hmmh.openSchriftenLayer.hideSchnitteLayer, true);
			},
			hideSchnitteLayer : function (e) {
				var elTarget = YAHOO.util.Event.getTarget(e);
				if(elTarget) {
					if(!findID(elTarget, "dlg_schnitte")) {
			    		if(YAHOO.hmmh.dialog2) {
			    			YAHOO.hmmh.dialog2.hide();
			    			$E.removeListener(document.getElementsByTagName("body")[0]);
			    		}
					}
				}
			}
		};
		/* Funktion Ende*/
}();

if(YAHOO.env.ua.ie >0) {
	$E.onContentReady("footer", YAHOO.hmmh.openSchriftenLayer.init, YAHOO.hmmh.openSchriftenLayer, true);	
}
else {
	$E.on(window, 'load', YAHOO.hmmh.openSchriftenLayer.init, YAHOO.hmmh.openSchriftenLayer, true);	
}
//$E.onAvailable('mainCol', loadinit, {}, true);