/**
* Nelsen's homepage tool
* gabriele.cafaro@iconmedialab.it
* make use of prototype.js library
* needs a properly formatted XML file
*/

function visualizer ()
{
	/* Setting option defaults */
	this.defaults = {
			//xmlfile:"../contenuti/htmlobjects/HomeH000/visualizer.xml", 
			 xmlfile:"visualizer.xml", 
			defaultDiv:"visualizer",
			defaultThemesDiv:"themes",
			defaultInspirationsDiv:"inspirations",
			defaultImageElement:"mainImage",
			startingTheme:0,
			startingThemePage:0,
			visibleThemes:4,			
			startingInspiration:0,
			inspirationPerPage:4,
			debug:false
			};
	/* Closure for this */
	var thisObject = this;
	 thisObject.temiById=new Array();
	this.actualThemePage=0;
	/* Initiate ImageFlow */
	this.init = function (options){
			/* Evaluate options */
			var optionsArray = new Array( 
					"defaultImageElement",
					"defaultInspirationsDiv",
					"xmlfile",
					"defaultDiv",
					"defaultThemesDiv",
					"startingTheme",
					"startingThemePage",
					"visibleThemes",
					"startingInspiration",
					"inspirationPerPage",
					"debug"
					);
			var max = optionsArray.length;
			for (var i = 0; i < max; i++){
				var name = optionsArray[i];
				this[name] = (options !== undefined && options[name] !== undefined) ? options[name] : thisObject.defaults[name];
				}
			/* gets all data and builds an appropriate array of xml object, each one with all its data */
			if (thisObject.debug) myalert("creo l'oggetto XMLHTTPRequest");
			new Ajax.Request(thisObject.xmlfile, {
					method:"get",
			  	onSuccess: function(response) {
			  		if (thisObject.debug) myalert("XML positivamente caricato");
			  		/** try different parsers */
								if (window.ActiveXObject){ //IE
									var doc = new ActiveXObject("Microsoft.XMLDOM");
									doc.async = "false";
									doc.loadXML(response.responseText);
								}else{
									var parser = new DOMParser();
									var doc = parser.parseFromString(response.responseText,"text/xml");
								}
			  				/** end alternative parser **/
			  			thisObject.xml=doc //response.responseXML;
					    thisObject.temi= response.responseXML.getElementsByTagName("tema");
							for (i=0;i<thisObject.temi.length;i++){
									thisObject.temiById[thisObject.temi[i].getAttribute("id")]=thisObject.temi[i];
									}
							if (thisObject.debug) myalert("trovo:"+thisObject.temi.length+"temi");
							thisObject.totalThemePages=thisObject.temi.length;
							thisObject.showThemes(thisObject.defaultThemesDiv,thisObject.startingThemePage,thisObject.visibleThemes)
							thisObject.selectedTheme=thisObject.startingTheme
							if (thisObject.startingTheme!=0){
								thisObject.loadTheme(thisObject.startingTheme);
								thisObject.currentTheme=thisObject.startingTheme
								}
							else {
									thisObject.loadTheme(thisObject.temi[0].getAttribute("id"));
									thisObject.currentTheme=thisObject.temi[0].getAttribute("id");
								}
								
								if (thisObject.startingInspiration!=0){
									thisObject.loadinsp(thisObject.currentTheme,thisObject.startingInspiration)
									
									}
							if (thisObject.temi.length>thisObject.visibleThemes)
								$("slider_down").style.display="block";
							else 
								$("slider_down").style.display="none";									
							}
			  	})	
			}

	this.showThemes=function (element,startpage,itempsperpage){
		if (thisObject.debug) myalert("carico "+itempsperpage+" temi a partire dalla posizione "+startpage);
		/* populates the element with all the appropriate */
		$(element).innerHTML="";
		thisObject.closeoverlay();
		for (i=startpage;i<startpage+itempsperpage;i++){
			var tid=thisObject.temi[i].getAttribute("id");
			var icona=thisObject.temi[i].getElementsByTagName("icon")[0];
			var iconaSrc=icona.getAttribute("src")
			var iconaSrcOver=icona.getAttribute("srcover");
			li=new Element("li");
			img=new Element("img", {
														id:"imgTema_"+tid,
														width:'122', height:'71',  src:iconaSrc } )
			a=new Element("a",{href:"javascript:visualizer.loadTheme('"+tid+"',23)"})

			img.observe("mouseover",function(iconsource){ return function(e){
							tid=this.id.split("_")[1];
							if(visualizer.currentTheme!=tid) this.src=iconsource} } (iconaSrcOver) )	
			img.observe("mouseout",function(iconsource){ return function(e){
								tid=this.id.split("_")[1];
							if(visualizer.currentTheme!=tid) this.src=iconsource } } (iconaSrc) )	
																 
			li.observe("mouseover",function(e){this.className="att"})									 
			li.observe("mouseout",function(e){this.className=""} )									 

			a.insert(img);
			
			li.insert(a);
			$(element).insert(li);
			}
			thisObject.actualThemePage=startpage;
		} 
	this.getElements=function(xml,nodename){

		var returnArray=new Array();
		for (i=0;i<xml.childNodes.length;i++){
			if (xml.childNodes[i].nodeName!=null &&  xml.childNodes[i].nodeName==nodename){
				returnArray.push(xml.childNodes[i])
				}
			}
			return returnArray;
		},	
	this.loadTheme=function(themeId){
		if (thisObject.debug) myalert("carico tema con id "+themeId);
		
		thisObject.closeoverlay();
		
		theme=this.getElementByIdMXL(thisObject.xml,themeId);
		nomeTema=theme.getAttribute("name");
		icona=this.getElements(theme,"icon");
		iconaSrc=icona[0].getAttribute("src");
		iconaSrcOver=icona[0].getAttribute("srcover");
		defaultimage=icona[0].getAttribute("default");
		$(thisObject.defaultImageElement).src=defaultimage;
		$(thisObject.defaultImageElement).width=823;
		$(thisObject.defaultImageElement).height=490;
		$("hscontainer").innerHTML="";		
		
		if (thisObject.currentTheme!= undefined){
			/* switch Off old theme */
			oldTheme=thisObject.getElementByIdMXL(thisObject.xml,thisObject.currentTheme);
			oldicona=this.getElements(oldTheme,"icon");
			oldiconaSrc=oldicona[0].getAttribute("src")
			oldiconaSrcOver=oldicona[0].getAttribute("srcover");
			if ($("imgTema_"+thisObject.currentTheme)!= undefined)
				$("imgTema_"+thisObject.currentTheme).src=oldiconaSrc;	
			}
		$("imgTema_"+themeId).src=iconaSrcOver;	
		if ($("sloganContainer")!=undefined){
			$("sloganContainer").innerHTML="<h1>"+nomeTema+"</h1>";
			}
		thisObject.currentTheme=themeId
		var inspirations=thisObject.getElements(theme,"ispirazione"); // theme.getElementsByTagName("ispirazione");
		$(thisObject.defaultInspirationsDiv).innerHTML="";
		//img=new Element("img", {width:'1',height:'150', style:"visibility:hidden"});
				//$(thisObject.defaultInspirationsDiv).insert(img);		
		for (i=0;i<inspirations.length;i++){
				var iid=inspirations[i].getAttribute("id");
				var icona=inspirations[i].getAttribute("thumb");
				var iconaover=inspirations[i].getAttribute("thumbOver");
				
				a=new Element("a",{href:"javascript:visualizer.loadinsp('"+themeId+"','"+inspirations[i].getAttribute("id")+"')" })

				img=new Element("img", {width:'98', 
													 			height:'56', 
													 			id:themeId+"_"+iid, src:icona} )

				img.observe("mouseover",function(iconsource){ return function(e){
								tid=this.id.split("_")[1];
								if(visualizer.currentinsp!=this.id) {this.className='att';this.src=iconsource}} } (iconaover) )	
								
				img.observe("mouseout",function(iconsource){ return function(e){
									tid=this.id.split("_")[1];
								if(visualizer.currentinsp!=this.id) {this.className='';this.src=iconsource }} } (icona) )														 			
													 			
				//img.observe("mouseover",function(e){
				//			if(visualizer.currentinsp!=this.id) this.className='att'})									 
				//img.observe("mouseout",function(e){
				//			if(visualizer.currentinsp!=this.id) this.className='' })			

				a.insert(img)
				$(thisObject.defaultInspirationsDiv).insert(a);
				}
				thisObject.fishEye = new FishEyeToolBar(thisObject.defaultInspirationsDiv);
	
				thisObject.fishEye.addEventListener("itemClick", function(e){
				var ele = Event.element(e);
				inspid= ele.getAttribute("id").split("_");
				thisObject.loadinsp(inspid[0],inspid[1])
						});
		},
	this.slideup=function(){
		//
			thisObject.actualThemePage--;			
			thisObject.showThemes(thisObject.defaultThemesDiv,thisObject.actualThemePage,thisObject.visibleThemes)

			if ((thisObject.actualThemePage+thisObject.visibleThemes)<  thisObject.totalThemePages)
				$("slider_down").style.display="block";
			else 
				$("slider_down").style.display="none";
			if (thisObject.actualThemePage==0)
				$("slider_up").style.display="none";
			else 
				$("slider_up").style.display="block";
			},
	this.slidedown=function(){
		thisObject.actualThemePage++;
		thisObject.showThemes(thisObject.defaultThemesDiv,thisObject.actualThemePage ,thisObject.visibleThemes)
	
		if ((thisObject.actualThemePage+thisObject.visibleThemes)<  thisObject.totalThemePages)
				$("slider_down").style.display="block";
			else 
				$("slider_down").style.display="none";
		if (thisObject.actualThemePage==0)
				$("slider_up").style.display="none";
			else 
				$("slider_up").style.display="block";
		},
		

	this.slideleft=function(starting){
			thisObject.showGallery(starting)

			if ((starting+3)<  thisObject.galimages.length)
				$("slider_right").style.visibility="visible";
			else 
				$("slider_right").style.visibility="hidden";
			if (starting==0)
				$("slider_left").style.visibility="hidden";
			else 
				$("slider_left").style.visibility="visible";
			},
			
	this.slideright=function(starting){
		thisObject.showGallery(starting)
		if ((starting+3)<  thisObject.galimages.length)
				$("slider_right").style.visibility="visible";
			else 
				$("slider_right").style.visibility="hidden";
		if (starting==0)
				$("slider_left").style.visibility="hidden";
			else 
				$("slider_left").style.visibility="visible";
		},		
			
	this.loadinsp=function(themeId,inspId){
		if (thisObject.debug) myalert("carico ispirazione "+inspId);
		theme=this.getElementByIdMXL(thisObject.xml,themeId);
		nometema=theme.getAttribute("name");
				
		thisObject.closeoverlay();
		inspiration=this.getElementByIdMXL(thisObject.xml,inspId);
		nome=inspiration.getAttribute("name");
		
		if ($("sloganContainer")!=undefined){
			$("sloganContainer").innerHTML="<h1>"+nomeTema+": "+nome+"</h1>";
			}
					
		img=inspiration.getElementsByTagName("image")[0].getAttribute("src");; 
		
		icona=this.getElements(theme,"icon");
		iconaSrc=icona[0].getAttribute("src")
		iconaSrcOver=icona[0].getAttribute("srcover");
		
		thumb=inspiration.getAttribute("thumb");
		thumbover=inspiration.getAttribute("thumbOver");

		if (thisObject.currentinsp!= undefined && $(thisObject.currentinsp)!=undefined){
			$(thisObject.currentinsp).className="";
			$(thisObject.currentinsp).src=thisObject.currentinspsrc;
			}
		
		$(themeId+"_"+inspId).className="att";
		thisObject.currentinsp=themeId+"_"+inspId;
		thisObject.currentinspsrc=thumb
		$(thisObject.defaultImageElement).src=img;
		$(thisObject.defaultImageElement).width=823;
		$(thisObject.defaultImageElement).height=490;
		hotspots=inspiration.getElementsByTagName("hotspot");
		$("hscontainer").innerHTML="";
		for (i=0;i<hotspots.length;i++){
				a=new Element("a", {
										
										href:"javascript:visualizer.raiseoverlay('"+hotspots[i].getAttribute('id')+"')"
										})
				img=new Element("img", {title:hotspots[i].getAttribute('title'),
													 			id:themeId+"_"+i, src:"img/ico_hotspot.png",
													 			style:"top:"+hotspots[i].getAttribute('top')+"px;left:"+hotspots[i].getAttribute('left')+"px;position:absolute;zindex:500"} )				


				a.insert(img);
				$("hscontainer").insert(a);
				


				}
		},
	this.viewImage=function(imagesrc){
		$('mainImageGallery').src=imagesrc
		}	
		
	this.raiseoverlay=function(id){
		if (thisObject.debug) myalert("richiamato overlay Hotspot"+id);
		
			$("overlayContainer").style.display="block";
			$("overlayElement").style.display="block"		
			hotspot=this.getElementByIdMXL(thisObject.xml,id);
			$("hotspotTitle").innerHTML=hotspot.getAttribute("title");
			contents=hotspot.getElementsByTagName("content");
			for(i=0;i<contents.length;i++){
					$("overlay_text_"+i).innerHTML=contents[i].childNodes[0].nodeValue
					}

			thisObject.galimages=hotspot.getElementsByTagName("imageGallery");

			
			$('mainImageGallery').src=thisObject.galimages[0].getAttribute("full");	
			this.showGallery(0);
			}
	this.showGallery=function(starting){
				if (thisObject.debug) myalert("gallery a partire dall'elemento"+starting);
			$("gallery").innerHTML="";
			if (starting>0)
						ahref="javascript:visualizer.slideleft( "+(starting-1)+" )"
				else 
						ahref="#"			
				a=new Element("a",{href:ahref})
				img=new Element("img", {
																id:"slider_left",
 													 			style:"padding:1px;margin:1px;",
													 			src:"../contenuti/htmlobjects/HomeH000/overlay_slide_left.gif"} );					
				a.insert(img);
				$("gallery").insert(a);
			for(i=starting;i<starting+3;i++){
				a=new Element("a",{href:"javascript:visualizer.viewImage('"+thisObject.galimages[i].getAttribute("full")+"')"})
				img=new Element("img", {
													 			width:'74', 
													 			height:'50', 
													 			style:"padding:1px;margin:1px;",
													 			src:thisObject.galimages[i].getAttribute("thumb")} );					
				a.insert(img);
				$("gallery").insert(a);
				}		
				
				if ((starting+3)<  thisObject.galimages.length) 
						ahref="javascript:visualizer.slideright( "+(starting+1)+" )"
				else 
						ahref="#"
				a=new Element("a",{href:ahref})
				img=new Element("img", {
																id:"slider_right",
 													 			style:"padding:1px;margin:1px;",
													 			src:"../contenuti/htmlobjects/HomeH000/overlay_slide_right.gif"} );					
				a.insert(img);
				$("gallery").insert(a);
			if ((starting+3)<  thisObject.galimages.length)
				$("slider_right").style.visibility="visible";
			else 
				$("slider_right").style.visibility="hidden";
			if (starting==0)
				$("slider_left").style.visibility="hidden";
			else 
				$("slider_left").style.visibility="visible";				
		}
	this.closeoverlay=function(){
		
			$("overlayContainer").style.display="none";
			$("overlayElement").style.display="none";
			}
	this.getElementByIdMXL=function(the_node,the_id) {	
	//get all the tags in the doc
	node_tags = the_node.getElementsByTagName('*');
	for (var i=0;i<node_tags.length;i++) {
	//is there an id attribute?
		if (node_tags[i].getAttribute('id')) {
			//if there is, test its value
			if (node_tags[i].getAttribute('id') == the_id) {
				//and return it if it matches
				return node_tags[i];
				
				}
			}
		}
	}
/* end of object definition */
}	

