
/******************************************************************************************************
jallery 1.0

jallery is a javascript image gallery created by Visionthing Digital Media Design in Venice, California
copyright 2010 Visionthing Digital Media Design

jallery main image transitions are powered by mootools which uses the MIT license
http://mootools.net/
http://www.opensource.org/licenses/mit-license.php

Visionthing contact:
http://www.visionthingmedia.com/
jallery@visionthingmedia.com
 
Visionthing Jallery is licensed to all users under the Creative Commons Attribution 3.0 License
http://creativecommons.org/licenses/by/3.0/

with the added requirement that all 2nd party jalleries retain the vistionthingmedia.com
test pattern and website link in the lower left hand corner, coolio?

********************************************************************************************************/
 
 
// Jallery Class

function Jallery() {
	
	var version = '1.0';
	var build = 'PXB11319639102010';
	
	var isIE  = (navigator.appVersion.indexOf("MSIE") != -1) ? true : false;
	
	var loading=false;
	var playing=false;
	var nextMain=0;
	var currentMainImage=-1;
	var jallerySizeFactor=1;
	var intervalID;
	var intervalSecondsCount=2;
	var show_player = true; /* makes Play / Stop button visible or not */
	
	var imageArray = [];
	var thumbArray = [];
	 
	var tweenMainFadeIn;
	var tweenMainFadeOut; 
	
	var ji;
	var jmc;
	var ani;
	var jtc;
	
	var imageMaxHeight;
	var thumbCount;
	var thumbSize;
	var thumbTopSpace;
	var thumbSpace;
	
	var thumbContainerTop;
	var thumbContainerLeft;
	var thumbContainerHeight;
	var thumbContainerWidth;
	var currentThumb=null;
	
	var galleryStripStart;
	
	var theJallery;
	
	/*****************************************************/
	
	/*****************************************************/
	 
	this.init = function(jallerySize, jalleryButtonColor, jalleryPlayer, JalleryBoxID){
		
		if(!document.getElementsByTagName){ return; }
		 
		if(jallerySize=='small')jallerySizeFactor=.5;
		else if(jallerySize=='medium')jallerySizeFactor=.8;	
		else if(jallerySize=='large')jallerySizeFactor=1;
		else jallerySizeFactor=1;
		
		if((jalleryButtonColor!='black')&&(jalleryButtonColor!='gray')&&(jalleryButtonColor!='white')) {
			
			jalleryButtonColor='black';
		}
		var rArrowGif = 'jallery_images/'+jalleryButtonColor+'_right.gif';
		var lArrowGif = 'jallery_images/'+jalleryButtonColor+'_left.gif';
		var loadingAni = 'jallery_images/'+jalleryButtonColor+'_loading_ani.gif';
		var playButtonGif = 'jallery_images/'+jalleryButtonColor+'_right.gif';
		var stopButtonGif = 'jallery_images/'+jalleryButtonColor+'_stop.gif';
		
		
		
		if(jalleryPlayer!='yes_player') show_player=false;
		
				
		thumbCount=11; 		// number of thumbs shown in thumb bar
		thumbSpace=5; 		// extra space between each thumb box in pixels	
		thumbSize=100; 		// max size of thumb in pixels for both width and height	
		imageMaxHeight=800; // max size of diplayed image in pixels in height
		imageMaxWidth=1200; // max size of diplayed image in pixels in height
		thumbTopSpace=40;	// padding space between thumb bar and displayed image in pixels
		
		var jalleryBoxWidth=((thumbCount*(thumbSize+thumbSpace)+50)*jallerySizeFactor);
		if(jalleryBoxWidth<imageMaxWidth) jalleryBoxWidth=imageMaxWidth;
		var jalleryBoxHeight=((imageMaxHeight+thumbSize+thumbTopSpace+50)*jallerySizeFactor);
		
		thumbSize=Math.floor(thumbSize*jallerySizeFactor);
		imageMaxHeight=Math.floor(imageMaxHeight*jallerySizeFactor);
		thumbTopSpace=Math.floor(thumbTopSpace*jallerySizeFactor);
		
		thumbContainerWidth=jalleryBoxWidth;
		thumbContainerHeight=thumbSize+thumbTopSpace;
		thumbContainerLeft=8; // padding for alicia
		thumbContainerTop=imageMaxHeight+thumbTopSpace+34; // adjust this magic number to close the space between the thumb gallery and the main image
		
		document.getElementById(JalleryBoxID).style.display='none';
		//document.getElementById(JalleryBoxID).style.visible='hidden';
		//document.getElementById(JalleryBoxID).style.top='0px';
		//document.getElementById(JalleryBoxID).style.left='0px';
		document.getElementById(JalleryBoxID).style.width=jalleryBoxWidth+'px';
		document.getElementById(JalleryBoxID).style.height=jalleryBoxHeight+'px';
		document.getElementById(JalleryBoxID).style.margin='0 auto';
		 
		theJallery=this;
	 
		// load imageArray from html page of anchors
	 
		var anchors = document.getElementById(JalleryBoxID).getElementsByTagName('a');
		 
		for (var i=0; i<anchors.length; i++){
			imageArray[i] = new Array();
			imageArray[i]['full'] = anchors[i].getAttribute('href');	
			imageArray[i]['link'] = anchors[i].getAttribute('rel');
			imageArray[i]['thumb'] = anchors[i].getElementsByTagName('img')[0].getAttribute('src');
			
			imageArray[i]['img_title'] = anchors[i].getElementsByTagName('img')[0].getAttribute('title');
			if(imageArray[i]['img_title']==null) imageArray[i]['img_title']='';
			
			imageArray[i]['img_credit_copyright'] = anchors[i].getElementsByTagName('img')[0].getAttribute('credit');
			if(imageArray[i]['img_credit_copyright']==null) imageArray[i]['img_credit_copyright']='';
		 
		}
		 
		var jalleryBoxPointer = document.getElementById(JalleryBoxID);
		jalleryBoxPointer.innerHTML = '';
		jalleryBoxPointer.style.position = 'relative';
		jalleryBoxPointer.style.textAlign = 'center';
		
	 
		var mainContainer = document.createElement("div");
		mainContainer.setAttribute('id','JalleryMainContainer');
		mainContainer.style.margin = '0 auto';
		mainContainer.align='center';
		mainContainer.style.top = '0px';
		mainContainer.style.left = '0px';
		mainContainer.style.display = 'block';
		jalleryBoxPointer.appendChild(mainContainer);
		

		var mainImage = document.createElement("img");
		mainImage.setAttribute('id','JalleryImage');
		mainImage.style.display = 'none';
		//mainImage.style.visibility = 'hidden';
		mainImage.style.cursor = 'pointer';
		mainImage.style.position = 'relative'; 
		mainContainer.appendChild(mainImage);
		
		mainImage.onload=function(){
			//alert("JalleryImage onload called");
			ani.style.visibility = 'hidden';
		}
		
		mainImage.onclick = function(){
			if(playing) theJallery.stopImages();
			else theJallery.loadNextMainImage();
		}
		
	
		
		var title = document.createElement("div");
		title.setAttribute('id','JalleryTitle');
		title.style.position = 'relative';
		title.style.textAlign = 'left';
		title.style.fontSize = Math.floor(18*jallerySizeFactor)+'px';
		title.style.lineHeight = Math.floor(18*jallerySizeFactor)+'px';
		mainContainer.appendChild(title);
		
		var credit = document.createElement("div");
		credit.setAttribute('id','JalleryCredit');
		credit.style.position = 'relative';
		credit.style.textAlign = 'right';
		credit.style.fontSize = Math.floor(14*jallerySizeFactor)+'px';
		credit.style.lineHeight = Math.floor(14*jallerySizeFactor)+'px';
		mainContainer.appendChild(credit);
		
		
		var loadingImg = document.createElement("img");
		loadingImg.setAttribute('id','JalleryLoadingAni');
		loadingImg.src = loadingAni;
		//loadingImg.style.display = 'none';
		//loadingImg.style.filter='alpha(opacity=80)';
  		//loadingImg.style.opacity= '.8';
		loadingImg.style.visibility = 'hidden';
		loadingImg.style.position = 'absolute';
		//loadingImg.style.top = Math.floor(jalleryBoxHeight/2)+'px';
		//loadingImg.style.left = Math.floor(jalleryBoxWidth/2)+'px';
		loadingImg.style.top = (imageMaxHeight/2)+'px';
		loadingImg.style.left = Math.floor(jalleryBoxWidth/2)-(40*jallerySizeFactor)+'px';	
		mainContainer.appendChild(loadingImg);
			
		
		var thumbContainer = document.createElement("div");
		thumbContainer.setAttribute('id','JalleryThumbContainer');
		//thumbContainer.style.margin = '0 auto';
		thumbContainer.style.display = 'block';
		
		thumbContainer.style.width = thumbContainerWidth+'px';
		thumbContainer.style.height = thumbContainerHeight+'px';
		thumbContainer.style.top = thumbContainerTop+'px';
		thumbContainer.style.left = thumbContainerLeft+'px';
		thumbContainer.align='center';
		thumbContainer.style.position = 'absolute';
		jalleryBoxPointer.appendChild(thumbContainer);
		
	 
	
		for (var i=0; i<imageArray.length; i++){
			thumbArray[i] = document.createElement("img");
			thumbArray[i].setAttribute('id','jalleryThumb_'+i);
			thumbArray[i].style.position = 'absolute';
			thumbArray[i].style.cursor = 'pointer';
			//thumbArray[i].style.display = 'none';
			thumbArray[i].style.visibility = 'hidden'
			thumbContainer.appendChild(thumbArray[i]);
			
			thumbArray[i].onload=function(){
				//alert("thumbArray[i].onload() called this complete= " +this.complete);		
				theJallery.loadThumb(this);
			}	
			
			thumbArray[i].onclick = function(){
				//alert("onclick() called this = " +this.id+ " loading: " +loading);
				if(playing) theJallery.stopImages();
				theJallery.loadThumbMainImage(this.id);
			}	
		}
		
/*
		var visionthing = document.createElement("div");
		visionthing.setAttribute('id','visionthing');
		visionthing.style.position = 'relative';
		visionthing.style.cursor = 'pointer';
		visionthing.style.top = Math.floor((thumbContainerHeight-(20*jallerySizeFactor)))+'px';
		visionthing.style.left =  Math.floor(10*jallerySizeFactor)+'px';
		visionthing.style.width =  Math.floor(30*jallerySizeFactor)+'px';
		visionthing.style.height =  Math.floor(30*jallerySizeFactor)+'px';
		//visionthing.style.textAlign = 'left';
		//visionthing.style.fontSize ='10px';
		//visionthing.innerHTML = "Visionthing";
		thumbContainer.appendChild(visionthing);
 

		var visionthingImage = document.createElement("img");
		visionthingImage.setAttribute('id','visionthingImage');
		visionthingImage.src = 'jallery_images/visionthing.gif';
		visionthingImage.title = 'Visionthing Digital Media Design Jallery';
		visionthingImage.alt = 'Visionthing Digital Media Design Jallery';
		//visionthingImage.style.display = 'none';
		visionthingImage.style.position = 'absolute';
		visionthingImage.style.top = '0px';
		visionthingImage.style.left = '0px';
		visionthingImage.style.width = Math.floor(24*jallerySizeFactor)+'px';
		visionthingImage.style.height = Math.floor(24*jallerySizeFactor)+'px';
		visionthingImage.style.cursor = 'pointer';
		visionthing.appendChild(visionthingImage);
		 
		visionthingImage.onclick = function(){
			theJallery.gotoVisionthing(); 
		}	
*/
	
	  	var rightArrow = document.createElement("img");
		rightArrow.setAttribute('id','rightArrowBt');
		rightArrow.src = rArrowGif;
		rightArrow.style.display = 'none';
		rightArrow.style.position = 'absolute';
		rightArrow.style.top = Math.floor((thumbSize/2)-20*jallerySizeFactor)+'px';
		rightArrow.style.left = Math.floor(thumbContainerWidth-(14*jallerySizeFactor))+'px';
		rightArrow.width = 10*jallerySizeFactor;
		rightArrow.height = 10*jallerySizeFactor;
		rightArrow.style.cursor = 'pointer';	
		thumbContainer.appendChild(rightArrow);
		rightArrow.onclick = function(){
			 
			theJallery.moveRight();
		}
		
		var leftArrow = document.createElement("img");
		leftArrow.setAttribute('id','leftArrowBt');
		leftArrow.src = lArrowGif;
		leftArrow.style.display = 'none';
		leftArrow.style.position = 'absolute';
		leftArrow.style.top = Math.floor((thumbSize/2)-20*jallerySizeFactor)+'px';
		leftArrow.style.left = Math.floor(5*jallerySizeFactor)+'px';
		leftArrow.width = 10*jallerySizeFactor;
		leftArrow.height = 10*jallerySizeFactor;
		leftArrow.style.cursor = 'pointer';
		thumbContainer.appendChild(leftArrow);
		leftArrow.onclick = function(){
			 
			theJallery.moveLeft();
		}
		
	
		 
		
		if(show_player) {
			var playButton = document.createElement("img");
			playButton.setAttribute('id','playButtonID');
			playButton.src = playButtonGif;
			playButton.style.display = 'none';
			playButton.style.position = 'absolute';
			playButton.style.top = Math.floor(-26*jallerySizeFactor)+'px';
			playButton.style.left = Math.floor(thumbContainerWidth/2)+'px';
			playButton.width = 16*jallerySizeFactor;
			playButton.height = 16*jallerySizeFactor;
			playButton.style.cursor = 'pointer';
			thumbContainer.appendChild(playButton);
			playButton.onclick = function(){
				 
				theJallery.playImages();
			}	
		}
		
		if(show_player) {
			var stopButton = document.createElement("img");
			stopButton.setAttribute('id','stopButtonID');
			stopButton.src = stopButtonGif;
			stopButton.style.display = 'none';
			stopButton.style.position = 'absolute';
			stopButton.style.top = Math.floor(-26*jallerySizeFactor	)+'px';
			stopButton.style.left = Math.floor(thumbContainerWidth/2)+'px';
			stopButton.width = 16*jallerySizeFactor;
			stopButton.height = 16*jallerySizeFactor;
			stopButton.style.cursor = 'pointer';
			thumbContainer.appendChild(stopButton);
			stopButton.onclick = function(){
				 
				theJallery.stopImages();
			}	
		}
		
		/*
 	 	if(!this.precheck()) {
			this.advise();
			return;
		}
		*/
		
	 	ani=document.getElementById('JalleryLoadingAni');
		ani.style.visibility = 'visible';
		this.showThumbs();
		this.loadThumbMainImage('jalleryThumb_0'); 
		 
		//document.getElementById(JalleryBoxID).style.visibility = 'visible'; 
		document.getElementById(JalleryBoxID).style.display = 'block'; 
		 
		//alert("Jallery.init() complete");
	}
	
	
	/*****************************************************/
		
	/*****************************************************/
	this.gotoVisionthing = function(){
		//alert("this.gotoVisionthing()");
		window.open( 'http://www.visionthingmedia.com');
	}
	
	/*****************************************************/
		
	/*****************************************************/
	this.playImages = function(){
		//alert("playImages");
		playing=true;
		this.loadNextMainImage();
		intervalID = setInterval(this.loadNextMainImage, 1000*intervalSecondsCount);
		document.getElementById('playButtonID').style.display = 'none';
		document.getElementById('stopButtonID').style.display = 'block';
	}
	
	/*****************************************************/
		
	/*****************************************************/
	this.stopImages = function(){
		//alert("stopImages");
		playing=false;
		clearInterval(intervalID);
		document.getElementById('stopButtonID').style.display = 'none';
		document.getElementById('playButtonID').style.display = 'block';
	}
 

	/*****************************************************/
		
	/*****************************************************/

	this.moveRight = function(){
		
		var imageArrayElement;
			 
		theJallery.hideThisThumb(galleryStripStart);	
			
		galleryStripStart++;
		if(galleryStripStart >= imageArray.length) galleryStripStart=0;
		
		for (var i=0; i<thumbCount; i++){
				
				if((i+galleryStripStart)>=imageArray.length) imageArrayElement=((i+galleryStripStart)-imageArray.length);
				else imageArrayElement=i+galleryStripStart;
				
				theJallery.showThisThumb(imageArrayElement, i);			 
			}
	}
	


	/*****************************************************/
		
	/*****************************************************/

	this.moveLeft = function(){
			
		var imageArrayElement;
		 		
		if((thumbCount-1+galleryStripStart)>=imageArray.length) imageArrayElement=((thumbCount-1+galleryStripStart)-imageArray.length);
		else imageArrayElement=thumbCount-1+galleryStripStart;
		
		theJallery.hideThisThumb(imageArrayElement);
		galleryStripStart--;
		if(galleryStripStart < 0) galleryStripStart=imageArray.length-1;
		
		for (var i=0; i<thumbCount; i++){
				
				if((i+galleryStripStart)>=imageArray.length) imageArrayElement=((i+galleryStripStart)-imageArray.length);
				else imageArrayElement=i+galleryStripStart;
				
				theJallery.showThisThumb(imageArrayElement, i);		
			}
	}


	/*****************************************************/
		
	/*****************************************************/

	this.showThisThumb = function(imageArrayElement, pos){
	//	alert("showThisThumb imageArrayElement:" +imageArrayElement+ " pos:" +pos);
		var showMe='jalleryThumb_'+imageArrayElement;	
		var thisThumb=document.getElementById(showMe);
			
		thisThumb.width=Math.floor(thisThumb.naturalWidth*jallerySizeFactor);
		thisThumb.height=Math.floor(thisThumb.naturalHeight*jallerySizeFactor);  
		var offset = Math.floor((thumbSize-thisThumb.width)/2)+8;	// padding with 8 px for Alicia special case 
		var position = (pos)*(thumbSize+thumbSpace);
		thisThumb.style.left = Math.floor((offset+position)+(18*jallerySizeFactor))+'px';
		//thisThumb.style.display = 'block';
		thisThumb.style.visibility = 'visible';
	}


	/*****************************************************/
		
	/*****************************************************/


	this.hideThisThumb= function(imageArrayElement){
 
		var thisThumb=document.getElementById('jalleryThumb_'+imageArrayElement).style.visibility = 'hidden';
	}

	/*****************************************************/
		
	/*****************************************************/

	this.loadNextMainImage= function(){
	
		if(loading) return;
	    loading=true;
	    if(isIE) document.getElementById('JalleryImage').style.cursor = 'default';
		 
	/*
		if(loading){
			 tweenMainFadeIn.cancel();
			 tweenMainFadeOut.cancel();
			loading=false;
			alert('loadNextMainImage() canceling tween');
		}
		else loading=true;
	*/		
		if(++nextMain >= imageArray.length) nextMain=0;
		//alert("nextMain=" +nextMain);
		
		/* fade the current thumb so it looks selected */
		
		if(currentThumb!=null) {
			//alert("loadThumbMainImage() called currentThumb = " +currentThumb);
			if(isIE) currentThumb.style.filter = 'alpha(opacity=100)';
			else currentThumb.style.opacity = '1';
		}
		currentThumb=thumbArray[nextMain];	
		if(isIE) currentThumb.style.filter = 'alpha(opacity=50)';	 
		else currentThumb.style.opacity = '.5';
	
		
		// check, if strip of thumbs shows all images, don't move strip 
		if(thumbCount<imageArray.length) {
			
			var tempStripStart=galleryStripStart;
			if(++tempStripStart >= imageArray.length) tempStripStart=0;
		 
		
			if(nextMain!=tempStripStart) {
				
				for (var i=0; i<thumbCount; i++){
						
						if((i+galleryStripStart)>=imageArray.length) imageArrayElement=((i+galleryStripStart)-imageArray.length);
						else imageArrayElement=i+galleryStripStart;
						
						theJallery.hideThisThumb(imageArrayElement);	 
					}
				 
					galleryStripStart=nextMain;
					for (var i=0; i<thumbCount; i++){
							
						if((i+galleryStripStart)>=imageArray.length) imageArrayElement=((i+galleryStripStart)-imageArray.length);
						else imageArrayElement=i+galleryStripStart;
						
						theJallery.showThisThumb(imageArrayElement, i);	 
					}
			}
			else theJallery.moveRight();
		}
		 
		
		var imgNext = new Image();
		imgNext.onload=function(){
			
			var width=Math.floor(imgNext.width*jallerySizeFactor);
			var height=Math.floor(imgNext.height*jallerySizeFactor);
							
			theJallery.loadMainImage(nextMain, width, height);	 	 
		}
	 
		imgNext.src = imageArray[nextMain]['full'];
		ani.style.visibility = 'visible';
		//alert("this.loadNextMainImage called");
	}

	
	/*****************************************************/
		
	/*****************************************************/

	this.loadThumbMainImage= function(imageID){
		
	//alert("loadThumbMainImage() start");
		
		it = parseInt(imageID.slice(13));
		if(it==currentMainImage) return;	
	
	//alert("loadThumbMainImage() called imageID = " +imageID+" int=" +it);
	
		if(loading) return;
		loading=true;

	/*
		if(loading){
			if(tweenMainFadeIn!=null) tweenMainFadeIn.cancel();
			if(tweenMainFadeOut!=null) tweenMainFadeOut.cancel();
			loading=false;
			alert('loadThumbMainImage() canceling tween');
		}
		else loading=true;
	*/
	
	
		/* fade the current thumb so it looks selected */
		
		if(currentThumb!=null) {
			//alert("loadThumbMainImage() called currentThumb = " +currentThumb);
			if(isIE) currentThumb.style.filter = 'alpha(opacity=100)';
			else currentThumb.style.opacity = '1';
		}
		currentThumb=thumbArray[it];	
		if(isIE) currentThumb.style.filter = 'alpha(opacity=50)';	 
		else currentThumb.style.opacity = '.5';
		
	
		var imgNext = new Image();
		imgNext.onload=function(){
	 
			var width=Math.floor(imgNext.width*jallerySizeFactor);
			var height=Math.floor(imgNext.height*jallerySizeFactor);
			
			theJallery.loadMainImage(it, width, height);	 	 
		}
		
		imgNext.src = imageArray[it]['full'];	
		nextMain=currentMainImage=it;
		ani.style.visibility = 'visible';
		//alert("this.loadThumbMainImage called");
	}
	
	/*****************************************************/
	
	/*****************************************************/
	
	this.loadMainImage = function(imageNum, width, height){
		
		//alert("loadMainImage() image width=" +width);
		
		if(isIE)  {
			ji=document.getElementById('JalleryImage');
			if(ji==null) alert("FAIL! loadMainImage.showMainImage() ji=" +ji);
			tweenMainFadeOut = new Fx.Tween(ji, {property: 'opacity', duration: 300, link: 'none'}); 
		}
		else {
			tweenMainFadeOut = new Fx.Tween(document.getElementById('JalleryMainContainer'), {property: 'opacity', duration: 300, link: 'none'});
		}
		
		  	tweenMainFadeOut.addEvent('complete', function(){
							//ani.style.visibility = 'visible';
							theJallery.showMainImage(imageNum, width, height);	
       				 		//alert('tweenMainFadeOut complete');
   			 			});
		 
			if(isIE) tweenMainFadeOut.start(1, .001);
			else  tweenMainFadeOut.start(0);
			//ani.style.visibility = 'visible';
			
			currentMainImage=imageNum;
	}
	
	/*
	this.precheck=function(){ if(document.getElementById('visionthing')==null)return(false); if(document.getElementById('visionthingImage')==null)return(false); return(true);}
	this.advise=function(){alert("this Jallery fails link test, please include visionthing site link in jallery, thanks!");}
	*/
	/*****************************************************/
	
	/*****************************************************/
	
	this.showMainImage = function(imageNum, width, height) {
  		  
		jmc=document.getElementById('JalleryMainContainer');
		ji=document.getElementById('JalleryImage');
		
		//alert("this.showMainImage() imageNum:"+imageNum+ " width:" +width+ " height:" +height);
		 
		ji.src = imageArray[imageNum]['full'];	
		ji.style.display = 'block';
		ji.style.cursor = 'pointer';
		ji.style.width = width+'px';	
		ji.style.height = height+'px';
		//ji.setAttribute('width', width.toString());
		//ji.setAttribute('height', height.toString());
		
		// marta request to have all imnages at the top, not centered
		//var topOffset = imageMaxHeight-height;
		var topOffset = 0;
		var title_top = 3;
		var credit_top = -12;
		
		if(topOffset>1) topOffset=Math.floor(topOffset/1.5);
		else topOffset=Math.floor(20*jallerySizeFactor);
		
		 
		//alert("this.showMainImage() topOffset=" +topOffset+ " imageNum=" +imageNum);
		
		ji.style.top = topOffset+'px';
		
		jmc.style.width = width+'px';	
		jmc.style.height = height+'px';
		
		document.getElementById('JalleryTitle').innerHTML = imageArray[imageNum]['img_title'];
		document.getElementById('JalleryTitle').style.top =  Math.floor((title_top*jallerySizeFactor)+topOffset)+'px';
		
		document.getElementById('JalleryCredit').innerHTML = imageArray[imageNum]['img_credit_copyright'];
		document.getElementById('JalleryCredit').style.top = Math.floor((credit_top*jallerySizeFactor)+topOffset)+'px';
	 
		 
	 	if(isIE)  {
			if(ji==null) alert("FAIL! this.showMainImage() ji=" +ji);
			tweenMainFadeIn = new Fx.Tween(ji, {property: 'opacity', duration: 600, link: 'none'});
		}
		else {
			tweenMainFadeIn = new Fx.Tween(jmc, {property: 'opacity', duration: 600, link: 'none'});
		}
		
		  tweenMainFadeIn.addEvent('complete', function(){
						ani.style.visibility = 'hidden';
						theJallery.addOnclick(imageNum, width);
						loading=false;
						if(isIE) ji.style.cursor = 'pointer'; 
						 
					//alert('tweenMainFadeIn complete');
					});
		 
			if(isIE) tweenMainFadeIn.start(.001, 1);
			else  tweenMainFadeIn.start(1);
	}
	
	
	/*****************************************************/
	
	/*****************************************************/
	
	this.addOnclick = function(imageNum, width) {	
		 
		//alert("loadMainImage.showMainImage.addOnclick()");
		
		if(imageArray[imageNum]['link']){
		 
			document.getElementById('JalleryImage').onclick = function(){
				location.href = imageArray[imageNum]['link'];	
			
			}
		} 
	}
	
	/*****************************************************/
	
	/*****************************************************/
	
	this.showThumbs= function() {
																																																																																																																																																																																																																																																																																																																																																																																							
		if(imageArray.length < thumbCount) thumbCount = imageArray.length;
		else {
			 
			document.getElementById('leftArrowBt').style.display = 'block';
			document.getElementById('rightArrowBt').style.display = 'block';
			
			if(show_player) document.getElementById('playButtonID').style.display = 'block';
		}
 
		galleryStripStart=0;
		
		var showMe;
		for (var i=0; i<imageArray.length; i++){
			showMe='jalleryThumb_'+i;
			document.getElementById(showMe).src = imageArray[i]['thumb'];
		}
	}
	
	/*****************************************************/
	
	/*****************************************************/
	
	this.loadThumb= function(thisThumb) {
				 
		//alert("thisThumb naturals w:" +thisThumb.naturalWidth+ "  h:" +thisThumb.naturalHeight);
 
		if(isIE) {
			//alert("complete? "+thisThumb.complete+ "  thumbArray["+it+"].onload=function() width: " +thisThumb.width+"    height " +thisThumb.height);
		
			if(!thisThumb.complete){ 
			
				window.setTimeout( function(){theJallery.loadThumb(thisThumb);}, 500 );
				return;
			} 
 
			if(thisThumb.width<=0){
				
				thisThumb.style.display = '';
				//thisThumb.style.visibility = 'visible';
				window.setTimeout( function(){theJallery.loadThumb(thisThumb);}, 500 );
				return;
			} 

			if((thisThumb.naturalWidth==null)||(thisThumb.naturalWidth==0)){
				
				thisThumb.naturalWidth=thisThumb.width;
				thisThumb.naturalHeight=thisThumb.height;
			}
		}
		else {	
		
			if(!thisThumb.complete){ 
			
				window.setTimeout( function(){theJallery.loadThumb(thisThumb);}, 500 );
				//alert("setting timeout");
				return;
			} 
			//alert("complete? "+thisThumb.complete+ "  thumbArray["+it+"].onload=function() width: " +thisThumb.width+"    height " +thisThumb.height);
		}
		
		var it = parseInt(thisThumb.id.slice(13));
		
		if((it>=galleryStripStart)&&(it<galleryStripStart+thumbCount)) {
			
			thisThumb.width=Math.floor(thisThumb.naturalWidth*jallerySizeFactor);
			thisThumb.height=Math.floor(thisThumb.naturalHeight*jallerySizeFactor);  
			var offset = Math.floor((thumbSize-thisThumb.width)/2)+8;	// padding with 8 px for Alicia special case 
			var position = (it)*(thumbSize+thumbSpace);
			thisThumb.style.left = Math.floor((offset+position)+(18*jallerySizeFactor))+'px';
			//thisThumb.style.display = 'block';
			thisThumb.style.visibility = 'visible';
		}
		else {
			//thisThumb.style.display = 'none';
			thisThumb.style.visibility = 'hidden';
		}
			 
	}
	 
/* end of Jallery class */	 
}
 
 
 


