dojo.registerModulePath("com","../../com");
dojo.require("dijit.dijit");
dojo.require("com.scm.TargetBlank");
dojo.addOnLoad(function(){
	var newWindowLinks = dojo.query('.targetBlank');
	dojo.forEach(newWindowLinks, function(newWindowLink) {
		var linkTarget = newWindowLink.href;
		var clickConnect = new com.scm.TargetBlank(newWindowLink, linkTarget);
	});	
	
	var imageForms = dojo.query("form.imageForm");
	dojo.forEach(imageForms, function(form){
		var submitButton = dojo.query("button", form);
		dojo.forEach(submitButton, function(btn){
			dojo.connect(btn, "onclick", function(e){
				dojo.stopEvent(e);
				var image = dojo.byId("image").value;
				var imageSrc = form.action+image+".jpg";
				setImage(imageSrc);
			});
			dojo.connect(form, "onsubmit", function(e){
				dojo.stopEvent(e);
				var image = dojo.byId("image").value;
				var imageSrc = form.action+image+".jpg";
				setImage(imageSrc);
			});
		});
	});
	
	var newsletterForms = dojo.query("form.newsletter");
	dojo.forEach(newsletterForms, function(form){
		dojo.connect(form, "onsubmit", function(e){
			var inputItems = dojo.query("input.required", form);
			dojo.forEach(inputItems, function(item){
				if(item.value == ""){
					dojo.stopEvent(e);
					if(item.id == "email"){
						dojo.byId("errorMessageEmail").innerHTML = "Geen geldig e-mailadres";
					}
					else {
						dojo.byId("errorMessageFirstName").innerHTML = "Voor- en achternaam zijn verplicht";
					}
					
				}
				else if(item.id == "email"){
					var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
					if(!filter.test(item.value)){
						dojo.stopEvent(e);
						dojo.byId("errorMessageEmail").innerHTML = "Geen geldig e-mailadres";
					}
				}
				else {
					dojo.byId("errorMessageFirstName").innerHTML = "";
					dojo.byId("errorMessageEmail").innerHTML = "";
				}
			});
		});		
	});
	
	function setImage(imageSrc){
		var pageContent = dojo.byId("pageContent");
		var image = document.createElement("img");
		var page = dojo.byId("page");
		image.src = imageSrc;
		
		dojo.style(pageContent, "visibility", "hidden");
		var loaderImage = document.createElement("div");
		loaderImage.id = "loaderImage";
		loaderImage.innerHTML = "foto laden..."
		page.appendChild(loaderImage);
	
		dojo.connect(image, "onload", function(){
			page.removeChild(loaderImage);
			dojo.style(pageContent, "visibility", "visible");
			if(image.width > image.height){
				image.height = image.height/(image.width / 275);
				image.width = "275";
			}
			else {
				image.width = image.width/(image.height / 200);
				image.height = "200";
			}
			pageContent.innerHTML = "<h1 class='titel2'><span class='accessibility'>Jouw natuurverhaal</span></h1><a href='"+imageSrc+"' target='_blank' id='downloadLink'><span class='accessibility'>Download deze foto</span></a><a href='http://www.staatsbosbeheer.nl/Nieuws%20en%20achtergronden/Nieuws/Archief/2010/5/Nu%20geopend%20het%20buitenpodium.aspx' id='sbbLink' target='_blank'><span class='accessibility'>Naar Buiten - Staatsbosbeheer</span></a><a href='newsletter.html' id='newsletterLink'><span class='accessibility'>Niewsbrief ontvangen?</span></a>";
			pageContent.appendChild(image);		
		});
		dojo.connect(image, "onerror", function(){
			page.removeChild(loaderImage);
			dojo.style(pageContent, "visibility", "visible");
			dojo.byId("errorMessage").innerHTML = "De code is onjuist. Probeer het nog een keer.";
		});
	}
	

	dojo.declare("Lightbox", null, {
		underLayer: null,
		viewport: null,
		lightboxContainer: null,
		pageHeight: null,
		pageWidth: null,
		page: null,
		constructor: function(){
			this.page = dojo.byId("page");
		},
		setUnderlayer: function(){
			//console.log("setUnderlayer");
			this.underLayer = document.createElement("div");
			this.underLayer.id = "underLayer";
			dojo.hitch(this, this.positionUnderlayer());
			dojo.style(this.underLayer, "opacity", 0);
			dojo.body().appendChild(this.underLayer);
			dojo.hitch(this, this.setLightBox());
			dojo.connect(this.underLayer, "onclick", this, this.hideLightBox);
		},
		positionUnderlayer: function(){
			this.viewport = dijit.getViewport();
			this.pageWidth = dojo.marginBox(this.page).w;
			this.pageHeight = dojo.marginBox(this.page).h;
			//console.log("positionUnderlayer");
			if(this.pageWidth > this.viewport.w){
				dojo.style(this.underLayer, "width", this.pageWidth+"px");
			}
			else {
				dojo.style(this.underLayer, "width", this.viewport.w+"px");
			}
			if(this.pageHeight > this.viewport.h){
				dojo.style(this.underLayer, "height", this.pageHeight+"px");
			}
			else {
				dojo.style(this.underLayer, "height", this.viewport.h+"px");
			}			
		},
		setLightBox: function(){
			//console.log("setLightBox");
			this.lightboxContainer = document.createElement("div");
			this.lightboxContainer.id = "lightboxContainer";
			this.lightboxContainer.innerHTML = this.getData();
			dojo.body().appendChild(this.lightboxContainer);
			dojo.style(this.lightboxContainer, "opacity", 0);
			dojo.hitch(this, this.positionLightBox());
			dojo.hitch(this, this.showLightBox());
		},
		getData: function(){	
			var xhrArgs = {
				url: "algemeneVoorwaarden.html",
				handleAs: "text",
				load: dojo.hitch(this, function(data) {
					this.lightboxContainer.innerHTML = data;
				}),
				error: function(error) {
					var errorMsg = "Algemene voorwaarden kan door een technische fout niet worden geladen: "+error;
					return errorMsg;
				}
			}
			var deferred = dojo.xhrGet(xhrArgs);
		},
		positionLightBox: function(){
			this.viewport = dijit.getViewport();
			//console.log("positionLightBox");
			dojo.style(this.lightboxContainer, "left", (this.viewport.w/2)-(dojo.marginBox(this.lightboxContainer).w/2)+"px");
			dojo.style(this.lightboxContainer, "height", (this.viewport.h*0.9)+"px");
			dojo.style(this.lightboxContainer, "top", (this.viewport.h/2)-(dojo.marginBox(this.lightboxContainer).h/2)+"px");
		},
		showLightBox: function(){
			dojo.animateProperty({
				node: this.underLayer,
				duration:250,
				properties: {
					opacity: { end:'0.75' }
				},
				onEnd: dojo.hitch(this, function(){
					dojo.animateProperty({
						node: this.lightboxContainer,
						duration:250,
						properties: {
							opacity: { end:'1' }
						},
						onEnd: dojo.hitch(this, function(){
							this.resizeConnector1 = dojo.connect(window, "resize", this, this.positionUnderlayer);
							this.resizeConnector2 = dojo.connect(window, "resize", this, this.positionLightBox);
							dojo.connect(dojo.byId("btnClose"), "onclick", this, this.hideLightBox);
						})
					}).play();
				})
			}).play();
		},
		hideLightBox: function(e){
			dojo.stopEvent(e);
			dojo.animateProperty({
				node: this.lightboxContainer,
				duration:250,
				properties: {
					opacity: { end:'0' }
				},
				onEnd: dojo.hitch(this, function(){			
					dojo.animateProperty({
						node: this.underLayer,
						duration:250,
						properties: {
							opacity: { end:'0' }
						},
						onEnd: dojo.hitch(this, function(){
							dojo.body().removeChild(this.lightboxContainer);
							dojo.body().removeChild(this.underLayer);
							dojo.disconnect(this.resizeConnector1);
							dojo.disconnect(this.resizeConnector2);
						})
					}).play();
				})
			}).play();
		}
	});
	var lightbox = new Lightbox();
	
	/*
	dojo.connect(dojo.byId("algemeneVoorwaarden"), "onclick", function(e){
		dojo.stopEvent(e);
		lightbox.setUnderlayer();	
	});
	*/
});