/*var Browser = {
  Version: function() {
    var version = 999; // we assume a sane browser
    if (navigator.appVersion.indexOf("MSIE") != -1)
      // bah, IE again, lets downgrade version number
      version = parseFloat(navigator.appVersion.split("MSIE")[1]);
    return version;
  }
}*/


function Gallery(name,w,h,showTime,fadeTime)
{
	this.name = name;
	this.w = w;
	this.h = h;
	this.showTime = showTime;
	this.fadeTime = fadeTime;
	this.intervalTime = 40;
	
	this.nextInterval;
	this.playing = false;
	
	this.i = null;
	this.fadeLevel = 100;
	
	this.gallery = new Array();
	this.add = Gallery_add;
	this.place = Gallery_place;
	this.play = Gallery_play;
	this.togglePlay = togglePlay;
	this.pause = Gallery_pause;
	this.next = Gallery_next;
	this.prev = Gallery_prev;
	this.fade = Gallery_fade;
	this.goTo = Gallery_goTo;
}

function Gallery_add(imgSrc, aLink )
{
	var img = new ImageHolder(imgSrc, aLink );
	this.gallery.push( img );
}

function Gallery_place( element )
{
	var output = "";

	if ( this.gallery.length > 0 ) 
	{
		this.i = 0;
		this.fadeLevel = 100;
		
		var loaderIcon = { w: 32, h: 32, src: "../images/loading.gif" };
		
		isDisplayComplete = false;
		
		
		
		//Backup - this was the centering version
		/*output += "<div style='width: " + this.w + "px; text-align: left;'>";
		
		output += "<div id='loaderIcon' style='display: none; vertical-align: baseline;  position: absolute; width: " + this.w + "px; height: " + this.h + "px; background-color: #FFFFFF; z-index: 20;'><img src='" + loaderIcon.src + "' style='margin: " + ( this.h/2 - loaderIcon.h/2 ) + "px 0px 0px " + ( this.w/2 - loaderIcon.w/2 ) + "px' /></div>";
		
		output += "<a id='" + this.name + "_displayAreaLink'><img align='bottom' id='" + this.name + "_displayArea' onload='if ( !isDisplayComplete) { $(\"" + this.name + "_displayArea\").style.marginLeft = ( " + this.w/2 + " - Element.getWidth( $(\"" + this.name + "_displayArea\") )/2 ) + \"px\";  $(\"" + this.name + "_displayArea\").style.visibility = \"visible\"; isDisplayComplete = true; }' src='" + this.gallery[0].src + "' style='border: none; visibility: hidden; filter:alpha(opacity=100); position: absolute; z-index: 15; bottom:0;' /><img id='" + this.name + "_displayAreaBg' src='images/spacer.gif' style='filter:alpha(opacity=100); position: absolute; width: " + this.w + "px; height: " + this.h + "px; background-color: #FFFFFF; border: none; z-index: 14; bottom:0;' />";
		
		output += "<a id='" + this.name + "_loadingAreaLink'><img id='" + this.name + "_loadingArea' onload='isLoadingAreaComplete = true;' src='images/spacer.gif' style='filter:alpha(opacity=100); position: absolute; z-index: 10; border: none; bottom:0;' /></a>";

		output += "<div style='width: " + this.w + "px; height: " + this.h + "px'> </div>";
		output += "</div>";
		*/
		
		/*output += "<div style='width: " + this.w + "px; text-align: left;'>";
		
		output += "<div id='loaderIcon' style='display: none; vertical-align: baseline;  position: absolute; width: " + this.w + "px; height: " + this.h + "px; background-color: #FFFFFF; z-index: 20;'><img src='" + loaderIcon.src + "' style='margin: 0px 0px 0px " + ( this.w/2 - loaderIcon.w/2 ) + "px' /></div>";
		
		output += "<a id='" + this.name + "_displayAreaLink'><img align='top' id='" + this.name + "_displayArea' onload='if ( !isDisplayComplete) { $(\"" + this.name + "_displayArea\").style.marginLeft = \"0px\";  $(\"" + this.name + "_displayArea\").style.visibility = \"visible\"; isDisplayComplete = true; }' src='" + this.gallery[0].src + "' style='border: none; visibility: hidden; filter:alpha(opacity=100); opacity:1; -moz-opacity:1; position: absolute; z-index: 15; top:0;' /><img id='" + this.name + "_displayAreaBg' src='images/spacer.gif' style='filter:alpha(opacity=100); opacity:1; -moz-opacity:1; position: absolute; width: " + this.w + "px; height: " + this.h + "px; border: none; z-index: 14; top:0;' />";
		
		output += "<a id='" + this.name + "_loadingAreaLink'><img id='" + this.name + "_loadingArea' onload='isLoadingAreaComplete = true;' src='images/spacer.gif' style='filter:alpha(opacity=100); opacity:1; -moz-opacity:1; position: absolute; z-index: 10; background-color: #FFFFFF; border: none; top:0;' /></a>";

		output += "<div style='width: " + this.w + "px; height: " + this.h + "px'> </div>";
		output += "</div>";*/
		
		output += "<div style='width: " + this.w + "px; text-align: left;'>";
		
		output += "<div id='loaderIcon' style='display: none; vertical-align: baseline;  position: absolute; width: " + this.w + "px; height: " + this.h + "px; background-color: white; z-index: 20;'><img src='" + loaderIcon.src + "' style='margin: " + ( this.h/2 - loaderIcon.h/2 ) + "px 0px 0px " + ( this.w/2 - loaderIcon.w/2 ) + "px' /></div>";
		
		output += "<a id='" + this.name + "_displayAreaLink'><img align='bottom' id='" + this.name + "_displayArea' onload='if ( !isDisplayComplete) { $(\"" + this.name + "_displayArea\").style.marginLeft = ( " + this.w/2 + " - Element.getWidth( $(\"" + this.name + "_displayArea\") )/2 ) + \"px\";  $(\"" + this.name + "_displayArea\").style.visibility = \"visible\"; isDisplayComplete = true; }' src='" + this.gallery[0].src + "' style='filter:alpha(opacity=100); visibility: hidden; filter:alpha(opacity=100); position: absolute; z-index: 15; bottom:0; background-color:black;' /></a><img id='" + this.name + "_displayAreaBg' src='../images/spacer.gif' style='position: absolute; width: " + this.w + "px; height: " + this.h + "px; background-color: white; border: none; z-index: 14; bottom:0;' />";
		
		output += "<a id='" + this.name + "_loadingAreaLink'><img id='" + this.name + "_loadingArea' onload='isLoadingAreaComplete = true;' src='../images/spacer.gif' style='filter:alpha(opacity=100); position: absolute; z-index: 10; border: none; bottom:0' /></a>";

		output += "<div style='width: " + this.w + "px; height: " + this.h + "px'> </div>";
		output += "</div>";
		
		
		
		
	}
	else
		output += "Gallery Empty";
		
	if ( element === undefined )
		document.write( output );
	else if ( element == "return" )
		return output;
	else
		$(element).innerHTML = output;
}

//New
function togglePlay(targetDiv, onOff)	{
	
	if (this.playing == true || onOff == "off")	{
		this.pause();
		$(targetDiv).innerHTML = "<img src='images/play.jpg' style='position:relative;' class='normal' id='play_btn' /><img src='images/play_over.jpg' style='position:absolute; margin-left:-43px;' class='over' id='play_btn_over' />";
		
	}
	else	{
		this.play();
		$(targetDiv).innerHTML = "<img src='images/pause.jpg' style='position:relative;' class='normal'  id='pause_btn' /><img src='images/pause_over.jpg' style='position:absolute; margin-left:-43px;' class='over' id='pause_btn_over' />";
	}

}

function Gallery_play()
{
	var self = this;
	if ( !isDisplayComplete )
	{
		this.nextInterval = setTimeout( function(){ self.play(); }, this.intervalTime );
		return;
	}
	
	this.playing = true;
	this.next();
}

function Gallery_pause()
{
	this.playing = false;
	clearTimeout( this.nextInterval );
}

function Gallery_goTo(i)
{
	
	this.playing = false;
	
	clearTimeout( this.nextInterval );
	//Element.show("loaderIcon");
	document.getElementById( this.name + "_displayArea" ).setAttribute("src", "../images/spacer.gif" );
	this.i = i;
	
	this.fadeLevel = 100;
	var linkHref = this.gallery[this.i].href;
	
	this.i = i;
	
	if ( this.i >= this.gallery.length || this.i < 0 )
		this.i = 0;
	
	isLoadingAreaComplete = false;
	isLoadingAreaPlaced = false;
	
	document.getElementById( this.name + "_loadingArea" ).src = this.gallery[this.i].src;
	Element.hide( this.name + "_displayArea" );
	
	if ( linkHref == "" )
	{
		document.getElementById( this.name + "_loadingAreaLink" ).style.cursor = "default";
		document.getElementById( this.name + "_displayAreaLink" ).style.cursor = "default";
	}
	else
	{
		document.getElementById( this.name + "_loadingAreaLink" ).style.cursor = "pointer";
		document.getElementById( this.name + "_displayAreaLink" ).style.cursor = "pointer";
	}

	document.getElementById( this.name + "_loadingAreaLink" ).setAttribute("href", linkHref );
	document.getElementById( this.name + "_displayAreaLink" ).setAttribute("href", linkHref );

	
	var self = this;
	this.nextInterval = setTimeout( function(){ self.fade(); }, 0 );
	
}

function Gallery_next()
{
	this.fadeLevel = 100;
	var linkHref = this.gallery[this.i].href;
	
	this.i = this.i + 1;
	
	if ( this.i >= this.gallery.length )
		this.i = 0;
	
	isLoadingAreaComplete = false;
	isLoadingAreaPlaced = false;
	
	document.getElementById( this.name + "_loadingArea" ).src = this.gallery[this.i].src;
	
	if ( linkHref == "" )
	{
		document.getElementById( this.name + "_loadingAreaLink" ).style.cursor = "default";
		document.getElementById( this.name + "_displayAreaLink" ).style.cursor = "default";
	}
	else
	{
		document.getElementById( this.name + "_loadingAreaLink" ).style.cursor = "pointer";
		document.getElementById( this.name + "_displayAreaLink" ).style.cursor = "pointer";
	}

	document.getElementById( this.name + "_loadingAreaLink" ).setAttribute("href", linkHref );
	document.getElementById( this.name + "_displayAreaLink" ).setAttribute("href", linkHref );

	
	var self = this;
	
	this.nextInterval = setTimeout( function(){ self.fade(); }, this.showTime );
	
}

function Gallery_prev()
{
	this.fadeLevel = 100;
	var linkHref = this.gallery[this.i].href;
	
	this.i = this.i - 1;
	
	if ( this.i < 1 )
		this.i = 0;
	
	isLoadingAreaComplete = false;
	isLoadingAreaPlaced = false;
	
	document.getElementById( this.name + "_loadingArea" ).src = this.gallery[this.i].src;
	
	if ( linkHref == "" )
	{
		document.getElementById( this.name + "_loadingAreaLink" ).style.cursor = "default";
		document.getElementById( this.name + "_displayAreaLink" ).style.cursor = "default";
	}
	else
	{
		document.getElementById( this.name + "_loadingAreaLink" ).style.cursor = "pointer";
		document.getElementById( this.name + "_displayAreaLink" ).style.cursor = "pointer";
	}

	document.getElementById( this.name + "_loadingAreaLink" ).setAttribute("href", linkHref );
	document.getElementById( this.name + "_displayAreaLink" ).setAttribute("href", linkHref );

	
	var self = this;
	
	this.nextInterval = setTimeout( function(){ self.next(); }, this.showTime );
	
}

function Gallery_fade()
{
	var self = this;

	// don't fade until image under is loaded
	if ( !isLoadingAreaComplete )
	{
		this.nextInterval = setTimeout( function(){ self.fade(); }, this.intervalTime );
		return;
	}
	
	
	


	var loadElement = document.getElementById( this.name + "_loadingArea" );

	if ( !isLoadingAreaPlaced )
	{
		//Element.hide("loaderIcon");
		
		//new
		//$(loadElement).style.marginLeft = "0px";
		
		
		//old
		$(loadElement).style.marginLeft = ( this.w/2 - Element.getWidth( loadElement )/2 ) + "px";
		
		isLoadingAreaPlaced = true;
	}


	var adjustmentPerPeriod = 100 / ( this.fadeTime/this.intervalTime );
	
	this.fadeLevel = this.fadeLevel - adjustmentPerPeriod;
	
	var fadeElement = document.getElementById( this.name + "_displayArea" );
	var fadeElementBg = document.getElementById( this.name + "_displayAreaBg" );
	
	if ( !setFadeLevel(fadeElement,this.fadeLevel) ) 
		this.fadeLevel = 0;
	else
		setFadeLevel(fadeElementBg,this.fadeLevel);
	
	if ( this.fadeLevel <= 0 )
	{
		// swapping src causes some flickering.  So, lets just swap details
		var tempId = fadeElement.id
		var tempZ = fadeElement.style.zIndex;
		var tempOnLoad = fadeElement.getAttribute("onload");
		
		fadeElement.setAttribute( "id", loadElement.id );
		fadeElement.setAttribute( "onload", loadElement.getAttribute("onload") );
		fadeElement.style.zIndex = loadElement.style.zIndex;
		fadeElement.style.marginLeft = "0px";

		loadElement.setAttribute( "id", tempId );
		loadElement.setAttribute( "onload", tempOnLoad );
		loadElement.style.zIndex = tempZ;
		
		//alert( loadElement.id + ", " + loadElement.style.zIndex );
	
		Element.show( this.name + "_displayArea" );
		Element.show( this.name + "_loadingArea" );

		this.fadeLevel = 100;
		setFadeLevel(fadeElement,this.fadeLevel)
		setFadeLevel(fadeElementBg,this.fadeLevel)
		setFadeLevel(loadElement,this.fadeLevel)
		//this.next();
	}
	else
	{
		this.nextInterval = setTimeout( function(){ self.fade(); }, this.intervalTime );
	}
	
	
	
	//NEW CHECK FOR GALLERY PLAYING
	if (this.playing == true && this.fadeLevel == 100)	{
		//clearTimeout( this.nextInterval );
		this.nextInterval = setTimeout( function(){ self.next(); }, 5000 );
	}
	//
	
	
}

function setFadeLevel( fadeElement, level )
{
	if ( typeof fadeElement.style.MozOpacity != "undefined" ) 	
		fadeElement.style.MozOpacity = level / 100;
	else if ( typeof fadeElement.style.opacity != "undefined" ) 		
		fadeElement.style.opacity = level / 100;
	else if ( typeof fadeElement.filters == "object" ) {
		fadeElement.style.filter = 'alpha(opacity=' + level + ')';
		/*if (Browser.Version() > 7) {
  			fadeElement.filters.alpha.opacity = level;
		}
		else
			fadeElement.filters.alpha.opacity = level;*/
			//fadeElement.filters.alpha.opacity = level;
		//fadeElement.filters.alpha.opacity = level;
	}
	else
		return false;
		
	return true;
}

function ImageHolder(src, href)
{
	this.src = src;
	this.href = href;
	
	if ( this.href == undefined )
		this.href = "";
		
	this.isLinked = ( this.href != "" );
		
	this.imageObject = new Image();

	this.loadImage = ImageHolder_loadImage;
}

function ImageHolder_loadImage()
{
	this.imageObject.src = this.src;
}


