var xm_ci;


	Event.observe(window, 'load', function() {
		
		new zoomImage();
		xm_ci = new collectionImage();	
	}, false);


	function thisMovie(movieName) {
		
	    if (navigator.appName.indexOf("Microsoft") != -1) {
		// ms?
	        return window[movieName];
	    }
	    else {
	    	
	        return document[movieName];
	    }
	}



	/**
	* 	Collection image
	*
		searches all items with the class: collection image
		Stores them in an array
		Displays the images one by one
	*/	
	collectionImage = Class.create();
	collectionImage.prototype = {
		
		collectionPaths: [],
		coll_array: [], // array with all the image items
		 
		initialize: function (itemClass){
			 this.coll_array = document.getElementsByClassName("collection_image");	
			
			// remove the visual element
				var item = $('collection_image_box');
								
				if (item){
					var myPar = item.parentNode;
					$(myPar).removeChild(item);
				}
				
			if (0 < this.coll_array.length) {
				
				for (var i = 0; i < this.coll_array.length; i++){
					var obj = this.coll_array[i];
					
					if(true == this.ci_display(i) ){
						// initial image is enlarged
						break;
					}
					 
				}
			
			}
			
			// enlarge_text
		
		},
		
		ci_display: function (nr){
			// check if array
			if (0 > this.coll_array){
				alert("no image data");
			}
			var obj = this.coll_array[nr];
			
			// remove thumbnail fron the obj
			img_thumb = obj.getElementsByTagName('img')['0'];
			if (img_thumb){
				var myPar = img_thumb.parentNode;
				$(myPar).removeChild(img_thumb);
			}
			
			obj = obj.getElementsByTagName('a')['0'];
			
			// alert(obj.href);
			// place image	
			var imgLoc = $('portfolio_image');
			if (imgLoc){
				// remove old image if present
				var old_img = $("image_show");
				if (old_img){
					var myPar = old_img.parentNode;
					$(myPar).removeChild(old_img);
				}
				
				var imgPath = obj.href;
				
				/// alert('img' + obj.href );
				// element was found
				var item = Builder.node('img', {'src': imgPath, 'class': 'image_show', 'id': 'image_show'}, ''); // image
				
				imgLoc.appendChild(item);
			}
			
			// place text
			var textLoc = $("portfolio_text");
			if (textLoc){		
				if (obj.text == undefined){
					textLoc.innerHTML = '';
				}else{	
					textLoc.innerHTML = obj.innerHTML;
				}
			}			
			
			// update btn link
			
			// BUTTON FOR NEXT
			var btn_next = $('xmic_btn_next');
			if (btn_next){
			
				var linkobjs = btn_next.getElementsByTagName('a');
				// check if hyperlink objs are found
				if (0 < linkobjs.length){
					for (var i = 0; i < linkobjs.length; i++){
						var obj = linkobjs[i];
						
						var next = nr+1;
						
						if ( (next) >= this.coll_array.length){
							// new number is higher than the image count
							btn_next.style.visibility = "hidden";
						}else{
							btn_next.style.visibility = "visible";
							// 
//							obj.href = "javascript: xm_ci.ci_display(" + next + "); "
							obj.href = "javascript: xm_ci.hellow(" + next + "); "
						}
						//alert(obj.href);
					}
				}
			}
			
			// BUTTON FOR PREVIOUS
			var btn_prev = $('xmic_btn_prev');
			if (btn_prev){
			
				var linkobjs = btn_prev.getElementsByTagName('a');
				// check if hyperlink objs are found
				if (0 < linkobjs.length){
					for (var i = 0; i < linkobjs.length; i++){
						var obj = linkobjs[i];
						
						var prev = nr-1;
						
						if ( (prev) < 0){
							// new number is higher than the image count
							btn_prev.style.visibility = "hidden";
						}else{
							btn_prev.style.visibility = "visible";
							// 
//							obj.href = "javascript: xm_ci.ci_display(" + next + "); "
							obj.href = "javascript: xm_ci.hellow(" + prev + "); "
						}
						//alert(obj.href);
					}
				}
			}
			
			
			
			
			
			return 1;
		} // end display_photo_text
		,hellow: function (val){
			this.ci_display(val);
		}
		
	} // end collection image





	
	/**
	* 	Slide Thumb
	*
	*/	
	slideThumb = Class.create();
	slideThumb.prototype = {
	
		initialize: function (itemClass){
			var zoomImg = document.getElementsByClassName("slideThumb");			
			var paths = '';
			if (zoomImg.length>0) {
				for (var i = 0; i < zoomImg.length; i++){
					var obj = zoomImg[i]
					
					this.zoomPaths[i] = zoomImg[i].href;
					zoomImg[i].href = '';
					zoomImg[i].target = "_self";
					
					this.setEvent(zoomImg[i], i);
				}
			}
		}
	}
	
	
		/**
		* 	ZOOM IMAGE
		*
		*/	
		zoomImage = Class.create();
		zoomImage.prototype = {
		
		zoomPaths: [],
		zoomTitle: [],
		zoomDesc: [],
		
		zoomCurrent: 0,
		zoomItemTotalCount: 0,
		
		eZoomBg: 0,
		
		eZoomContain: 0,
		eZoomImage: 0,
		
		eZoomTitle: 0,
		eZoomDescr: 0,
		
		eZoomPrev: 0,
		eZoomNext: 0,
		/**
		
		search all elements by className an rewrite function
		
		*/
		initialize: function (itemClass){
		
			// -> detect first node
			var first =  document.getElementsByClassName('cnText');
			if (first[0] == undefined){
				var first = document.getElementsByClassName('cnImgColl');
				if (first[0] == undefined){
					var first = document.getElementsByClassName('cnPhoto');
					
					if (first[0] == undefined){
						// no content match
						return;
					}
				}
			}
			
			//-> from this node step one up to get the container
			var container = first[0].parentNode;
			
			if (container == undefined){
				// alert('no container');
				return;
			}else{
				// clear memory
				// first = null;
			}
			
			this.zoomItemTotalCount = 0;
			
			//-> container loop over each element from top to bottom and search for images
			var obs = container.childNodes;					
			for (var i = 0; i < obs.length; i++){
				var content = obs[i];
				
				//alert(obs.length +'obs ' + content.className)
				
				// content.innerHTML = "blup";
				var title = '';
				var desc = '';
				
				// check in obj if either xm_zoom_overlay or imgBox is present	 	
				var xBox = getFirstChildNodeByClass(content, "imgBox"); // their can only be one
				
				//--> try to get image that is not nested
				if (xBox != undefined){
					//-> get image obj
					var xImg = getFirstChildNodeByClass(xBox, "xm_zoom_overlay");
					// get title if any
					var tmpTitle = getFirstChildNodeByClass(xBox, 'img_title');
					if (tmpTitle){
						title = tmpTitle.innerHTML;
					}
					// get description if any
					var tmpDesc = getFirstChildNodeByClass(xBox, 'img_desc');
					if (tmpDesc){
						desc = tmpDesc.innerHTML;
					}
				}else{
					var xImg = getFirstChildNodeByClass(content,"xm_zoom_overlay");
				}
				
				// if image rewrite behaviour
				if (xImg != undefined){
					
					//--> add href to storage array
					this.zoomPaths[this.zoomItemTotalCount] = xImg.href;
					this.zoomTitle[this.zoomItemTotalCount] = title;
					this.zoomDesc[this.zoomItemTotalCount] = desc;
					
					//-> ? change class to prevent double detect
					//-> NOTE: remove ?		
					xImg.className = 'xmZoomOverlay';
					//-> click action is replace by listner
					xImg.removeAttribute('href');
					xImg.removeAttribute('target');
					
					// set click event
					this.setEvent(xImg, this.zoomItemTotalCount);	
				
					// -> set next count
					this.zoomItemTotalCount++;
				
				}
				
			};
			
			
			
			// CORRECT TOTAL COUNT
			this.zoomItemTotalCount -= 1;	
			
			
		},
		
		setEvent: function(item, i) {
			Event.observe(item, 'click', this.iZoom.bindAsEventListener(this, item, i), false);
		},
		
		iZoom: function(obj, item, i){
		
			this.zoomCurrent = i;
			
			this.zoomPop(item, i);
		},
		
		iZoomNext: function(obj, item, i){
			
			this.zoomCurrent += 1;
			
			if (this.zoomCurrent > this.zoomItemTotalCount){
				this.zoomCurrent =  this.zoomItemTotalCount;
			}
			
			
			this.zoomPop(item, this.zoomCurrent);
		},
		
		iZoomPrev: function(obj, item, i){
		
			this.zoomCurrent -= 1;
			
			if (this.zoomCurrent < 0){
				this.zoomCurrent =  0;
			}
			
			this.zoomPop(item, this.zoomCurrent);
		},
		
		prepStage: function(imgPath){
		
				
				ezBg = Builder.node('div', {'class': 'zoomPop','id': 'zoomPop'}, ' ');
				
				ezCont = Builder.node('div',	{'class': 'zoomPopImg','id': 'zoomPopImg', 'style': ' cursor: pointer;  '},''); // image
			
			
				ezImage = Builder.node('img', {'src': imgPath, 'class': 'zoomImage', 'id' : 'zoomImage', 'style' : ' visibility: hidden; cursor: pointer;  '}, ''); // image
				// add interaction
				// close the overlay when clicked				
				Event.observe(ezBg, 'click', this.close.bindAsEventListener(this), false);
				
				// attach action
				Event.observe(ezImage, 'click', this.close.bindAsEventListener(this), false);
				
				
				ezTitle = Builder.node('div', {'class':'zoomTitle', 'id':'zoomTitle'}, '');
				 
				ezDescr = Builder.node('div', {'class':'zoomDesc', 'id':'zoomDesc'}, '');
				
				ezPrev = Builder.node('div', {'class':'prevZoomImg', 'id':'prevZoomImg', 'style': ' cursor: pointer;  '}, '');
				ezNext = Builder.node('div', {'class':'nextZoomImg', 'id':'nextZoomImg', 'style': ' cursor: pointer;  '}, '');
				// show prev image				
				Event.observe(ezPrev, 'click', this.iZoomPrev.bindAsEventListener(this), false);
				// show next image			
				Event.observe(ezNext, 'click', this.iZoomNext.bindAsEventListener(this), false);
				
				ezCont.appendChild(ezImage);
				// add descriptions
				ezCont.appendChild(ezTitle);
				ezCont.appendChild(ezDescr);
				// add next and prev button
				ezCont.appendChild(ezPrev);
				ezCont.appendChild(ezNext);
				
				// attach to stage
				document.body.appendChild(ezBg);
				document.body.appendChild(ezCont);
				

		},
		/**
		build image 
		*/
		zoomPop: function(item, i){
			
			var imgPath = this.zoomPaths[i];
			var imgTitle = this.zoomTitle[i];
			var imgDesc = this.zoomDesc[i];
			
			
			// check if element are on stage
			var zoomImage = $('zoomImage');
			
			if (zoomImage == undefined){
			
						this.prepStage(imgPath);
			

			}
							// ref
				this.eZoomBg = $('zoomPop');
							
				this.eZoomContain = $('zoomPopImg');
				this.eZoomImage = $('zoomImage');
				this.eZoomTitle = $('zoomTitle');
				this.eZoomDesc = $('zoomDesc');
					
				this.eZoomNext = $('nextZoomImg');
				this.eZoomPrev = $('prevZoomImg');
				
			// -> objects are on stage
				
			var nwImg = new Image();
			nwImg.src = imgPath;
				
			this.eZoomTitle.innerHTML = imgTitle;
			
			this.eZoomDesc.innerHTML = imgDesc;
				
			
			
			// NEXT PREV CLICK ACTIONS		
			if (i >= this.zoomItemTotalCount){
				this.eZoomNext.style.visibility = 'hidden';
			}else{
				this.eZoomNext.style.visibility = 'visible';
			}
			
			if (i <= 0){
				this.eZoomPrev.style.visibility = 'hidden';
			}else{
				this.eZoomPrev.style.visibility = 'visible';
			}
			
			if (i < this.zoomItemTotalCount){
				// if next image make clickable
			}
		
			// crop image if it is large
			Event.observe(nwImg, 'load', this.imageSize.bindAsEventListener(this, nwImg), false);	
			
		},
		
		imageSize: function(obj, nwImg){
		
			var w = nwImg.width; // item.clientWidth;
			var h = nwImg.height; // item.clientHeight;
			
			
			this.eZoomImage.src = nwImg.src; // imgPath;
						
			var docw = document.body.clientWidth;
			var doch = document.body.clientHeight;
			
			if (w > docw){
				this.eZoomBg.style.width = (w + 20);
			}else{
				this.eZoomBg.style.width = docw;
			}
			if (h > doch){
				this.eZoomBg.style.height = (h + 20);
			}else{
				if (isIE()){
					this.eZoomBg.style.height = document.body.height;
				}else{
					//this.eZoomBg.style.height = document.clientHeight;
					this.eZoomBg.style.height = document.body.height;
				}
			}

			// CROSS CALC NEW IMAGE SIZE
			if ( (h > doch - 40) || (w > docw - 40) ){
			
				// OVERSIZED PICTURES
				var percw = ( (docw - 150) * 100 / w );
				if (percw > 100){
					perw = 100;
				}
				var perch = ( (doch - 150) * 100 / h );
				if (perch > 100){
					perch = 100;
				}
				// use the smallest
				if (percw < perch){
					// use width
					var nww = this.eZoomImage.width = (w * percw / 100);
					var nwh = this.eZoomImage.height = (h * percw / 100);
					
					this.eZoomContain.style.width = (w * percw / 100);
					
				}else{
					var nww = this.eZoomImage.width = (w * perch / 100);
					var nwh = this.eZoomImage.height = (h * perch / 100);
					
					this.eZoomContain.style.width = (w * perch / 100);
				}
			}else{
				// SMALLER THAN STAGE
				var nww = this.eZoomImage.width = w;
				var nwh = this.eZoomImage.height = h;
				
				this.eZoomContain.style.width = w;
			
			}
			this.eZoomContain.style.posistion = 'absolute';
			this.eZoomContain.style.left = ( (docw / 2) - (nww / 2) );
			this.eZoomContain.style.top = ( (doch / 2) - (nwh / 2) );
			
			this.eZoomTitle.style.width = nww;
			this.eZoomDesc.style.width = nww;
			
			this.eZoomImage.style.visibility = 'visible';
			
		},
		
		
		
		zoomPlus: function (obj){
		
			// alert('zoom Plus');
			
		},
		
		close: function (obj){
						// closes open zoomPop windows
						var pw = document.getElementsByClassName('zoomPop');											
						if (1 <= pw.length){ // window exist
							
							for (var i = 0; i < pw.length; i++){								
								var myPar = pw[i].parentNode;
						   		$(myPar).removeChild(pw[i]);						   		
							}
						}
						// closes open zoomPop windows
						var pw = document.getElementsByClassName('zoomPopImg');											
						if (1 <= pw.length){ // window exist
							for (var i = 0; i < pw.length; i++){
								var myPar = pw[i].parentNode;
						   		$(myPar).removeChild(pw[i]);						   		
							}
						}
		}
	}

	function popthisup(url, name, newWidth, newHeight) { /* , height='150', width='150', toolbar='yes', directories='no', status='no', scrollbars='no', resizable='yes' */ 
		var dim = "width=" + newWidth + ", height=" + newHeight;
		newwindow=window.open(url,'name=' +name, 'width='+newWidth+',height='+ newHeight +', resizable=yes, scrollbars=yes' )
		if (window.focus) {newwindow.focus()}
		return false;
	}

/* general helper */
	function getChildNodeById(obj, idName){
					var items = obj.childNodes;					
				   for (var i = 0; i < items.length; i++){
					// get identifiers -->		   // NOTE: List is live, Adding or removing children will change the list  // do something with each child as children[i]
				   	if (items[i].id == idName){
				   		return items[i];  	// pid = id for parant (link|ref)					   		
				   	}
				   };
	}
	
	function getChildNodeByName(obj, idName){
					var items = obj.childNodes;					
					for (var i = 0; i < items.length; i++){
					// get identifiers -->		   // NOTE: List is live, Adding or removing children will change the list  // do something with each child as children[i]
						if (items[i].name == idName){
							return items[i];  	// pid = id for parant (link|ref)					   		
						}
					};
					return;
	}
	function getFirstChildNodeByClass(obj, clssName){
	
					if (obj == undefined){
						return;
					}
					var items = obj.childNodes;					
					for (var i = 0; i < items.length; i++){
						// get identifiers -->		   // NOTE: List is live, Adding or removing children will change the list  // do something with each child as children[i]
						if (items[i].className == clssName){
							return items[i];  	// pid = id for parant (link|ref)					   		
						}
					};
					return;
					
					
					/*
					if (!obj){
						return 0;
					}
					if (!idName){
						return 0;
					}
					var items = obj.getElementsByClassName(idName);
					if (items.length > 0){
						return items[0];
					}else{
						return 0;
					}
					return;
					*/
	}

	function getChildinDepth(obj, idName){
			   var items = obj.childNodes;					
			   for (var i = 0; i < items.length; i++){
					// get identifiers -->		   // NOTE: List is live, Adding or removing children will change the list  // do something with each child as children[i]
					if (x = getChildNodeByName(items[i], idName)){
						return x;
					}else{
						if (x = getChildinDepth(items[i], idName) ){
							return x;
						}						
					}					
			   };
			   return 0;
	}
	
	function doc_id(elem){
		return document.getElementById(elem);
	}
	
	function xmSubmitSearch(obj, searchFieldID, baseAddress){ // search 
		if (searchFieldID){
			Q  = doc_id(searchFieldID).value;
			if (ba  = doc_id(baseAddress).value){
				
			}else{
				ba = baseAddress
			}
			go =  ba + '|search='+Q;
			window.location = go;
		}
	}
	
	/**
	 * 
	 * add button actions to the menu
	 * - uses existing css style width are set by id
	 * 
	 */
	function xmMouseOverActions(obj, action, url, newCssStyle){

		if (obj){ // check each element, in some cases af few of the vals will not exist
			switch (action){
				case 'over':
						var oid = obj.id;
						obj.id = newCssStyle;
						// obj.style.background ='#bbb';
						return oid;
				case 'down':
						// goto url;
						window.location = url;
						break;
				case 'out':
						// redo oldstyle
						if (newCssStyle){
							obj.id = newCssStyle;
						}
						//obj.id = newCssStyle;
				}// end sitch
		}// end object
		
	}