window.addEvent('domready', function(){
	level3Setup.init();
});

window.addEvent('loaded', function(){
	level3Setup.setCenterHeight();
});

var level3Setup = {
	init: function(){
		
		// text array
		this.setText();
		
		// get the variables for this process
		this.getVars();
		
		// get the ATUS cookie named homepage
		this.cookie = this.getCookie('homepage');
		
		//dealer locator?
		if(this.dealerLocator){
			if((this.cookie.language == 'eng')&&(this.cookie.world_area == 'us_canada')){
				this.dealerLocator.setStyles({'display':'block'});
			}else{
				this.dealerLocator.dispose();
			}
		}
		
		//left images?
		if(this.left.images.length){
			// if there are left side images, show them
			this.leftPhotoCreate();
			this.leftPDFs();
		}else{
			// we don't have left side images, so make sure the div is hidden
			this.left.photo.dispose();
		}
		
		// see if there are contents to the left side
		this.left.divs = this.left.getElements('div');
		this.left.uls = this.left.getElements('ul');
		
		// do we need a left side?
		if((!this.left.uls.length)&&(!this.left.divs.length)){
			// we don't have a left side.
			//this.center.set('class','noleft');
			if(!this.center.hasClass('wide')){
				this.center.addClass('noleft');
			}else{
				this.center.setStyles({'padding':0,'margin':0});	
			}
			this.left.dispose();
		}
		
		// set the height of the center column if needed
	//	this.setCenterHeight.delay(50,level3Setup);
		
		// no matter what, we'll probably need the overlay and image divs
		this.createImageDivs();
		// run the the image finding parts and set their onlick events
		this.createProductImages();
		this.centerLoop();
	},
	
	setText: function(){
		// different languages text
		this.loadingText = {
			deu: "Downloadingbild...",
			eng: "Loading Image...",
			fre: "image de téléchargement...",
			por: "imagem da transferência ...",
			spa: "imagen de la transferencia..."	
		};
		
		this.closeText = {
			deu: "Fenster schließen",
			eng: "Close Window",
			fre: "Fermer",
			por: "Fechar janela",
			spa: "Cerrar la Ventana"
		};
		
		this.viewText = {
			deu: "Klicken Sie zum Vergrößern auf das Foto",
			eng: "Click on photo to view larger image",
			fre: "Cliquez sur la photo pour agrandir l'image",
			por: "Clique na foto para ampliar a imagem ou clique aqui para fazer",
			spa: "Haga clic en la fotografía para ampliarla"
		};
		
		this.orText = {
			deu: ", oder ",
			eng: ", or ",
			fre: ", ou ",
			por: ", o ",
			spa: ", o "
		};
		
		this.downloadText = {
			deu: "klicken Sie hier, um eine Version in hoher Auflösung herunterzuladen.",
			eng: "Download Hi-Res Image.",
			fre: "cliquez ici pour télécharger l'image en haute résolution.",
			por: "download da imagem de alta resolução.",
			spa: "haga clic aquí para descargar un archivo de imagen de alta resolución."
		};
		
		this.pdfText = {
			deu: "PDF herunterladen",
			eng: "Download PDF",
			fre: "Téléchargez le PDF",
			por: "Baixar PDF",
			spa: "Descargar el PDF"
		};
	},
	
	getVars: function(){
		// sets up the different variables that we use throughout
		this.frame = $('frame');
		this.left = $('level3l');
		this.center = $('level3c');
		this.left.photo = $('level3lPhoto');
		this.leftImages = $('leftImages');
		this.left.images = (this.leftImages) ? this.leftImages.getElements('img') : 0;
		this.dealerLocator = $('dealerLocator');
	},
	
	getCookie: function(name){
		// get the cookie named 'name'
		var myCookie = Cookie.read(name);
		// create and object to store the cookies in
		var myCookies = new Object();
		// split it up by '&' 
		if(myCookie){
			var myCookieCrumbs = myCookie.split('&');
			//for some reason it goes name&value&name&value so count by 2
			for(i=0; i<myCookieCrumbs.length; i=i+2){
				// set cookie name & value pairs up
				myCookies[myCookieCrumbs[i]]=myCookieCrumbs[i+1];	
			}
		}
		// if for some reason the language is not set, default it to english so stuff doesn't break
		if(!myCookies.language) myCookies.language='eng';
		return myCookies;
	},
	
	setCenterHeight: function(){
		// get the center and left heights
		this.center.height=this.getHeight(this.center);
		this.left.height=this.getHeight(this.left);
		// if the center isn't as tall as the left, make them the same
		 //$('searchInput').value=this.center.height;
		if(this.center.height<this.left.height){
			this.setHeight(this.center,this.left.height);
		}
		this.frame.height = this.frame.getSize().y;
		// some defaults for the image/frame popups
		this.maxHeight = this.frame.height-200;
		this.maxWidth = 900;
		this.closeHeight=40;
	},
	
	getHeight: function(element){
		element.height = parseInt(element.getSize().y);
		element.marginTop = parseInt(element.getStyle('margin-top'));
		element.marginBottom = parseInt(element.getStyle('margin-bottom'));
		return ((element.height+element.marginTop)+element.marginBottom);
	},
	
	setHeight: function(element,height){
		element.setStyle('height',height-element.marginTop-element.marginBottom);
	},
	
	createImageDivs: function(){
		//  Create of the overlay.
		this.overlay = new Element('div', {'id':'overlay', 'styles': {'opacity':'0.8'}}).injectInside(this.frame); 
		this.overlay.onclick = this.close.bind(level3Setup);
		
		// create the loading image screen.
		this.loading = new Element('div', {'id':'loading', 'html':this.loadingText[this.cookie.language]}).injectInside(this.frame);
		
		// create the big image container and all of it's parts
		this.bigImage = new Element('div', {'id':'bigImage'}).injectInside(this.frame);
		this.bigImage.close = new Element('div', {'id':'bigImageClose','html':this.closeText[this.cookie.language]}).injectInside(this.frame);
		this.bigImage.close.onclick = this.close.bind(level3Setup);
		this.bigImage.header = new Element('p', {'id':'bigImageHeader'}).injectInside(this.bigImage);
		this.bigImage.link = new Element('a', {'id':'bigImageLink'}).injectInside(this.bigImage);
		this.bigImage.image = new Element('img', {'id':'bigImageImage'}).injectInside(this.bigImage);
		this.bigImage.caption = new Element('p', {'id':'bigImageCaption'}).injectInside(this.bigImage);
		this.bigImage.date = new Element('p', {'id':'bigImageDate'}).injectInside(this.bigImage);
		
		// create the iframe view port
		this.iframeContainer = new Element('div', {'id':'frameContainer'}).injectInside(this.frame);
		//this.iframeContainer.frame = new IFrame({'id':'frameContainerFrame'}).injectInside(this.iframeContainer);
		this.iframeContainer.close = new Element('div', {'id':'frameContainerClose'}).set('html',this.closeText[this.cookie.language]).injectInside(this.iframeContainer);
		this.iframeContainer.close.onclick = this.close.bind(level3Setup);
	},
	
	leftPhotoCreate: function(){
		// remove any contents from the leftPhoto div
		this.left.photo.empty();
		// get the contents for the left side
		this.left.captions = this.leftImages.getElements('p');
		this.left.links = this.leftImages.getElements('a');
		this.left.hilinks = this.leftImages.getElements('dd');
		// need to count images.
		this.left.photo.index = 1;
		// load the first image
		this.leftPhotoCreateImage(this.left.images[0].src);
		// figure out if we have more than one image
		this.leftPhotoSelector();
		// creates the caption and inserts it in the leftSide div
		this.left.photo.caption = new Element('p').set('html', this.left.captions[0].innerHTML).injectInside(this.left.photo);
		// creates the download/view text and inserts it
		this.left.photo.download = new Element('p',{'html':this.viewText[this.cookie.language], 'class':'hi'}).injectInside(this.left.photo);
		// if there are hi-res links,
		if(this.left.hilinks.length){
			// add or
			this.left.photo.download.appendText(this.orText[this.cookie.language]);
			// ie isn't playing nice, so we need to see if there are spaces in the link, and if there are, remove everything after it
			this.left.photo.download.link=this.left.hilinks[0].innerHTML;
			if(this.left.photo.download.link.search(/ /)>0) this.left.photo.download.link=this.left.photo.download.link.substr(0,this.left.photo.download.link.search(/ /));
			// add the link and text to the hi-res image
			this.left.photo.download.a = new Element('a',{'href':'/cgi-bin/dump_file.pl?file='+this.left.photo.download.link,'html':this.downloadText[this.cookie.language]}).injectInside(this.left.photo.download);
		}
	},
	
	leftPhotoCreateImage: function(source){
		// if there is already an image, remove it
		if(this.left.photo.image) this.left.photo.image.dispose();
		// insert the new image at the top of the left photo div
		this.left.photo.image = new Element('img', {'src':source}).inject(this.left.photo,'top');
		// load the larger version if you click on image
		this.left.photo.image.onclick = this.loadImage.pass('left',level3Setup);
	},
	
	leftPhotoClickNext: function(){
		// change the image
		//this.left.photo.image.set('src', this.left.images[this.left.photo.index].src);
		this.leftPhotoCreateImage(this.left.images[this.left.photo.index].src);
		// change the caption
		this.left.photo.caption.set('html', this.left.captions[this.left.photo.index].innerHTML);
		// if we have hi-res links, do it.
		if(this.left.hilinks.length){
			this.left.photo.download.link=this.left.hilinks[this.left.photo.index].innerHTML;
			if(this.left.photo.download.link.search(/ /)>0) this.left.photo.download.link=this.left.photo.download.link.substr(0,this.left.photo.download.link.search(/ /));
			this.left.photo.download.a.set('href','/cgi-bin/dump_file.pl?file='+this.left.photo.download.link);
		}
		// we are on the next image
		this.left.photo.index++;
		// update the photo selector
		this.leftPhotoSelector();
	},
	
	leftPhotoClickPrev: function(){
		// we are the previous image
		this.left.photo.index--;
		// change the image
		//this.left.photo.image.set('src', this.left.images[this.left.photo.index-1].src);
		this.leftPhotoCreateImage(this.left.images[this.left.photo.index-1].src);
		// change the caption
		this.left.photo.caption.set('html', this.left.captions[this.left.photo.index-1].innerHTML);
		// if there are hi-res links, do it.
		if(this.left.hilinks.length){
			this.left.photo.download.link=this.left.hilinks[this.left.photo.index-1].innerHTML;
			if(this.left.photo.download.link.search(/ /)>0) this.left.photo.download.link=this.left.photo.download.link.substr(0,this.left.photo.download.link.search(/ /));
			this.left.photo.download.a.set('href','/cgi-bin/dump_file.pl?file='+this.left.photo.download.link);
		}
		// update the photo selector
		this.leftPhotoSelector();
	},
	
	leftPhotoSelector: function(){
		// if there is more than one image, continue
		if(this.left.images.length>1){
			// if we haven't already created the image selector, do so.
			if(!this.left.photo.selector){
				this.leftPhotoSelectorCreate();
			// looks like we are just trying to update arrows & image number	
			}else{
				this.leftPhotoSelectorUpdate();
			}
		}
	},
	
	leftPhotoSelectorCreate: function(){
		// create main div
		this.left.photo.selector = new Element('div', {'id': 'photoSelector'}).injectInside(this.left.photo);
		// this div is so contents can be centered
		this.left.photo.selector.frame = new Element('div', {'id':'photoSelectorFrame'}).injectInside(this.left.photo.selector);
		// divs for left image, center text & right image
		this.left.photo.selector.left  = new Element('div', {'id':'photoSelectorArrow', 'class':'leftOff'}).injectInside(this.left.photo.selector.frame);
		this.left.photo.selector.center = new Element('div', {'id':'photoSelectorCenter'}).injectInside(this.left.photo.selector.frame);
		this.left.photo.selector.right = new Element('div', {'id':'photoSelectorArrow', 'class':'rightOn'}).injectInside(this.left.photo.selector.frame);
		// set the proper contents for left, center & right
		this.leftPhotoSelectorUpdate();
	},
	
	leftPhotoSelectorUpdate: function(){
		// if it's not the first image, show darkened back arrow with link, else light arrow, no link
		if(this.left.photo.index>1){
			this.left.photo.selector.left.set('class','leftOn').onclick = this.leftPhotoClickPrev.bind(this);
		}else{
			this.left.photo.selector.left.set('class','leftOff').onclick = null;
		}
		// set the text of the center div (image x of y)
		this.left.photo.selector.center.set('html',' ' + this.left.photo.index + ' of '+ this.left.images.length+' ');
		// if it's not the last image, show darkened next arrow with link, else light arrow, no link
		if(this.left.photo.index<this.left.images.length){
			this.left.photo.selector.right.set('class','rightOn').onclick = this.leftPhotoClickNext.bind(this);
		}else{
			this.left.photo.selector.right.set('class','rightOff').onclick = null;
		}
		// get the width of the 3 elements, then set the width of frame, so it is centered.
		this.left.photo.selector.frame.width = this.left.photo.selector.left.getSize().x + this.left.photo.selector.center.getSize().x + this.left.photo.selector.right.getSize().x;
		this.left.photo.selector.frame.setStyle('width', this.left.photo.selector.frame.width);
			
	},
	
	loadImage: function(type){
		this.overlay.setStyles({'display':'block','height':this.frame.height});
		this.loading.setStyles({'display':'block'});
		this.bigImage.src = new Image();
		this.bigImage.src.onload = this.viewImage.pass(type,level3Setup);
		
		if(type=='left'){
			if(this.left.hilinks.length) this.bigImage.link.set({'html':this.downloadText[this.cookie.language],'href':'/cgi-bin/dump_file.pl?file='+this.left.photo.download.link,'target':'_parent'});
			this.bigImage.caption.set('html',this.left.captions[this.left.photo.index-1].innerHTML);
			this.bigImage.src.src = this.left.links[this.left.photo.index-1].href;
		}else if(type=='ad'){
			this.p = this.center.divs[this.myAd].getElements('p');
			this.a = this.center.divs[this.myAd].getElements('a');
			this.bigImage.header.set('html',this.p[0].innerHTML);
			this.bigImage.link.set({'html':this.pdfText[this.cookie.language],'href':this.a[1].href, 'target':'_blank'});
			this.bigImage.caption.set('html',this.p[2].innerHTML);
			this.bigImage.date.set('html',this.p[1].innerHTML);
			this.bigImage.src.src = this.a[0].href;
		}
	},
	
	viewImage: function(type){
		this.scroll =  document.window.getScroll().y.toInt();
		// if the image is larger than the maximum, figure it out how to scale it correctly
		if((this.bigImage.src.width>this.maxWidth)||(this.bigImage.src.height>this.maxHeight)){
			this.scale = (this.bigImage.src.height/this.maxHeight)>(this.bigImage.src.width/this.maxWidth) ? this.bigImage.src.height/this.maxHeight : this.bigImage.src.width/this.maxWidth;
			this.bigImage.nheight=this.bigImage.src.height/this.scale;
			this.bigImage.nwidth=this.bigImage.src.width/this.scale;
		}else{
			this.bigImage.nheight=this.bigImage.src.height;
			this.bigImage.nwidth=this.bigImage.src.width;
		}
		this.bigImage.height = (this.bigImage.nheight<500) ? 500 : this.bigImage.nheight.toInt() ;
		this.bigImage.width = (this.bigImage.nwidth<600) ? 600 : this.bigImage.nwidth.toInt() ;
		
		// center the image inside the frame
		this.bigImage.left = (1000-this.bigImage.width)/2;
		
		this.bigImage.close.setStyles({'top':this.scroll+50, 'width':this.bigImage.width-8, 'left':this.bigImage.left, 'display':'block'});
		
		// set height, width, src, center image and display it.
		this.bigImage.setStyles({'top':this.scroll+90,'width':this.bigImage.width,'left':this.bigImage.left,'display':'block'});
		this.bigImage.image.set({'src': this.bigImage.src.src, 'width': this.bigImage.nwidth, 'height': this.bigImage.nheight});
		
		this.loading.setStyles({'display':'none'});
		this.bigImage.setStyles({'display':'block'});
		this.bigImage.close.setStyles({'display':'block'});
		this.bigImage.image.setStyles({'display':'block'});
		if(type=='left'){
			this.bigImage.link.setStyles({'display':'block'});
			this.bigImage.caption.setStyles({'display':'block'});
		}else if(type=='ad'){
			this.bigImage.header.setStyles({'display':'block'});
			this.bigImage.link.setStyles({'display':'block'});
			this.bigImage.caption.setStyles({'display':'block'});
			this.bigImage.date.setStyles({'display':'block'});
		}
	},
	
	createProductImages: function(){
		// get all of the tr tags inside of the main content of page
		this.pis = this.center.getElements('tr');
		// loop through all of the trs
		this.pis.each(function(pi,l){
			// if it's an product Image
			if(pi.hasClass('productImage')){
				// the first image and link get links
				pi.a   = pi.getElements('a');
				if(pi.a.length){
					pi.a[0].onclick   = this.piClick.pass(l,level3Setup);
				}
			}
		},level3Setup);
	},
	
	centerLoop: function(){
		this.center.divs = this.center.getElements('div');
		this.center.divs.each(function(div,i){
			// get all of the links for div
			div.a   = div.getElements('a');
			if(div.hasClass('ad')){
				// get the ad images
				div.img = div.getElements('img');
				// the first image and link get links
				div.img[0].onclick = div.a[0].onclick = this.adClick.pass(i,level3Setup);
			}else if(div.hasClass('imgleft')){
				// if there are anchors, link the first one
				if(div.a.length){
					div.a[0].onclick   = this.imgLClick.pass(i,level3Setup);
				}
			}else if(div.hasClass('brand')){
				// loop through all of the brand links
				div.a.each(function(a,m){
					// get it's target, and if it opens in a new window, set its link
					a.target = a.get('target');
					if (a.target.test("blank")){
						a.onclick = this.brandClick.pass([i,m],level3Setup);
					}
				},level3Setup);
			}
		},level3Setup);
	},
	
	piClick: function(pi){
		this.myPI=pi;
		this.loadFrame('pi');
		return false;		
	},
	
	adClick: function(ad){
		this.myAd=ad;
		this.loadImage('ad');
		return false;
	},
	
	imgLClick: function(imgL){
		this.myImgL=imgL;
		this.loadFrame('imgL');
		return false;		
	},
	
	brandClick: function(brand,link){
			this.myBrand = brand;
			this.myLink = link;
			this.loadFrame('brand');
			return false;
	},
	
	loadFrame: function(type){
		// we are probably scrolled down the screen a bit. figure out where that is.
		this.scroll =  document.window.getScroll().y;
		// set the loading screen's new top
		this.loading.setStyle('top',this.scroll+50);
		this.iframeContainer.setStyle('top',this.scroll+50);
		// show the overlay & the loading screen while we load the image
		this.overlay.setStyles({'display':'block','height':this.frame.height}); 
		this.loading.setStyles({'display':'block'});
		//this.iframeContainer.frame.onload = this.viewFrame.pass(type,level3Setup);
		
		if(type=='pi'){
			this.fa = this.pis[this.myPI].a[0];
		}else if(type=='imgL'){
			this.fa = this.center.divs[this.myImgL].a[0];
		}else if(type=='brand'){
			this.fa = this.center.divs[this.myBrand].a[this.myLink];
		}
		// load the image.
		//this.iframeContainer.frame.src = this.fa.href;
		this.viewFrame();
	},
	
	//viewFrame: function(type){
	viewFrame: function(){
		// if there already is an iFrame, destroy it
		if(this.iframeContainer.frame) this.iframeContainer.frame.destroy();
		// create an iFrame with the correct source, inject it at the top of the iFrameContainer DIV
		this.iframeContainer.frame = new IFrame({'id':'frameContainerFrame','src':this.fa.href}).inject(this.iframeContainer,'top');
		// hide the loading screen and display the main image container
		this.loading.setStyles({'display':'none'});
		this.iframeContainer.setStyles({'display':'block'});
		this.iframeContainer.frame.setStyles({'display':'block'});
		this.iframeContainer.close.setStyles({'display':'block'});
	},
	
	close: function(){
		// hide everything
		this.overlay.setStyles({'display':'none'});
		this.loading.setStyles({'display':'none'});
		this.bigImage.setStyles({'display':'none'});
		this.bigImage.close.setStyles({'display':'none'});
		this.bigImage.header.setStyles({'display':'none'});
		this.bigImage.link.setStyles({'display':'none'});
		this.bigImage.image.setStyles({'display':'none'});
		this.bigImage.caption.setStyles({'display':'none'});
		this.bigImage.date.setStyles({'display':'none'});
		this.iframeContainer.setStyles({'display':'none'});
		this.iframeContainer.setStyles({'display':'none'});
		this.iframeContainer.setStyles({'display':'none'});
	},
	
	leftPDFs: function(){
		this.left.a = this.left.getElements('a');
		this.left.a.each(function(a){
			if (a.href.test(".pdf")){
				a.target="_blank";
			}
		});
	}
};