/*Following js files are clubbed in this file:
1. ImageSet.js
2. image_gallery.js
3. StackedDeck.js
*/


/*----------------------------------------------------- ImageSet.js starts ---------------------------------------------------*/
if(detectBrowser.modernBrowser()){
try{
//
// Set of image ranges, each of which has a subset of images.
//

var ImageSet = Class.create();
Object.extend(ImageSet.prototype, Enumerable);
Object.extend(ImageSet.prototype,{
	// construct an image set.
	// @element is an element within which to seek out already-loaded sets in the DOM
	initialize:function(element){

		// parse a range string like startToken_INT_INT
		function parseRange(classNames,startToken){
			var tokens = classNames.find(function(item){ return (typeof(item)=="string" && item.indexOf(startToken)==0); });
			return {'start':parseInt(tokens.split("_")[1]),'end':parseInt(tokens.split("_")[2])};
		}

		// return a set of sets
		this.loadedsets = element.getElementsBySelector("ol.images").map(function(imageList){
			var classnames = $A(imageList.classNames());
			return {
				'range':parseRange(classnames,"range_"),
				'extents':parseRange(classnames,"extents_"),
				'images':imageList.getElementsBySelector("li.image").map(function(imageListElement){
					// if we have a placeholder image, just return a stub
					if ($A(imageListElement.classNames()).include("placeholder")) return {'placeholder':true};
					// return a fully-formed image if we have a real image
					var result = {
						
						'versions':{
							'thumbnail_small':imageListElement.getElementsBySelector("a.thumbnail_small")[0].readAttribute("href").strip()
							
						},
						'id':{
							'document_id':imageListElement.getElementsBySelector("a.thumbnail_small")[0].readAttribute("id").strip()
							
						}
					};
					imageListElement.getElementsBySelector("a").each(function(img){
						var imageKey = $A(img.classNames()).find(function(token){ // find first token matching INTxINT
							return token.split("x").length > 1 && parseInt(token.split("x")[0]) > -1 && parseInt(token.split("x")[1]) > -1;
						});
						// This image fits the pattern and is something like "1024x768". Append to result as another version.
						if(typeof(imageKey)!='undefined') result['versions'][imageKey] = img.readAttribute("href").strip();
					});
					return result;
				})
			};
		});
	},

	isRealImage:function(range,index){ // assumes range exists, assumes it is loaded
		return this.getRange(range)['images'][index]['placeholder']!=true;
	},

	getRangeIndex:function(range){	// assumes range exists
		for(var i=0;i<this.loadedsets.length;i++)
			if(ImageSet.prototype.compareRange(this.loadedsets[i]['range'],range))
				return i;
	},

	getRangeAfter:function(range){
		for(var i=0;i<this.loadedsets.length;i++)
			if(ImageSet.prototype.compareRange(this.loadedsets[i]['range'],range) && (i + 1 < this.loadedsets.length))
				return this.loadedsets[i + 1]['range'];
	},

	getRangeBefore:function(range){
		for(var i=0;i<this.loadedsets.length;i++)
			if(ImageSet.prototype.compareRange(this.loadedsets[i]['range'],range) && (i - 1 >= 0))
				return this.loadedsets[i - 1]['range'];
	},

	findRangeByImage:function(imageItem){
		var result;
		var matchingSet = this.loadedsets.find(function(loadedSet,i){ return loadedSet['images'].include(imageItem); });
		if(matchingSet) result = matchingSet['range'];
		// return undefined if not found
		return result;
	},

	// external code must be able to fetch the "first" range block. Return a range in format {start:int,end:int}
	getFirstRange:function(){
		return this.loadedsets[0]['range'];
	},

	// compare two ranges in format {start:int,end:int}, return true if they are the same
	compareRange:function(range1,range2){
		return typeof(range1)=='object' && typeof(range2)=='object' && range1!=null && range2!=null && parseInt(range1['start'])==parseInt(range2['start']) && parseInt(range1['end'])==parseInt(range2['end']);
	},

	getRange:function(range){
		var result = this.loadedsets.find(function(aSet){
			return ImageSet.prototype.compareRange(aSet.range,range);
		}.bind(this));
		
		if(!result){
			// TODO check if range is within the total extents, and load
		}
		
		return result;
	},

	loadRangeAsync:function(range,url,callbackFunc){
		console.debug("loadRangeAsync: loading range",range);
		// TODO load a range, run a callback function after finish.
		new Ajax.Request(url,{
			method:'get',
			onSuccess:function(transport){
				console.debug("results of query (transport object):",transport);
			}
		});
	},

	rangeLoaded:function(range){
		return typeof(this.loadedsets.find(function(aSet){ return ImageSet.prototype.compareRange(aSet.range,range); }.bind(this)))!='undefined';
	},

	// return all ranges in the entire extent, whether they are loaded or not.
	allRangesInExtent:function(iterator){
		var rangeLength = (parseInt(this.loadedsets[0]['range']['end']) - parseInt(this.loadedsets[0]['range']['start'])) + 1;
		// NB: this might break if rangelength is not a nice number like 10, 20, etc
		var rangeCeiling = Math.ceil(this.loadedsets[0]['extents']['end'] / rangeLength) * rangeLength;
		return $A($R(0,(rangeCeiling / rangeLength) - 1)).map(function(i){
			return {
				'start':(i*(rangeLength)) + 1,
				'end':((i+1)*(rangeLength))
			};
		});
	},

	// _each is a function required by the Enumerable mix-in
	// _each will iterate over each SUBSET of images, not all images
	_each: function(iterator) {
		for (var i = 0, length = this.loadedsets.length; i < length; i++) iterator(this.loadedsets[i]);
	}

});

}catch(err){}
}// end modern browser check

/*----------------------------------------------------- ImageSet.js ends -----------------------------------------------------*/

/*----------------------------------------------------- image_gallery.js starts -----------------------------------------------------*/
if(detectBrowser.modernBrowser()){

// Image Gallery is loaded by both the "full screen" image 
// gallery page and the normal image gallery page

var currentIndex=0;
var leftClick=false;

var galleryDocumentId=0;
var frmFullScreen=false;
var fullScreenImageIndex=0;
var deckPosition=0;
var imagePositioninDeck=0;
var innerDeckCnt=0;
var imgIndexinInnerDeck=0;

var ImageGallery = Class.create();
ImageGallery.prototype = {
	initialize:function(){
		
		this.container = $('image_gallery');
		if(!this.container) return;
		this.imageStackContainer = $('image_stack');
		this.imageContainer = $('gallery_image_area');
		this.captionContainer = $('caption_region');
		this.downloadContainer = $('download_image_box');
		this.toolbarContainer = $('gallery_toolbar');
		this.gridContainer = $('gallery_thumbgrid');
		this.gridContainerClose = $('gallery_thumbgrid_close');
		this.outsideCaptionContainer = $$('.image_gallery_fullscreen_outsidecaption')[0];
		
		/* This is added to keep the fullscreen item as current item when coming from Fullscreen image*/
        var index=getCookie("galleryDocId");
		if(index != null && index > 0){
			   galleryDocumentId=eval(index);
			   frmFullScreen=true;
			   setCookie("galleryDocId", 0, null, "/", null, null);
		}

		if(frmFullScreen){
			masterArrayBlockCurrentIndex=0;
			showView="Deck";
			fullScreenImageIndex=this.getFullScreenImageIndex();
            deckPosition=eval(fullScreenImageIndex/40);
			imagePositioninDeck=eval(fullScreenImageIndex%40);
			for(var i=1;i<=deckPosition;i++){
                  	 masterArrayBlockCurrentIndex++;
			}
			this.subDiv = $('sub');			
			 if(this.subDiv)
			 {
				 		 this.subDiv.innerHTML='';
						 document.getElementById("gallery_image_area").innerHTML='';
						 document.getElementById("download_image_box").innerHTML='';
						 document.getElementById("image_stack").innerHTML='';
									 
						 this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
 			  }
		}
        /* End of fullscreen item as current item when coming from Fullscreen image*/

    	this.imageSet = new ImageSet(this.container);
		
		//this.previousRange = this.currentRange; = this.imageSet.getFirstRange();
		this.previousRange = this.currentRange; 
		this.currentRange = this.imageSet.getFirstRange();
		if(leftClick){
			this.currentRange=this.imageSet.getRangeAfter(this.currentRange);
			this.currentRange=this.imageSet.getRangeAfter(this.currentRange);
			this.currentRange=this.imageSet.getRangeAfter(this.currentRange);
			//alert(this.currentRange.end);
		}
		this.endLabel = 0;
		this.imageIndex = 0;
        if(leftClick){
		   this.imageIndex=9;
        }

		/* This is added to keep the fullscreen item as current item when coming from Fullscreen image*/
        if(frmFullScreen){
			  innerDeckCnt=imagePositioninDeck/10;
			  imgIndexinInnerDeck=imagePositioninDeck%10;
			  for(var j=1;j<=innerDeckCnt;j++){
                  this.currentRange=this.imageSet.getRangeAfter(this.currentRange);
			  }
			  this.imageIndex=imgIndexinInnerDeck;
              frmFullScreen=false;
		}
         /* End of fullscreen item as current item when coming from Fullscreen image*/  

		// pixel widths for stack of image ranges
		this.setStackSizes = { 'hiddenSize':67, 'openSize':414 };
		// pixel widths for image stack
		this.rangeStackSizes = { 'hiddenSize':27, 'openSize':120 };
		// delay in milliseconds that it takes the stack to respond
		this.responseDelay = 100;

		// Possible display modes : normal, fullscreen. Possible states: normal, grid
		this.displayMode = ($A(this.container.classNames()).include("image_gallery_fullscreen"))?"fullscreen":"normal";
		this.stackedDecks = [];
		
		this.drawComponents();
		currentIndex=this.currentRange.start;
		if(leftClick){
			currentIndex=this.currentRange.end;
			leftClick=false;
		}
	},

   /* This is added to keep the fullscreen item as current item when coming from Fullscreen image*/
	getFullScreenImageIndex:function(){		
			for(var i=0;i<listOfImages.length;i++)
			{
				eachImage = new Array();
				eachImage = listOfImages[i];
				if(eachImage.documentId == galleryDocumentId)
				{
					//alert("before break:"+i);
					fullScreenImageIndex=i;
					break;
				}
			}
			return fullScreenImageIndex;
	},
    /* End of fullscreen item as current item when coming from Fullscreen image*/

	// return a stack of all sets
	getSetsStack:function(){
		var ul = new Element("ul");
		this.imageSet.each(function(dataset,i){
			// create deck panel with another stack of images inside of it
			var li = new Element("li",{'className':'setstackitem '+((i==0)?"active":"inactive")});
			var rangeStackUl = this.getRangeStack(dataset['range']);
			//this.imageStackContainer.appendChild(rangeStackUl);
			this.stackedDecks.push({
				'deck':(new StackedDeck(rangeStackUl.getElementsBySelector("li"),rangeStackUl,{'horizontal':true})),
				'range':dataset['range'],
				'deckIndex':i
			});
			if(i!=0){
				var rangetab_end = li.appendChild(new Element('div',{'className':'rangetab_end'}));
			}
			li.appendChild(new Element("span",{'className':'rangetitle'}).update(dataset['range']['start']+"-"+dataset['range']['end']));
			li.appendChild(rangeStackUl);
			ul.appendChild(li);
		}.bind(this));
		
		// add another panel at the end to 'cap' the set.
		var setsEndCap = new Element('li',{'className':'setstackitem inactive end_cap'});
		var endCaprangetab_end = setsEndCap.appendChild(new Element('div',{'className':'rangetab_end'}));
		setsEndCap.appendChild(new Element('span',{'className':'rangetitle'}).update(' '));

		
		[this.setStackSizes['hiddenSize'], this.setStackSizes['openSize'], this.responseDelay, "sideways", "imageset"].each(function(className){
			ul.addClassName(className);
		});
		return ul;
	},

	// create a stack of images for a given range
	getRangeStack:function(rangeToGet){
		var ul = new Element("ul");
		var imageSet = this.imageSet.getRange(rangeToGet);
		imageSet['images'].each(function(imageItem,i){
			if(imageItem['placeholder']==true){
				// do nothing.
			} else {
				// create deck panel with image and index inside of it
				var li = new Element("li",{'className':'stackitem '+((i==0)?"active":"inactive")});
				var img = li.appendChild(new Element("img",{'src':imageItem.versions.thumbnail_small,'alt':'Click here to view gallery image','title':'Click here to view gallery image'}));
				var span = li.appendChild(new Element("span",{}).update(rangeToGet['start']+i));
				// attach click handler to image
				Event.observe(li,'click',function(){
					//console.debug("Click detected in img");
					this.goToRangeAndImage(rangeToGet,i);
				}.bind(this));
				ul.appendChild(li);
			}
		}.bind(this));
		[this.rangeStackSizes['hiddenSize'], this.rangeStackSizes['openSize'], this.responseDelay, "sideways", "imagerange"].each(function(className){
			ul.addClassName(className);
		});
		return ul;
	},

	
	moveToImage:function(newImageIndex){
		rightClick=false;
        if(newImageIndex>this.imageIndex){
			rightClick=true;
		}else{
			//rightClick=false;
			leftClick=true;
		}

		var newRange = this.currentRange;
		if(newImageIndex<0 || newImageIndex>9) {
			newRange = (newImageIndex<0)?(this.imageSet.getRangeBefore(this.currentRange)):(this.imageSet.getRangeAfter(this.currentRange));
			if(newRange){ // if there is a previous range, go to it
				newImageIndex = (newImageIndex<0)?9:0;
			} else {
				newImageIndex = this.imageIndex;
				newRange = this.currentRange;
			}
		}
		this.goToRangeAndImage(newRange,newImageIndex,rightClick);
		//this.getCurrentImageItem();
	},


	// Draw deck and refresh gallery UI for the first time.
	drawComponents:function(){ 
		//this.hideThumbGrid();
	if (typeof(showView) != "undefined" && showView != eval("") && showView != "" && showView != null)
    {
	if (showView == "Grid")
    {
	this.showThumbGrid();
	showView == "Deck";
	}
	else
	{
	this.hideThumbGrid();
	}
	}
	else
	{
	this.hideThumbGrid();
	}
		
		
		Event.observe(this.toolbarContainer.getElementsBySelector('#btn_allthumbnails')[0],'click',function(ev){
			ev.stop();
			this.showThumbGrid();
			return false;
		}.bind(this));
		
		if(this.displayMode=="normal"){
			var setsStackUl = this.imageStackContainer.appendChild(this.getSetsStack());
			this.setStack = new StackedDeck(setsStackUl.getElementsBySelector("li.setstackitem"),setsStackUl,{'horizontal':true});
			var imagesetLeft = this.imageStackContainer.appendChild(new Element("div",{'className':'imageset_left'}));
			var imagesetRight = this.imageStackContainer.appendChild(new Element("div",{'className':'imageset_right'}));
			
			/*Added for iotd gallery Break*/
			var locRef=document.location.href;
            var iodtRef=locRef.indexOf('.gov');
            var iodt1Ref=locRef.indexOf('.gov');
            /*End of iotd gallery Break*/

			Event.observe(imagesetLeft,'click',function(){
			this.subDiv = $('sub');			
			if(masterArrayBlockCurrentIndex >  0)
			 {
				masterArrayBlockCurrentIndex--;
				 if(this.subDiv)
				 {
					this.subDiv .innerHTML='';
					document.getElementById("gallery_image_area").innerHTML='';
					document.getElementById("download_image_box").innerHTML='';
					document.getElementById("image_stack").innerHTML='';
					this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
				}
	             showView="Deck";
				 new ImageGallery();
			} else {
				    /*Added for iotd gallery Break*/
					if(iodt1Ref > 0) {
                       if (typeof(prevImageGallery) != "undefined" && prevImageGallery != "" && prevImageGallery != eval("") && prevImageGallery != null)
					    {document.location.href=locRef.substring(0,iodt1Ref)+".gov"+prevImageGallery;}
					}
					/*End of iotd gallery Break*/
			}
			}.bind(this));
			
			Event.observe(imagesetRight,'click',function(){
			this.subDiv = $('sub');			
			if( (masterArrayBlockCurrentIndex <  10 ) && ( (masterArrayBlockCurrentIndex+1) < masterArrayBlock.length ))
			 {
					 masterArrayBlockCurrentIndex++;
					 if(this.subDiv)
					 {
						 this.subDiv.innerHTML='';
						 document.getElementById("gallery_image_area").innerHTML='';
						 document.getElementById("download_image_box").innerHTML='';
						 document.getElementById("image_stack").innerHTML='';
						 
						 this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
					}
					 showView="Deck";
					 new ImageGallery();
					 
				
			 } else {
				     /*Added for iotd gallery Break*/
					 if(iodtRef > 0) {
                        if (typeof(nextImageGallery) != "undefined" && nextImageGallery != "" && nextImageGallery != eval("") && nextImageGallery != null)
					     {document.location.href=locRef.substring(0,iodtRef)+".gov"+nextImageGallery;}
					 }
					 /*End of iotd gallery Break*/
			 }
			}.bind(this));
			
						
			
		}

		// update onscreen elements
		this.refresh();
		// left and right (previous/next) image navigation
		if(this.displayMode == 'normal') {
			var previousImageButton = this.imageContainer.appendChild(new Element("div",{'className':'btn_image_prev'}));
			var nextImageButton = this.imageContainer.appendChild(new Element("div",{'className':'btn_image_next'}));
			
			
			Event.observe(previousImageButton,'click',function(){this.moveToImage(this.imageIndex - 1); }.bind(this));
			Event.observe(nextImageButton,'click',function(){ this.moveToImage(this.imageIndex + 1); }.bind(this));
			
		}else {
			var previousImageButton = this.imageContainer.appendChild(new Element("div",{'className':'btn_image_prev'}).insert(new Element("div",{'className':'btn_arrow_prev'})));
			var nextImageButton = this.imageContainer.appendChild(new Element("div",{'className':'btn_image_next'}).insert(new Element("div",{'className':'btn_arrow_next'})));
			
			Event.observe(previousImageButton,'click',function(){ this.moveToImage(this.imageIndex - 1); }.bind(this));
			Event.observe(nextImageButton,'click',function(){ this.moveToImage(this.imageIndex + 1); }.bind(this));
			
			var hideNav = this.imageContainer;
			var prevNav = this.imageContainer.getElementsBySelector("div.btn_image_prev")[0];
			var nextNav = this.imageContainer.getElementsBySelector("div.btn_image_next")[0];
		
	
		}
		
	},

	getCurrentImageItem:function(){
	
	var documentId;
	var rangeObj = this.currentRange;
	var absImageIndex = this.imageIndex + 1;

	var imagePositionInListOfAllImages =  (rangeObj.start - 1) + this.imageIndex;
	var eachImage = new Array();
	var xmlPath = '';var htmlPath='';var tnImagePath='';
	
	for(var i=0;i<listOfImages.length;i++)
	{
		eachImage = new Array();
		eachImage = listOfImages[i];

		if(imagePositionInListOfAllImages == i)
		{
			tnImagePath=eachImage.tnImagePath;
			xmlPath = eachImage.detailedXMLPath;
			htmlPath = eachImage.detailedHTMLPath;
			var temp=window.location.toString();
			if (temp.indexOf("staging.cms.nasa.gov")!= -1)
			{
			htmlPath="http://staging.cms.nasa.gov"+eachImage.detailedHTMLPath;
			}
			if (temp.indexOf("www.nasa.gov")!= -1)
			{
			htmlPath="http://www.nasa.gov"+eachImage.detailedHTMLPath;
			}
			if (document.getElementById('documentId') && document.getElementById('rating_url'))
			{
			document.getElementById('documentId').value=eachImage.documentId;
			document.getElementById('rating_url').value=htmlPath;
			documentId=eachImage.documentId;
			}
		}
	}
	
//added for user rating--starts 	
var cell= document.getElementById("avg_rating");
if (cell)
{
if ( cell.hasChildNodes() )
{
    while ( cell.childNodes.length >= 1 )
    {
        cell.removeChild( cell.firstChild );       
    } 
}

//average_rating and user_rating submission
    var oUiScript = document.createElement("script");
    oUiScript.src = "http://comments.nasa.gov/ratingresources/js/generate-rating-snippet.js";
    cell.appendChild(oUiScript);	
}
//added for user rating--ends	
	
		
	var detailAssetURL = xmlPath;
	var retVal = false;
	 /* Inner Ajax */
	 
	 document.getElementById('btn_fullscreen').href=htmlPath;
	 if(document.getElementById('btn_addgalleryimage') != null){
		document.getElementById('btn_addgalleryimage').href="http://mynasa.nasa.gov/portal/imagegallery/SaveImageGalleryServlet?imageurl="+tnImagePath+"&contentxmlurl="+xmlPath;
	 }
	 
	 //added for slideshow--starts
	 if(typeof(document.getElementById('btn_slideshow_1')) != "undefined" && document.getElementById('btn_slideshow_1') != null && document.getElementById('btn_slideshow_1') != "" && document.getElementById('btn_slideshow_1')!= eval("") && typeof(masterxmlurl) != "undefined" && masterxmlurl != "" && masterxmlurl != eval("") && masterxmlurl != null){
			var slideHref=document.getElementById('btn_slideshow_1').href; 
			var newsHref;
			if(slideHref.indexOf("?") != -1){
				newsHref=slideHref.substring(0,slideHref.indexOf("?"))+"?currentImageIndex="+imagePositionInListOfAllImages+"&masterXml="+masterxmlurl;

			}else{
				 newsHref=document.getElementById('btn_slideshow_1').href+"?currentImageIndex="+imagePositionInListOfAllImages+"&masterXml="+masterxmlurl;
			}
			document.getElementById('btn_slideshow_1').href = newsHref;
	  }	 
	 //added for slideshow--ends
	 
	new Ajax.Request(detailAssetURL,	
	  {
		 asynchronous:false,
	    method:'get',
	    onSuccess: function(transport,myIndex){		
		  
		   retVal = processDetailedRSS(transport.responseXML);
		    
		    
			    this.imageContainer = $('gallery_image_area');
	    },
	    onFailure: function(){ 
			//alert('Error Retrieving Source File ...');
			}
	   
	  });	  
	/* Inner Ajax */
	
	if(retVal == true)
	
	{
	    //added for slideshow
	 if(typeof(document.getElementById('btn_slideshow_1')) != "undefined" && document.getElementById('btn_slideshow_1') != null && document.getElementById('btn_slideshow_1') != "" && document.getElementById('btn_slideshow_1')!= eval("") && typeof(masterxmlurl) != "undefined" && masterxmlurl != "" && masterxmlurl != eval("") && masterxmlurl != null){
	        winLocRef=window.location.href;
			slideShowPres=winLocRef.indexOf("?showView=slideshow");
			if(slideShowPres != null && slideShowPres != -1){
              decoGreyboxLinks_landing();
			} else {
			   decoGreyboxLinks();
			}
		}
		var prevNav = this.imageContainer.getElementsBySelector("div.btn_image_prev")[0];
		var nextNav = this.imageContainer.getElementsBySelector("div.btn_image_next")[0];
				
		if(prevNav == null || prevNav == 'undefined') {
					
					
			prevNav = this.imageContainer.appendChild(new Element("div",{'className':'btn_image_prev'}));
			nextNav = this.imageContainer.appendChild(new Element("div",{'className':'btn_image_next'}));				
		}	
		Event.observe(prevNav,'click',function(){ this.moveToImage(this.imageIndex - 1); }.bind(this));
		Event.observe(nextNav,'click',function(){;this.moveToImage(this.imageIndex+ 1); }.bind(this));					
		
		if(this.displayMode=="normal" && typeof(this.captionScrollBar)=='undefined'){
			//do nothing - this scenario has already been handled
		}
		else
		{	
			this.captionScrollBar = new ScrollRegion(this.captionContainer.getElementsBySelector("div")[0]);
		}
		
	}
	else
	{
		// already handled
	}
	return this.imageSet.getRange(this.currentRange)['images'][this.imageIndex];
		
		
	},

	// fill in onscreen stuff including image, caption, title, download links
	// if replacementImageItem is not an image from some image set (i.e. undefined), fetch the "current" image and use that for refresh.
	refresh:function(replacementImageItem){
		if(typeof(replacementImageItem)=='undefined') replacementImageItem = this.getCurrentImageItem();

		if(this.displayMode=="normal"){
			// Slide outer slider: Go to the current range
			this.setStack.slideToIndex(this.imageSet.getRangeIndex(this.currentRange));

			// Slide slider: find inner slider, slide to it. NB: assumes that the slider exists!
			var innerStack = this.stackedDecks.find(function(slider){
				var rangeOfImage = this.imageSet.findRangeByImage(replacementImageItem);
				return ImageSet.prototype.compareRange(rangeOfImage,slider.range);
			}.bind(this));
			innerStack.deck.slideToIndex(this.imageIndex);
		}

		// update caption and title
		/*this.captionContainer.getElementsBySelector("p")[0].update(replacementImageItem['caption']);
		this.captionContainer.getElementsBySelector("h3")[0].update(replacementImageItem['title']);*/
		if(this.displayMode=="normal" && typeof(this.captionScrollBar)=='undefined'){
			
			this.captionScrollBar = new ScrollRegion(this.captionContainer.getElementsBySelector("div")[0]);
		}
		
		// update download links: remove current ones, add new ones
		/*this.downloadContainer.getElementsBySelector("span").invoke("remove");*/

		// update list of downloadable images
		$H(replacementImageItem['versions']).keys().reject(function(k){
			return k=='medium' || k=='thumbnail_large' || k=='thumbnail_small' || k=='fullscreen';
		}).each(function(key){
			
			// convert 1111x1111 into 1111 x 1111 and "Full_Size" into Full Size
			var displayedKey = key.split("_").join(" ").split("x").join(" x ");
			var downloadSpan = new Element("span");
			var downloadHref = new Element("a", { 'href':replacementImageItem['versions'][key]} ).update( displayedKey );
			downloadSpan.update( downloadHref );
			var downloadLink = new Insertion.Top(downloadSpan, "&rsaquo; ");
			/*this.downloadContainer.appendChild(downloadLink);*/

		}.bind(this));

		// Update image: create new image, remove old one, append new one to DOM
		this.previousRange = this.currentRange;
		
	},

	hideThumbGrid:function(){
		// TODO use the references to fetched elements from initialize() instead
		this.subDiv = $('sub');
		
		if(!this.subDiv)
		{
			var formElement = $('subDivForm');
			var sub = new Element("div", {'id': "sub"});
			
			formElement.insert(sub);
		}
		
		this.gridContainer.hide();
		if(this.displayMode=='fullscreen'){
			this.container.removeClassName("image_gallery_fullscreen_short");
			this.toolbarContainer.show();
			this.downloadContainer.show();
			this.captionContainer.show();
			this.imageContainer.show();
			this.outsideCaptionContainer.show();
		}
	},

	showThumbGrid:function(){
	try{
		
		//alert('Inside showThumbGrid');
		this.gridContainer.show();
		this.gridContainerClose.style.display="block";
		this.subDiv = $('sub');
		if(this.subDiv)	{this.subDiv.remove();}
		if(this.displayMode=='fullscreen'){
			this.container.addClassName("image_gallery_fullscreen_short");
			this.toolbarContainer.hide();
			this.downloadContainer.hide();
			this.captionContainer.hide();
			this.imageContainer.hide();
			this.outsideCaptionContainer.hide();
		}
		
		// clean out ranges
		this.imageSet.getRange(this.currentRange)['images'][this.imageIndex];
		var browserName  = navigator.appName;
		var rangesContainer = this.gridContainer.getElementsBySelector("#gallery_thumbgrid_ranges")[0];
		
		
		if( !((rangesContainer.childNodes.length == 2) && (this.currentRange.start == 1)  && (browserName == 'Microsoft Internet Explorer' )) || ((browserName == 'Microsoft Internet Explorer' ) && currentIndex==1) )
		{
			/*if(this.currentRange.start  < this.endLabel)
			{*/
	            
				if(browserName == 'Microsoft Internet Explorer')
			     { 
					var secondIndex = 0;
                    secondIndex= eval(this.currentRange.start - 20);
					currentIndex=this.currentRange.start;
					
					
					   if(this.currentRange.start == currentIndex || secondIndex==currentIndex) {
				
								while(rangesContainer.childNodes.length > 0)
								{
									rangesContainer.removeChild(rangesContainer.firstChild);
								}
								// clean out grid
								var grid = this.gridContainer.getElementsBySelector("#gallery_thumbgrid_grid")[0];
								while(grid.childNodes.length > 0)
								{	
									grid.removeChild(grid.firstChild);
								}
								
								//Prev Button 		
								var imagesetLeft1 = rangesContainer.appendChild(new Element("a",{'href':'#','id':'imageset_left1'})).update("Prev");
								
								
								// redraw ranges
								this.imageSet.allRangesInExtent().inGroupsOf(2).each(function(rangeGroup){
									var inRange = false;
									/*alert("rg0 start =" +rangeGroup[0].start + "rg0 end = "+rangeGroup[0].end +" and currentRange  = "+this.currentRange.start);*/
									if(ImageSet.prototype.compareRange(rangeGroup[0],this.currentRange) || ImageSet.prototype.compareRange(rangeGroup[1],this.currentRange)) {
										inRange = true;				
									}
									var rangeLabel = rangeGroup[0]['start'] + " - " + ((rangeGroup[1]!=null)?rangeGroup[1]['end']:rangeGroup[0]['end']);
									this.endLabel = rangeGroup[1]['end'];
									
			                        						
			                        var formElement = $('subDivForm');
			                        var sub = new Element("div", {'id': "sub"});
			                        formElement.insert(sub);
								  
									
									if(inRange)
									{
										while( (rangesContainer.childNodes.length -2) > 0)
										{
											rangesContainer.removeChild(rangesContainer.childNodes[1]);
										}
										var rangeSpan = rangesContainer.appendChild(new Element("span",{})).update(rangeLabel);
									} 
									else 
									{
										while( (rangesContainer.childNodes.length -2) > 0)
										{
											rangesContainer.removeChild(rangesContainer.childNodes[1]);
										}
										var rangeLink = rangesContainer.appendChild(new Element("a",{'href':'#'})).update(rangeLabel);
														
										Event.observe(rangeLink,'click',function(ev){
											this.currentRange = rangeGroup[0];
											this.imageIndex = 0;
											this.showThumbGrid();
											ev.stop();
											return false;
										}.bind(this));
										
									}
									
								}.bind(this));
								
								
								 //Next Button
										 var imagesetRight1 = rangesContainer.appendChild(new Element("a",{'href':'#','id':'imageset_right1'})).update("Next");	

            /*Added for iotd gallery Break*/
			var locRef=document.location.href;
            var iodtRef=locRef.indexOf('.gov');
            var iodt1Ref=locRef.indexOf('.gov');
            /*End of iotd gallery Break*/
										 
			 							
    		 Event.observe(imagesetLeft1,'click',function()
			{
			this.subDiv = $('sub');			
			if(masterArrayBlockCurrentIndex >  0)
			 {
				masterArrayBlockCurrentIndex--;
				 if(this.subDiv)
				 {
					this.subDiv .innerHTML='';
					document.getElementById("gallery_image_area").innerHTML='';
					document.getElementById("download_image_box").innerHTML='';
					document.getElementById("image_stack").innerHTML='';
					this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
					
				}
				showView="Grid";
				new ImageGallery();
			} else {
				    /*Added for iotd gallery Break*/
					if(iodt1Ref > 0) {
					    if (typeof(prevImageGallery) != "undefined" && prevImageGallery != "" && prevImageGallery != eval("") && prevImageGallery != null )
                        {document.location.href=locRef.substring(0,iodt1Ref)+".gov"+prevImageGallery;}
					}
					/*End of iotd gallery Break*/
			}
			}.bind(this));
							 
								 
			 Event.observe(imagesetRight1,'click',function(){
				
		     this.subDiv = $('sub');
             if( (masterArrayBlockCurrentIndex <  10 ) && ( (masterArrayBlockCurrentIndex+1) < masterArrayBlock.length ))
			 {
					 masterArrayBlockCurrentIndex++;
					 if(this.subDiv)
					 {
						 this.subDiv.innerHTML='';
						 document.getElementById("gallery_image_area").innerHTML='';
						 document.getElementById("download_image_box").innerHTML='';
						 document.getElementById("image_stack").innerHTML='';
						 
						 this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
					}
					 showView="Grid";
					 new ImageGallery();
					 
				
			 } else {
				     /*Added for iotd gallery Break*/
					 if(iodtRef > 0)
					 {  
					     if (typeof(nextImageGallery) != "undefined" && nextImageGallery != "" && nextImageGallery != eval("") && nextImageGallery != null )
					     {document.location.href=locRef.substring(0,iodtRef)+".gov"+nextImageGallery;}
					 }
					 /*End of iotd gallery Break*/
			 }
			}.bind(this));


								//alert('Redraw ranges finished');
								var closeBtn = this.gridContainer.getElementsBySelector('#gallery_thumbgrid_close a')[0];
								if(this.observedCloseBtn!=true){
									Event.observe(closeBtn,'click',function(ev){
										this.hideThumbGrid();
										ev.stop();
										return false;
									}.bind(this));
									this.observedCloseBtn = true;
								}
						
								// find the range pair that the current range is inside of, then render them both.
								var rangePair = this.imageSet.allRangesInExtent().inGroupsOf(2).find(function(rangeGroup){
									if(ImageSet.prototype.compareRange(rangeGroup[0],this.currentRange) || ImageSet.prototype.compareRange(rangeGroup[1],this.currentRange)) return true;
									//return false;
								}.bind(this));
						
								var range1 = this.imageSet.getRange(rangePair[0]);
								var range2 = this.imageSet.getRange(rangePair[1]);
								var combinedSet = (range2)?range1['images'].concat(range2['images']):range1['images'];
								combinedSet.each(function(imageItem,i){
									// create deck panel with image and index inside of it
									var imgContainer = new Element("div",{'className':'griditem g'+i});
									// ignore placeholder images
									if(imageItem['placeholder']!=true){
										var img = imgContainer.appendChild(new Element("img",{'src':(this.displayMode=="normal")?imageItem.versions.thumbnail_small:imageItem.versions.thumbnail_large,'alt':'Click here to view gallery image','title':'Click here to view gallery image'}));
var rate='ratingData'+imageItem.id.document_id+"byuser";
var rating_avg=imgContainer.appendChild(new Element("div",{'id':rate,'class':'imguser'}));
										
										
										
										Event.observe(img,'click',function(ev){ // Image's click handler hides the grid and navigates to the image.
											this.hideThumbGrid();
											if(i>9) this.goToRangeAndImage(rangePair[1],i - 10);
											else this.goToRangeAndImage(rangePair[0],i);
											ev.stop();
											return false;
										}.bind(this));
									} else {
										var img = imgContainer.appendChild(new Element("div",{'className':'placeholder_thumbnail'}).update(" "));
									}
									
									grid.appendChild(imgContainer);
								}.bind(this));
								
combinedSet.each(function(imageItem,i)
{
		
  var rate='ratingData'+imageItem.id.document_id+"byuser";
  
  try
  {
      document.getElementById(rate).innerHTML="Average Rating: "+eval('ratingData'+imageItem.id.document_id)[4]+"/5";
  }
catch(err)
  {
    try
	   {
	   
	  if (typeof (ckUtil_ratinginfo.getSubValue(imageItem.id.document_id+'_r_')) != "undefined"){ 
	  document.getElementById(rate).innerHTML="Average Rating: "+ckUtil_ratinginfo.getSubValue(imageItem.id.document_id+'_r_')+".0/5";
	  }
	  }
	  catch(err)
	  {
	  }
  
  }
});										
								
                          }

			   	   } else {
										while(rangesContainer.childNodes.length > 0)
										{
											rangesContainer.removeChild(rangesContainer.firstChild);
										}
										// clean out grid
										var grid = this.gridContainer.getElementsBySelector("#gallery_thumbgrid_grid")[0];
										while(grid.childNodes.length > 0)
										{	
											grid.removeChild(grid.firstChild);
										}

    								//Prev Button 		
								var imagesetLeft1 = rangesContainer.appendChild(new Element("a",{'href':'#','id':'imageset_left1'})).update("Prev");


										// redraw ranges
										this.imageSet.allRangesInExtent().inGroupsOf(2).each(function(rangeGroup){
											var inRange = false;
											/*alert("rg0 start =" +rangeGroup[0].start + "rg0 end = "+rangeGroup[0].end +" and currentRange  = "+this.currentRange.start);*/
											if(ImageSet.prototype.compareRange(rangeGroup[0],this.currentRange) || ImageSet.prototype.compareRange(rangeGroup[1],this.currentRange)) {
												inRange = true;				
											}
											var rangeLabel = rangeGroup[0]['start'] + " - " + ((rangeGroup[1]!=null)?rangeGroup[1]['end']:rangeGroup[0]['end']);
											this.endLabel = rangeGroup[1]['end'];

   			                        var formElement = $('subDivForm');
			                        var sub = new Element("div", {'id': "sub"});
			                        formElement.insert(sub);

											if(inRange)
											{
												while( (rangesContainer.childNodes.length -2) > 0)
												{
													rangesContainer.removeChild(rangesContainer.childNodes[1]);
												}
												var rangeSpan = rangesContainer.appendChild(new Element("span",{})).update(rangeLabel);
											} 
											else 
											{
												while( (rangesContainer.childNodes.length -2) > 0)
												{
													rangesContainer.removeChild(rangesContainer.childNodes[1]);
												}
												var rangeLink = rangesContainer.appendChild(new Element("a",{'href':'#'})).update(rangeLabel);
																
												Event.observe(rangeLink,'click',function(ev){
													this.currentRange = rangeGroup[0];
													this.imageIndex = 0;
													this.showThumbGrid();
													ev.stop();
													return false;
												}.bind(this));
												
											}
											
										}.bind(this));
										
										//Next Button
										 var imagesetRight1 = rangesContainer.appendChild(new Element("a",{'href':'#','id':'imageset_right1'})).update("Next");	

            /*Added for iotd gallery Break*/
			var locRef=document.location.href;
            var iodtRef=locRef.indexOf('.gov');
            var iodt1Ref=locRef.indexOf('.gov');
            /*End of iotd gallery Break*/
										 
			 							
    		 Event.observe(imagesetLeft1,'click',function()
			{
			this.subDiv = $('sub');			
			if(masterArrayBlockCurrentIndex >  0)
			 {
				masterArrayBlockCurrentIndex--;
				 if(this.subDiv)
				 {
					this.subDiv .innerHTML='';
					document.getElementById("gallery_image_area").innerHTML='';
					document.getElementById("download_image_box").innerHTML='';
					document.getElementById("image_stack").innerHTML='';
					this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
					
				}
				showView="Grid";
				new ImageGallery();
			} else {
				    /*Added for iotd gallery Break*/
					if(iodt1Ref > 0) {
					    if (typeof(prevImageGallery) != "undefined" && prevImageGallery != "" && prevImageGallery != eval("") && prevImageGallery != null )
                        {document.location.href=locRef.substring(0,iodt1Ref)+".gov"+prevImageGallery;}
					}
					/*End of iotd gallery Break*/
			}
			}.bind(this));
							 
								 
			 Event.observe(imagesetRight1,'click',function(){
				
		     this.subDiv = $('sub');
             if( (masterArrayBlockCurrentIndex <  10 ) && ( (masterArrayBlockCurrentIndex+1) < masterArrayBlock.length ))
			 {
					 masterArrayBlockCurrentIndex++;
					 if(this.subDiv)
					 {
						 this.subDiv.innerHTML='';
						 document.getElementById("gallery_image_area").innerHTML='';
						 document.getElementById("download_image_box").innerHTML='';
						 document.getElementById("image_stack").innerHTML='';
						 
						 this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
					}
				     showView="Grid";
					 new ImageGallery();
					 
				
			 } else {
				     /*Added for iotd gallery Break*/
					 if(iodtRef > 0)
					 {  
					     if (typeof(nextImageGallery) != "undefined" && nextImageGallery != "" && nextImageGallery != eval("") && nextImageGallery != null)
					     {document.location.href=locRef.substring(0,iodtRef)+".gov"+nextImageGallery;}
					 }
					 /*End of iotd gallery Break*/
			 }
			}.bind(this));

										
										
										
										//alert('Redraw ranges finished');
										var closeBtn = this.gridContainer.getElementsBySelector('#gallery_thumbgrid_close a')[0];
										if(this.observedCloseBtn!=true){
											Event.observe(closeBtn,'click',function(ev){
												this.hideThumbGrid();
												ev.stop();
												return false;
											}.bind(this));
											this.observedCloseBtn = true;
										}
								
										// find the range pair that the current range is inside of, then render them both.
										var rangePair = this.imageSet.allRangesInExtent().inGroupsOf(2).find(function(rangeGroup){
											if(ImageSet.prototype.compareRange(rangeGroup[0],this.currentRange) || ImageSet.prototype.compareRange(rangeGroup[1],this.currentRange)) return true;
											//return false;
										}.bind(this));
								
										var range1 = this.imageSet.getRange(rangePair[0]);
										var range2 = this.imageSet.getRange(rangePair[1]);
										var combinedSet = (range2)?range1['images'].concat(range2['images']):range1['images'];
										combinedSet.each(function(imageItem,i){
											// create deck panel with image and index inside of it
											var imgContainer = new Element("div",{'className':'griditem g'+i});
											// ignore placeholder images
											if(imageItem['placeholder']!=true){
												var img = imgContainer.appendChild(new Element("img",{'src':(this.displayMode=="normal")?imageItem.versions.thumbnail_small:imageItem.versions.thumbnail_large,'alt':'Click here to view gallery image','title':'Click here to view gallery image'}));
var rate='ratingData'+imageItem.id.document_id+"byuser";
var rating_avg=imgContainer.appendChild(new Element("div",{'id':rate,'class':'imguser'}));
  												
												
												
												
												Event.observe(img,'click',function(ev){ // Image's click handler hides the grid and navigates to the image.
													this.hideThumbGrid();
													if(i>9) this.goToRangeAndImage(rangePair[1],i - 10);
													else this.goToRangeAndImage(rangePair[0],i);
													ev.stop();
													return false;
												}.bind(this));
											} else {
												var img = imgContainer.appendChild(new Element("div",{'className':'placeholder_thumbnail'}).update(" "));
											}
											
											grid.appendChild(imgContainer);
										}.bind(this));
										

combinedSet.each(function(imageItem,i)
{
		
  var rate='ratingData'+imageItem.id.document_id+"byuser";
  
  try
  {
      document.getElementById(rate).innerHTML="Average Rating: "+eval('ratingData'+imageItem.id.document_id)[4]+"/5";
  }
catch(err)
  {
    try
	   {
	   
	  if (typeof (ckUtil_ratinginfo.getSubValue(imageItem.id.document_id+'_r_')) != "undefined"){ 
	  document.getElementById(rate).innerHTML="Average Rating: "+ckUtil_ratinginfo.getSubValue(imageItem.id.document_id+'_r_')+".0/5";
	  }
	  }
	  catch(err)
	  {
	  }
  
  }
});										
            }
		}
	}catch(err){}	
	},

	goFullScreen:function(range,index){ // TODO link to fullscreen
		document.location.href = "#";
	},

	goToRangeAndImage:function(range,index,rightClick){
		// Ignore movement if we are already at this index and range
		if(index==this.imageIndex && ImageSet.prototype.compareRange(range,this.currentRange)) {
           /*Added for iotd gallery Break*/
			var locRef=document.location.href;
            var iodtRef=locRef.indexOf('.gov');
            var iodt1Ref=locRef.indexOf('.gov');
            /*End of iotd gallery Break*/
			if(rightClick){

						this.subDiv = $('sub');			
						if( (masterArrayBlockCurrentIndex <  10 ) && ( (masterArrayBlockCurrentIndex+1) < masterArrayBlock.length ))
						 {
								 masterArrayBlockCurrentIndex++;
								 if(this.subDiv)
								 {
									 this.subDiv.innerHTML='';
									 document.getElementById("gallery_image_area").innerHTML='';
									 document.getElementById("download_image_box").innerHTML='';
									 document.getElementById("image_stack").innerHTML='';
									 
									 this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
								}
							
								 new ImageGallery();
								 
							
						 } else {
							 /*Added for iotd gallery Break*/
							 if(iodtRef > 0) {
								if (typeof(nextImageGallery) != "undefined" && nextImageGallery != "" && nextImageGallery != eval("") && nextImageGallery != null)
								 {document.location.href=locRef.substring(0,iodtRef)+".gov"+nextImageGallery;}
							 }
							 /*End of iotd gallery Break*/
						 }

			}else if(leftClick){

							this.subDiv = $('sub');			
							if(masterArrayBlockCurrentIndex >  0)
							 {
								masterArrayBlockCurrentIndex--;
								 if(this.subDiv)
								 {
									this.subDiv .innerHTML='';
									document.getElementById("gallery_image_area").innerHTML='';
									document.getElementById("download_image_box").innerHTML='';
									document.getElementById("image_stack").innerHTML='';
									this.subDiv.innerHTML=masterArrayBlock[masterArrayBlockCurrentIndex];
								}
								 leftClick=true;
								 new ImageGallery();
							} else {
								 leftClick=false;
								/*Added for iotd gallery Break*/
								if(iodt1Ref > 0) {
								   if (typeof(prevImageGallery) != "undefined" && prevImageGallery != "" && prevImageGallery != eval("") && prevImageGallery != null)
									{document.location.href=locRef.substring(0,iodt1Ref)+".gov"+prevImageGallery;}
								}
								/*End of iotd gallery Break*/
							}

			}
			
			return;			
		}
		// Asynchronously fetch an unloaded range
		var refreshFunc = function(loadedSuccessfully){
			if(loadedSuccessfully){
				try{
						if(this.imageSet.isRealImage(range,index)) { // check if this is a real image or just a placeholder in the set
							this.imageIndex = index;
							this.currentRange = range;
							this.refresh();
						}
					}catch(err){
                 
						/*Added for iotd gallery Break*/
						var locRef=document.location.href;
						var iodtRef=locRef.indexOf('.gov');
						var iodt1Ref=locRef.indexOf('.gov');
						 if(rightClick){
							 if(iodtRef > 0) {
								if (typeof(nextImageGallery) != "undefined" && nextImageGallery != "" && nextImageGallery != eval("") && nextImageGallery != null)
								 {document.location.href=locRef.substring(0,iodtRef)+".gov"+nextImageGallery;}
							 }
						 }
						/*End of iotd gallery Break*/
					}

			} else {
				// TODO present user with error
			}
		}.bind(this);
		
		if(!this.imageSet.rangeLoaded(range)){
			// TODO load a set with XHR before going to it if it's not loaded yet.
			// TODO figure out URL format for ranges
			this.imageSet.loadRangeAsync(range,url,refreshFunc);
		} else {
			refreshFunc(true);
		}
	}
};

/* added for the slideshow show call back function */
function closetheslideshow(){
   new ImageGallery();
}
/* end of the slideshow show call back function changes */
}

/*----------------------------------------------------- image_gallery.js ends -------------------------------------------------------*/

/*----------------------------------------------------- StackedDeck.js starts -------------------------------------------------------*/
if(detectBrowser.modernBrowser()){
//
// StackedDeck is a type of blind/accordion that uses z-index stacking and 
// either horizontal or vertical offsetting to accomplish its slide effect.
//
var StackedDeck = Class.create();
StackedDeck.prototype = {	
	initialize: function(elements,containerElement,options){
		var _openHeight = null;
		var _sliceHeight = null;
		var _springLoadingSpeed = null;
		var _baseZIndex = null;
		this.reversed = false;
		this.zIndexStep = 1;
		if(typeof(options)=='object'){
			if(options['horizontal']==true || options['sideways']==true){
				this.sideways=true;
			}
			if(parseInt(options['zstep']) > -1){
				this.zIndexStep = options['zstep'];
			}
			if(options['dead_endcap']==true){
				this.deadEndCap = true;
			}
			if(options['endcap_covers_last_item']==true){
				this.endCapCoversLastItem = true;
			}
			// hack which applies "active_first" as well as "active" to the first li when it is active
			// and "inactive_first" as well as "inactive" for inactive
			if(options['apply_first_class']==true){
				this.applyFirstClass = true;
			}
		}
		if(typeof(containerElement)!='undefined'){
			// get class and acquire height from class. Otherwise, we default to 40/80
			var params = this.getCSSParams(containerElement);
			_sliceHeight = params['sliceHeight'];
			_openHeight = params['openHeight'];
			_springLoadingSpeed = params['springLoadingSpeed'];
			_baseZIndex = params['baseZIndex'];
			if(!(_springLoadingSpeed>=0)) { _springLoadingSpeed = null; }
			
			if(this.sideways==true){
				var styleObj = {'width':(((elements.length - 1) * _sliceHeight) + _openHeight) + "px"};
				containerElement.setStyle(styleObj);
			} else {
				containerElement.setStyle({'height':(((elements.length - 1) * _sliceHeight) + _openHeight) + "px"});
			}
			if(containerElement.hasClassName("reversed")) { this.reversed = true; }
		}

		this.sliceHeight = (_sliceHeight!=null)?(_sliceHeight):(40);
		this.openHeight = (_openHeight!=null)?(_openHeight):(80);		
		this.springloadDelay = (_springLoadingSpeed!=null)?_springLoadingSpeed:75;
		this.springloaded = (parseInt(this.springloadDelay) <= 0)?false:true;
		this.currentOpenIndex = null;
		this.isAnimating = false;
		this.nextEffect = null;
		this.switchFlag = false;
		this.baseZIndex = (_baseZIndex==null)?100:_baseZIndex;
		this.springloaderBasket = null;
		this.activators = []; // an array of activation functions for the sliders which can be triggered with slideToIndex()
		this.makeSliders(elements);
	},

	getCSSParams: function(containerElement){
		if(typeof(containerElement)!='undefined'){ // type check must stay here since some callers will have not checked containerElement's validity
			var numericClassNames = $A(containerElement.classNames()).select(function(item){ return parseInt(item) > -1; });
			if(numericClassNames.length >= 2){
				return {
					'sliceHeight':parseInt(numericClassNames[0]),
					'openHeight':parseInt(numericClassNames[1]),
					'springLoadingSpeed':parseInt(numericClassNames[2]),
					'baseZIndex':parseInt(numericClassNames[3])
				};
			}
		}
		return {};
	},

	// create a set of accordion sliders that are associated with each other
	makeSliders: function(elements){
		this.currentOpenIndex = elements.length;
		elements.each(function(item,i){
			var topLocation = ((i==0)?(0):((this.sliceHeight * (i-1)) + (this.openHeight))) + 'px';
			if(this.reversed==true) { topLocation = ((this.sliceHeight * i)) + 'px'; }
			var sliderStyle = {
				'zIndex':this.reversed?(this.baseZIndex + elements.length - (i*this.zIndexStep)):(this.baseZIndex + (i*this.zIndexStep)),
				'position':'absolute'
			};
			if(this.sideways){
				sliderStyle['left'] = topLocation;
			} else {
				sliderStyle['top'] = topLocation;
			}
			$(item).setStyle(sliderStyle);

			var activationFunc;
			activationFunc = this.activators[i] = this.makeActivationEventHandlerFunc(this.makeSlideFunc(elements,item,i));
			// quick hack for mouseup and mouse over
			if(item.getElementsByClassName('rangetitle').length > 0){
				var eventAction = 'mouseup';

				// this is a "dead" end panel with no hovers, no clicks, etc
				if(this.deadEndCap==true && i==elements.length-1){
				} else {
					if(i==0 && this.applyFirstClass==true){
						var obj = new mouseOverClassify({
							'ignore_position':true,
							'adderFunction':function(element){
								if(element.hasClassName("inactive")){
									element.addClassName("setstackitem_hover_first_inactive");	
								} else {
									element.addClassName("setstackitem_hover_first_active");
								}
							},
							'removerFunction':function(element){
								element.removeClassName("setstackitem_hover_first_active");
								element.removeClassName("setstackitem_hover_first_inactive");
							}
						});
						obj.classify(item, null);//'setstackitem_hover_first');
					} else {
						var obj = new mouseOverClassify({'ignore_position':true});
						obj.classify(item, 'setstackitem_hover');
					}
				}
			}else{
				var eventAction = 'mouseover';
			}
			
			if(this.springloaded){
				// springload this slider activation by waiting a bit and then checking if we're still on top of the same item
				// this is a "dead" end panel with no hovers, no clicks, etc
				if(this.deadEndCap==true && i==elements.length-1){
					// do nothing
				} else {
					Event.observe(item, eventAction, 
						function(ev){
							this.springloaderBasket = item;
							setTimeout(function(e){
								if(this.springloaderBasket==item) { activationFunc(e); }
							}.bind(this,ev),this.springloadDelay);
						}.bind(this)
					);
				}
			} else {
				Event.observe(item, eventAction, activationFunc);				
			}
		}.bind(this));
	},
	
	// check for a queued effect. If one is present cancel the current one and start the new one
	checkForAnimationChange: function(effect){
		if(this.switchFlag==true){
			this.switchFlag=false;
			this.haveStoppedAnimating();
			effect.cancel();
			if(typeof(this.nextEffect)=='function') { this.nextEffect(); }
		}
	},

	// reset animation flags back to initial state before a transition has begun.
	resetFlagsAndClosures: function(){
		this.nextEffect = null;
		this.switchFlag = false;	
	},

	// queue up the next direction for the sliders
	signalAnimationChange: function(nextAnimationFunc){
		if(this.isAnimating==false){
			nextAnimationFunc();
			this.resetFlagsAndClosures();
		} else {
			this.nextEffect = nextAnimationFunc;
			this.switchFlag = true;
		}
	},
	
	// lock access to animation
	haveStartedAnimating: function(effect){
		this.isAnimating = true;
	},

	// unlock access to animation
	haveStoppedAnimating: function(effect,itemIndex){
		this.currentOpenIndex = itemIndex;
		this.isAnimating = false;
	},

	// create an event handler for accordion activation
	makeActivationEventHandlerFunc: function(runEffectFunc) {
		return function(ev){
			//Event.stop(ev);
			this.signalAnimationChange(runEffectFunc);
		}.bind(this);
	},

	slideToIndex: function(index){
		if(typeof(this.activators[index])=='function'){
			this.activators[index]();
		}
	},

	// create animation func for sliding effect
	makeSlideFunc: function(elements, currentElement, i){
		var getOpenLocation = function(j,sliceHeight,itemElement){
			return j * sliceHeight; // # of items "above/before" j is j items
		}.bind(this);
		
		var getClosedLocation = function(j,sliceHeight,openHeight,itemElement){
			if(j==0) { return this.reversed?(-sliceHeight):0; }
			// endCapCoversLastItem AND if this is the last panel AND previous panel is open
			if(this.endCapCoversLastItem && j==elements.length - 1 && itemElement.previous()==currentElement) {
				// end cap should cover last item of previous panel
				// We check how many elements less than 10 the previous set contains and nudge by however many
				// missing panels there are in the previous panel.
				var previousPanelContents = itemElement.previous().getElementsBySelector("ul.imagerange")[0];
				var params = this.getCSSParams(previousPanelContents);
				if(parseInt(params['sliceHeight']) > 0 && parseInt(params['openHeight']) > 0){
					// note: this won't work for a stack-in-a-stack-in-a-stack. It will only work for 2-deep. (stack-in-a-stack)
					var nudgeFactor = (10 - previousPanelContents.getElementsBySelector("li.stackitem").length) * (params['sliceHeight']);
					var result = this.reversed?((((j - 1) * sliceHeight) + openHeight)  - sliceHeight):(((j - 1) * sliceHeight) + openHeight);
					return result - nudgeFactor;
				} else {
					return this.reversed?((((j - 1) * sliceHeight) + openHeight)  - sliceHeight):(((j - 1) * sliceHeight) + openHeight);
				}
			}
			if(i < j) { return this.reversed?((((j - 1) * sliceHeight) + openHeight)  - sliceHeight):(((j - 1) * sliceHeight) + openHeight); }
			return this.reversed?((j * sliceHeight) - sliceHeight):(j * sliceHeight);
		}.bind(this);

		// return a function that makes element, the i'th element, slide to its open location. All other elements should slide to their locations too
		return function(){
			new Effect.Parallel(
				elements.collect(function(item,itemIndex){
					var fxOptions = {
						'x':(item==currentElement)?0:0,
						'y':((item==currentElement)?(getOpenLocation(itemIndex,this.sliceHeight,item)):(getClosedLocation(itemIndex,this.sliceHeight,this.openHeight,item))),
						'mode':'absolute',
						'sync':true,
						'beforeStart':function(effect){
							if(effect.element==currentElement){
								if(itemIndex==0 && this.applyFirstClass==true){
									effect.element.removeClassName("inactive_first");
									effect.element.addClassName("active_first");
								}
								effect.element.removeClassName("inactive");
								effect.element.addClassName("active");
							} else {
								if(itemIndex==0 && this.applyFirstClass==true){
									effect.element.removeClassName("active_first");
									effect.element.addClassName("inactive_first");
								}
								effect.element.removeClassName("active");
								effect.element.addClassName("inactive");
							}
						}.bind(this)
					};
					if(this.sideways){	// swap dimensions if we are travelling sideways
						var temp = fxOptions.y;
						fxOptions.y = fxOptions.x;
						fxOptions.x = temp;
					}
					return new Effect.Move(item,fxOptions);
				}.bind(this)),
				{
					'fps': 50, 'wait': false, 'duration': 200/1000, 
					'beforeUpdate': this.checkForAnimationChange.bind(this), 
					'beforeStart': this.haveStartedAnimating.bind(this), 
					'afterFinish': (function(itemIndex){
						return function(effect){
							this.haveStoppedAnimating(effect,itemIndex);
						}.bind(this);
					}.bind(this))(i)
				}
			);
		}.bind(this);
	}
};


}
/*----------------------------------------------------- StackedDeck.js ends ---------------------------------------------------------*/