/****************************************************************************************
*****************************************************************************************
*** Slideshow stuff *********************************************************************
*****************************************************************************************
*****************************************************************************************/

var DELAY_INITIAL = 2000;
var DELAY_GAP = 2000;

var USING_CUTOUT = true;
var CUTOUT_SRC			= "../images/slide_cutout_3" 		+ (!Browser.doPNG()?"_ie":"") + ".png";
var CUTOUT_SELECTED_SRC	= "../images/slide_cutout_selected" + (!Browser.doPNG()?"_ie":"") + ".png";
var VIEWER_CUTOUT_SRC	= "../images/viewer_cutout" 		+ (!Browser.doPNG()?"_ie":"") + ".png";

var CELL_IMAGE_ID = "ssID";
var CELL_ID = "ssCellID";

var SLIDE_PRELOAD = true;

/* preload hack */
/*var ssImgPreload1 = new Image();
	ssImgPreload1.src = CUTOUT_SRC;

var ssImgPreload2 = new Image();
	ssImgPreload2.src = CUTOUT_SELECTED_SRC;

var ssImgPreload3 = new Image();
	ssImgPreload3.src = VIEWER_CUTOUT_SRC;
*/

/*****************************
***  Slide *******************
*****************************/

function Slide(index, label, smallUrl, productHref, productText) {
	this.id = CELL_IMAGE_ID + index;
	this.label = label;
	this.productText = productText;
	
	//preload small	
	this.smallUrl = smallUrl;
	if (SLIDE_PRELOAD == true) {
		this.smallCache = new Image();
		this.smallCache.src = this.smallUrl;
	}

	//preload big
	this.bigUrl = Util.fromSmall(smallUrl);
	if (SLIDE_PRELOAD == true) {
		this.bigCache = new Image();
		this.bigCache.src = this.bigUrl;
	}	

	this.productHref = productHref;
	this.enabled = 1;
}

Slide.prototype.getRef = function() {
	return document.getElementById(this.id);	
}

Slide.prototype.update = function() {	
	//do something about being disabled.
	var ref = this.getRef();
	//ref.style.visibility = this.enabled==1?"visible":"hidden";	
	ref.parentNode.parentNode.style.visibility = this.enabled==1?"visible":"hidden";
}

Slide.prototype.setSelected = function (selected) {
	var slideRef = this.getRef();
	slideRef.className = "ssSlide" + (selected?"Showing":"");	
	
	if (!USING_CUTOUT) return;
	
	if (!Browser.doPNG()) {
		slideRef.filters[1].enabled = !selected;
		slideRef.filters[2].enabled = selected;		
	} else {
		slideRef.src = selected?CUTOUT_SELECTED_SRC:CUTOUT_SRC;
	}	
}

Slide.prototype.setEnabled = function(enabled) {
	this.enabled = (enabled==true?1:0);
	this.update();
}

Slide.prototype.isEnabled = function() {
	return this.enabled == 1;
}

/*****************************
***  SlideRunner *************
*****************************/

function SlideRunner(slideshow) {
	this.slideshow = slideshow;
	this.lastTimerId = 0;
}

SlideRunner.prototype.start = function() {
	this.lastTimerId = setTimeout(nextSlide, DELAY_INITIAL);	
}

SlideRunner.prototype.pause = function() {
	clearTimeout(this.lastTimerId);
	this.lastTimerId = 0;
}

SlideRunner.prototype.next = function() {
	this.lastTimerId = setTimeout(nextSlide, DELAY_GAP);
}

/*****************************
***  SlideShow ***************
*****************************/

function SlideShow(viewerId) {
	this.viewerId = viewerId;
	this.slides = new Array();

	this.lastSlideIndex = -1;
	this.lastViewed = 0;
	this.runner = new SlideRunner(this);
}

SlideShow.prototype.getViewer = function() {
	return document.getElementById(this.viewerId);
}

SlideShow.prototype.getViewerLabel = function() {
	return document.getElementById("ssLabel");
}

SlideShow.prototype.getViewerText = function() {
	return document.getElementById("ssText");
}

SlideShow.prototype.getViewerLabelNoMatches = function() {
	return document.getElementById("ssLabelNoMatches");
}

SlideShow.prototype.getSlide = function(index) {
	var out = null;
	if (index >= 0 && index < this.slides.length) {
		out = this.slides[index];
	}
	return out;
}

//add

SlideShow.prototype.add = function(label, smallUrl, productHref, productText) {
	var newSlide = new Slide(this.slides.length, label, smallUrl, productHref, productText);
	this.slides.push(newSlide);	
	return newSlide.id;
}

//viewed

SlideShow.prototype.clearLastViewed = function() {
	if (this.lastViewed == -1) return;

	var slide = this.slides[this.lastViewed];

	slide.setSelected(false);
	
	this.lastViewed = -1;
}

SlideShow.prototype.setLastViewed = function(index) {
	if (index == -1) return;

	var slide = this.slides[index];
	
	slide.setSelected(true);

	this.lastViewed = index;
}

//id and index

SlideShow.prototype.getIndexFromId = function(id) {
	var slideIndex = -1;
	for (var i = 0; i < this.slides.length; i++) {
		if (this.slides[i].id == id) {
			slideIndex = i;
			break;
		}
	}
	return slideIndex;
}

SlideShow.prototype.getIndexFromLabel = function(label) {
	var slideIndex = -1;
	for (var i = 0; i < this.slides.length; i++) {
		if (this.slides[i].label == label) {
			slideIndex = i;
			break;
		}
	}
	return slideIndex;	
}

//enabled

SlideShow.prototype.isSlideEnabled = function(index) {	
	var slide = this.getSlide(index);
	var out = ((slide!=null)?slide.isEnabled():false);
	Debug.print("Slide " + index + " is enabled? " + out);
	return out;
}

SlideShow.prototype.setSlideEnabled = function(index, enabled) {	
	var slide = this.getSlide(index);
	if (slide != null) {
		slide.setEnabled(enabled);
	}
}

SlideShow.prototype.setAllEnabled = function() {
	for (var i = 0; i < this.slides.length; i++) {
		this.slides[i].setEnabled(true);
	}
}

//show

SlideShow.prototype.showSlideById = function(ssID) {
	this.runner.pause();
	var slideIndex = this.getIndexFromId(ssID);
	if (this.isSlideEnabled(slideIndex)) {
		this.showSlideByIndex(slideIndex);	
	}
}

SlideShow.prototype.showSlideByIndex = function(index) {	
	var viewer = this.getViewer();
	//do bounds check??
	var slide = this.getSlide(index);
	if (slide == null) return;

	viewer.src = slide.bigUrl;
	viewer.alt = slide.label;
	viewer.parentNode.href = slide.productHref;	
	viewer.style.visibility = "visible";

	if (USING_CUTOUT) {
		_setupVisualCutout(viewer, false);
	}

	var label = this.getViewerLabel();

	label.style.display = "block";
	label.innerHTML = slide.label;

	var labelNoMatches = this.getViewerLabelNoMatches();
	if (labelNoMatches) {
		labelNoMatches.style.display = "none";
	}

	var text = this.getViewerText();
	if (text) {
		text.innerHTML = slide.productText;
	}
	
	this.clearLastViewed();
	this.setLastViewed(index);
	//now do something about the source thumb nail

}

SlideShow.prototype.checkShowingSlideEnabled = function() {	
	//wind back one then forward, but checking for 
	//enabled ones.
	this.lastSlideIndex--;
	this.showNextSlide();
	this.runner.pause();
}

SlideShow.prototype.nextIndex = function() {
	if (this.lastSlideIndex == this.slides.length-1) {
		this.lastSlideIndex = 0;
	} else {
		this.lastSlideIndex++;
	}
}

SlideShow.prototype.showNextSlide = function() {	

	
	this.nextIndex();

	var currentIndex = this.lastSlideIndex;

	//Debug.print("Checking if slide : " + this.lastSlideIndex + " is enabled ");
	while (this.isSlideEnabled(this.lastSlideIndex) == false) {		
		this.nextIndex();
		//going round in circles here!
		//no slides are enabled so hide the viewer and show the 
		//noMatches label
		if (currentIndex == this.lastSlideIndex) {
			this.getViewer().style.visibility = "hidden";
			this.getViewerLabel().style.display = "none";

			var label = this.getViewerLabelNoMatches();
			if (label) {
				label.style.display = "block";
			}

			return;
		}
	}

	this.showSlideByIndex(this.lastSlideIndex);
	this.runner.next();	
}


/*****************************
***  Mask ********************
*****************************/

function Mask(nameListString) {
	var firstComma = nameListString.indexOf(",");
	this.id = nameListString.substring(0, firstComma);
	
	var list = nameListString.substr(firstComma+1);
	
	var lastComma = list.lastIndexOf(",");
	var mutex = list.substr(lastComma+1);
	mutex = mutex.substring("mutex(".length, mutex.length-1);
	this.mutexes = (mutex.length != 0?mutex.split(","):new Array());

	list = list.substring(0, lastComma);
	this.names = list.split(",");	
	this.enabled = 0;    
}

Mask.prototype.isEnabled = function() {
	return this.enabled == 1;
}

Mask.prototype.setEnabled = function(enabled) {
	this.enabled = (enabled == true?1:0);
}


/*****************************
***  SlideMasker *************
*****************************/
function SlideMasker(slideshow) {
	this.slideshow = slideshow;	
	this.masks = new Array();
	this.showingNames = new Array();
}

//a name list string is a list of comma delimited strings 
//with no spaces between comma and list items.
SlideMasker.prototype.add = function(nameListString) {	 	 
	 var m = new Mask(nameListString);
	 this.masks.push(m);
	 return m.id;
}

SlideMasker.prototype.getMask = function(maskId) {	
	for (var i=0; i < this.masks.length; i++) {
		if (this.masks[i].id == maskId) {
			return this.masks[i];
		}
	}	
	return null;
}

SlideMasker.prototype.applyMask = function(maskId) {
	var m = this.getMask(maskId);
	if (m) {
	   	m.setEnabled(true);
		if (m.mutexes.length != 0) {
	   		for (var i=0; i < m.mutexes.length; i++) {	   			
	   			var mm = this.getMask(m.mutexes[i]);
	   			if (mm.isEnabled()) {
	   				mm.setEnabled(false);
					//and now for the naughty bit where we unset the 'presser'
					document.getElementById(m.mutexes[i]).className = "contentChooserBlockNormal";
				}
	   		}
	   	}
	}
	this.updateMask();
}

SlideMasker.prototype.removeMask = function(maskId) {
	var m = this.getMask(maskId);
	if (m) {
	   m.setEnabled(false);
	}
	this.updateMask();
}

SlideMasker.prototype.updateMask = function() {
	//okay this is the magic routine that goes through 
	//all the masks and finds the master list of enabled names


	//clear the list
	this.showingNames = null;

	//loop
	for (var i=0; i < this.masks.length; i++) {
		var m = this.masks[i];
		//if not enabled, don't bother
		if (m.isEnabled() == false) continue;

		//if this is the first mask, set the list names to be
		//the masks lists, thenwe remove items when not found
		if (this.showingNames == null) {
			//duplicate
			this.showingNames = m.names.slice(0);
			continue;
		} 		
		
		for (var j=0; j < this.showingNames.length; j++) {
			var name = this.showingNames[j];
			if (name == null) continue;//could have been blanked before

			//if its in the masks list, is allowed, next..
			var index = m.names.getIndexOfValue(name);
			if (index != -1) continue;

			//damn. not in the mask list. so remove it from the showingNames.
			this.showingNames[j] = null;
		}		
	}

	//so by now should have a list of names that we are allowesd to show.

	//there will be 3 cases: no list(show all), some(limited), none(stop slide show spinning).

	
	//no list(show all)
	if (this.showingNames == null) {
		this.slideshow.setAllEnabled();
		return;
	}

	var anyShowing = false;

	this.slideshow.runner.pause();
	
	//some(limited)
	for (var k=0; k < this.slideshow.slides.length; k++) {
		var slide = this.slideshow.slides[k];
		var sIndex = this.showingNames.getIndexOfValue(slide.label);
		slide.setEnabled(sIndex != -1);

		if (sIndex != -1) anyShowing = true;
	}

	this.slideshow.checkShowingSlideEnabled();

	if (anyShowing) {
		this.slideshow.runner.start();
	}//else none(stop slide show spinning).
}


var slideshow;
var slideshowMasker;

/*****************************
	procedural wrappers
*****************************/

function initSlideShow() {
	var holder = document.getElementById("ssThumbs");
	if (holder == null) return;

	Debug.print("initing Slideshow");

	slideshow = new SlideShow("ssViewer");

	_setupVisualCutout(slideshow.getViewer(), false);

	var slideCells = new Array();

	if (holder.nodeName == "TABLE") {

		for (var i = 0; i < holder.rows.length; i++) {
			var row = holder.rows[i];				
			
			
			for (var j = 0; j < row.cells.length; j++) {
				var cell = row.cells[j];
				slideCells.push(cell);
				//alert(cell);
			}
		}
		

	} else {
		//one of those new fangled div ones
		
		for (i = 0; i < holder.childNodes.length; i++) {
			var child = holder.childNodes[i];		
			if (child.nodeName != "DIV") continue;
			
			slideCells.push(child);					
		}  
	}

	//alert("complied a list of " + slideCells.length + " cell"); 

	for (var k = 0; k < slideCells.length; k++) {
		cell = slideCells[k];
		var para = findChildByTag(cell, "P");
		var text = "";
		try {
			text = findFirstTextChild(para).nodeValue;
		} catch (excp) {
			text = "";
		}
		//assuming a link, then a img tag
		var link =	findChildByTag(cell, "A");
		if (link) {
			var imgRef = findChildByTag(link, "IMG");
			if (imgRef) {
				imgRef.id = slideshow.add(imgRef.alt, imgRef.src, link.href, text);			
				imgRef.onmouseover = showMe;
				imgRef.onmouseout = restartSlideShow;

				cell.id = 

				Debug.print("found slide " + imgRef.id);

				if (USING_CUTOUT) {
					_setupVisualCutout(imgRef, true);
				}
			} else {
				Debug.print("Cannot find image for slide " + k);
			}
		} else {
			Debug.print("Cannot find link for slide " + k);
		}	
	} 

	//doPNGSupportDescendentImages(table);

	for (i=0; i < slideshow.slides.length; i++) {
		slideshow.slides[i].update(); 
	}
	
	slideshow.runner.start();
	slideshow.showSlideByIndex(0);
}


function _setupVisualCutout(imgRef, isSlide) {
	if (!USING_CUTOUT) return;
	if (!Browser.doPNG()) {
		//ok load up two AlphaImageLoaders
		//first is the original image, 
		//the second is the slide_mask

		imgRef.style.filter = 
			IE.PNG._toAlphaLoaderString(imgRef.src) + 
			IE.PNG._toAlphaLoaderString(isSlide?CUTOUT_SRC:VIEWER_CUTOUT_SRC) + 
			(isSlide?IE.PNG._toAlphaLoaderString(CUTOUT_SELECTED_SRC):"");
		if (isSlide) {
			imgRef.filters[2].enabled = false;
		}		
		imgRef.src = Assets.blankGIF;

	} else {
		//everyone else seems to support png, so put the original image
		//as the background image and then the slide-mask as the src
		imgRef.style.backgroundImage = 'url(' + imgRef.src + ')';
		imgRef.style.backgroundRepeat = "repeat";//"no-repeat";
		imgRef.style.backgroundPositionX = "0px";
		imgRef.style.backgroundPositionY = "0px";				
		imgRef.src = (isSlide?CUTOUT_SRC:VIEWER_CUTOUT_SRC);
	}
}



INITIALIZER.addPriority(initSlideShow);


function showMySlide(imgRef) {
	slideshow.showSlideById(imgRef.id);
}

function showMe(evt) {
	var elemRef = EventUtil.getEventSrc(evt);
	if (elemRef) {
		showMySlide(elemRef);
	}
}

function restartSlideShow() {
	slideshow.runner.start();
}

function nextSlide() {
	Debug.print("nextSlide!");
	slideshow.showNextSlide();
}

/****************************************************************************************
*****************************************************************************************
*** Product Chooser *********************************************************************
*****************************************************************************************
*****************************************************************************************/

function initProductChooser() {	
	
	var chooser = document.getElementById("contentChooser");
	if (chooser == null) return;
	
	slideshowMasker = new SlideMasker(slideshow);
	var divs = document.getElementsByTagAndClass("div", "contentChooserBlockNormal");

	for (var i=0; i < divs.length; i++) {
		var d = divs[i];
		d.id = slideshowMasker.add(d.id);
	}    
}

INITIALIZER.add(initProductChooser);


function overChooser(elemRef) {
	elemRef.className = 
	(elemRef.className == "contentChooserBlockNormal")?
	"contentChooserBlockNormalOver":
	"contentChooserBlockSelectedOver";	
}

function downChooser(elemRef) {	
	elemRef.className = 
	(elemRef.className == "contentChooserBlockNormalOver")?
	"contentChooserBlockNormalPressed":		
	"contentChooserBlockSelectedPressed";	
}

function upChooser(elemRef) {
	if (elemRef.className == "contentChooserBlockNormalPressed") {
		elemRef.className = "contentChooserBlockSelectedOver";
		slideshowMasker.applyMask(elemRef.id);
	} else {
		elemRef.className = "contentChooserBlockNormalOver";
		slideshowMasker.removeMask(elemRef.id);
	}
}

function outChooser(elemRef) {
	elemRef.className = 
	(elemRef.className == "contentChooserBlockNormalOver")?
	"contentChooserBlockNormal":
	"contentChooserBlockSelected";
}

/****************************************************
*** Feature magnifier *******************************
****************************************************/

function getMagnifiedViewer() {
	var v = document.getElementById("featureViewer");

	/*if (v == null) {
		var div = document.createElement("DIV");
		div.id = "featureViewer";
        
		var img = document.createElement("IMG");
		img.id = "featureViewerImage";		

		div.appendChild(img);
		document.body.appendChild(div);
		
		//IE can be funny about refs before and after appending
		return document.getElementById("featureViewer");
	} else {*/
		return v;
	//}	
}


function showFeatureMagnified(elemRef) {
	var viewer = getMagnifiedViewer();	

	var image = document.getElementById("featureViewerImage");

	if ((viewer.style.display == "block") && (image.className == elemRef.id)) {
		viewer.style.display = "none";
		return;
	}

    
	
    var src = elemRef.src;
    if (!Browser.doPNG()) {    
    	var filter = elemRef.style.filter;

    	//alert(filter);

		var startPos = filter.indexOf("src='") + "src='".length;
		var endPos = filter.indexOf("'", startPos);

		src = filter.substring(startPos, endPos);
	}
    
    src = src.split(".png")[0] + "_big.jpg";
	image.src = src;
	    
    
	image.className = elemRef.id;
    viewer.style.display = "block";

	viewer.style.left = (getElemLeft(elemRef) + 100) + "px";
	viewer.style.top = (getElemTop(elemRef) - 50) + "px";
}