/*
	Picture Show Object

	by: Joe Szedula (szedula-at-mindspring.com)

	This object and its methods are used to run and manipulate a self
	running picture show. All the images (picture show & enlargements)
	*must* be a consistant size for this picture show to run properly.

	Tbe documentation for using this Javascript object library can
	be found at:

		http://www.mindspring.com/~szedula/share/PictureShowDoc.html
		http://www.mindspring.com/~szedula/share/PictureShowFormDoc.html
		http://www.mindspring.com/~szedula/share/PictureShowControlDoc.html

	This source is best viewed with tabs set every 3 columns.


	Picture show constructor object
		theShow	-	the name of the "picture show" object,
						if this is *not* done the animation will fail!!
*/
function PictureShow(theShow) {
	this.Ready             = false;				// "picture show" is not ready yet
	this.theShow           = theShow;			// name of "picture show" object
	this.theImage          = theShow+"Image";	// name of "picture show" image
	this.theCode           = theShow				// animation "code"
								  + ".AnimateSlides()";
	this.Site              = null;				// location of images used in picture show
	this.SlideIncr         = 1;					// increment to next Slide
	this.SlideCount        = 0;					// number of images to be animated
	this.Slide             = 0 					// current picture show slide being viewed
								  - this.SlideIncr;
	this.ImageW            = 0;					// picture show image width
	this.ImageH            = 0;					// picture show image height
	this.ImageAlt          = "Picture Show";	// <img> "Alt" 
	this.imageBorder       = 0;					// image borader
	this.TimeDelay         = 5000;				// assume a 5 second delay between pictures
	this.TimeDelays        = null;				// picture by picture delays
	this.ShowImages        = null;				// images to be displayed
	this.filename          = null;				// name of each image file
	this.loadingSlides     = null;				// "Loading Image" address
	this.loadingSlides_img = null;				// "Loading Image" image file
	this.timeout_id        = null;				// animation is not yet running
	this.thePageLink       = null;				// link to a specific page
	this.theTarget         = null;				// target window for page link
	this.theClickAction    = null;				// "onClick" action
	this.theClickInfo      = null;				// "onMouseOver" text
	this.PreLoad			  = true;				// preload image in show
	this.NextImage			  = null;				// next image in show if not preloading
	this.Notes             = null;				// notes for images
	this.NoteStyle         = null;				// note styles for images
	this.NoteForm          = null;				// note form for images
	this.NoteBorder        = 0;					// note styles border width

	// enlargement info
	this.EnlargementSite   = null;				// name of site/directory containing enlargements
	this.EnlargementSized  = false;				// assume no enlargement size given
	this.EnlargementWidth  = 0;					// assume no enlargement width set
	this.EnlargementHeight = 0;					// assume no enlargement height set

	// form data
	this.theForm           = null;				// assume no form in picture show
	this.FormStylesSet     = false;				// set once form styles have been set
	this.captions          = null;				// captions for images
	this.CaptionSize       = 0;					// don't have captions
	this.CaptionPosition   = true;				// assume caption position is on top
	this.ShowSlideNumber   = false;				// assume no form field for slide number
	this.cellspacing       = 0;					// default form table spacing
	this.cellpadding       = 0;					// default form table padding
	this.FormHeading       = null;				// form table heading
	this.FormNote          = null;				// form table notes
}

/* object method to set images for picture show
		ImageFilesArray	-	text array containing URLs of images to be 
									displayed during picture show
		width					-	width of images
		height				-	height of images
		Site					-	name of site/directory containing pictures (optional)
*/
PictureShow.prototype.PictureShowImages = function(ImageFilesArray, width, height, Site) {
	this.SlideCount = ImageFilesArray.length;
	this.ShowImages = new Array(this.SlideCount);
	this.filename   = new Array(this.SlideCount);
	this.Site = '';
	if (arguments.length > 3) { 
		if (Site != "") {
			this.Site = Site;
			if (Site.substr(Site.length-1,1) != "/") this.Site += "/";
		}
	}
	for (var i=0; i<this.SlideCount; i++) {
		if (this.PreLoad) { this.ShowImages[i] = new Image(); }
		this.filename[i]   = ImageFilesArray[i];
	}
	this.ImageW = width;
	this.ImageH = height;
}

// object method to disable pre-load of images
PictureShow.prototype.NoPreLoad = function() {
	if (! this.Ready) { this.PreLoad = false; }
}

/* object method to specify target <img> "ALT" text
		ImageAlt			-	target <img> "ALT" text
*/
PictureShow.prototype.SetImageAlt = function(ImageAlt) {
	this.ImageAlt = ImageAlt;
}

/* object method to show a "Loading Show" image while files are loaded
		LoadingSlide	-	name of file to be displayed while slide show loads
*/
PictureShow.prototype.LoadingShow = function(LoadingSlide) {
	if (this.Site == null) {
		this.loadingSlides = LoadingSlide;
	} else {
		this.loadingSlides = this.Site+LoadingSlide;
	}
	this.loadingSlides_img = new Image();
	this.loadingSlides_img.src = this.loadingSlides;
}

/* object method to set time interval between slide changes
	Notes:
	1. a form must have been specified by using "SetSlideForm"
	2. form field containing interval between updates *must*
		be named "theInterval"
*/
PictureShow.prototype.SetInterval = function() {
	this.NoAnimate();
	if (arguments.length > 0) {
		this.TimeDelay = arguments[0];
		if (this.TimeDelay < 0) this.TimeDelay = 1;
		this.TimeDelay = this.TimeDelay * 1000;
	} else if (this.theForm) {
		this.TimeDelay = document[this.theForm]["theInterval"].value;
		if (this.TimeDelay < 0) this.TimeDelay = 1;
		this.TimeDelay = this.TimeDelay * 1000;
	}
	this.AnimateSlides();
}

/* object method to set individual time intervals between slide changes
		theTimeDelays		-	individual time intervals between slide changes
*/
PictureShow.prototype.SetIntervals = function(theTimeDelays) {
	this.NoAnimate();
	this.TimeDelays = new Array(this.SlideCount);
	for (var i=0; i<this.SlideCount ; i++) {
		if (i >= theTimeDelays.length) {
			this.TimeDelays[i] = this.TimeDelay;
		} else {
			this.TimeDelays[i] = theTimeDelays[i] * 1000;
		}
	}
	this.TimeDelay = theTimeDelays[0];
}

/* object method to specify availability of "enlargements"
		EnlargementSite			-	name of site/directory containing enlargements
*/
PictureShow.prototype.LinkEnlargements = function(EnlargementSite) {
	this.EnlargementSite = EnlargementSite;
}

/* object method to set enlargement image size
		theWidth		-	width of "enlargement" pictures
		theHeight	-	height of "enlargement" pictures
	Notes:
	1. enlargement *must* ba at least 100x100 pixels to be considered a valid size
*/
PictureShow.prototype.SetEnlargementSize = function(theWidth,theHeight) {
	if ( (theWidth > 100) && (theHeight > 100) ) {
		this.EnlargementSized  = true;
		this.EnlargementWidth  = theWidth;
		this.EnlargementHeight = theHeight;
	}
}

/* object method to specify availability of a link to a specific page
		thePageLink		-	link to a specific page
		theTarget		-	target window to be used to open link
		imageBorder		-	number of pixels to be used as a border around image
		info				-	"onMouseOver" text
*/
PictureShow.prototype.PageLink = function(thePageLink,theTarget,imageBorder,info) {
	this.thePageLink = thePageLink;
	if (arguments.length > 1) { this.theTarget = theTarget; }
	if (arguments.length > 2) { this.imageBorder = imageBorder; }
	if (arguments.length > 3) { this.theClickInfo = info; }
}

/* object method to define "onClick" action and "onMouseOver" text
		acton	-	"onClick" action
		info	-	"onMouseOver" text
*/
PictureShow.prototype.onClickAction = function(acton,info) {
	this.theClickAction = acton;
	this.theClickInfo   = info;
}

/* object method to begin <TABLE> enclosing a picture show
		pad	-	pad on width of <TABLE>
*/
PictureShow.prototype.PictureTable = function(pad) {
	var p=0;
	if (arguments.length == 1) p=pad;
	document.write('<table width='+(p+this.ImageW)+' border=0 cellspacing='+
						this.cellspacing+' cellpadding='+this.cellpadding+'>');
}

/* object method to set cell info for <TABLE> enclosing a picture show
		cellspacing	-	<TABLE> "cellspacing" setting
		cellpadding	-	<TABLE> "cellpadding" setting
*/
PictureShow.prototype.PictureTableCellInfo = function(cellspacing,cellpadding) {
	this.cellspacing = cellspacing;
	this.cellpadding = cellpadding;
}

// object method to create HTML for picture show
PictureShow.prototype.PictureShowWriteString = function() {
	var s = "";
	if (this.EnlargementSite) {
		s += '<script language="JavaScript1.1" type="text/javascript">\n';
		s += 'function '+this.theShow+'_ShowEnlargement() { '+this.theShow+'.ShowEnlargement(); }\n';
		s += '<\/script>\n';
		s += '<a onClick="return '+this.theShow+'_ShowEnlargement();" onMouseOut="window.status=\'\';"'+
			' onMouseOver="window.status=\'Click on image to view an enlargement.\'; return true;"'+
			' title=\'Click on image to view an enlargement.\''+'>';
	} else if (this.thePageLink) {
		s += '<a href="'+this.thePageLink+'"';
		if (this.theTarget) { s += ' target="'+this.theTarget+'"'; }
		if (this.theClickInfo) {
			s += ' onMouseOver="window.status=\''+this.theClickInfo+
				'\'; return true;" onMouseOut="window.status=\'\';"';
		}
		s += '>';
	} else if (this.theClickAction) {
		s += '<a onClick="'+this.theClickAction+'; return false;"'+
			' onMouseOver="window.status=\''+this.theClickInfo+'\'; return true;"'+
			' onMouseOut="window.status=\'\';">';
	}

	if (this.loadingSlides == null) this.loadingSlides = this.Site+this.filename[0];
	s += '<img src="'+this.loadingSlides+'" alt="'+this.ImageAlt+'" width='+this.ImageW+
		' height='+this.ImageH+' name="'+this.theImage+'" border='+this.imageBorder+'>';

	if ( (this.EnlargementSite) || (this.thePageLink) ) { s += '<\/a>'; }

	// load images to be used in picture show
	if (this.PreLoad) {
		for (var i=0; i<this.SlideCount; i++) {
			this.ShowImages[i].src = this.Site+this.filename[i];
		}
	} else {
		this.NextImage = new Image();
		this.NextImage.src = this.Site+this.filename[0];
	}
	this.Ready = true;
	return s;
}

// object method to create HTML for picture show
PictureShow.prototype.PictureShowWrite = function() {
	document.write(this.PictureShowWriteString());
}

/*
	Routines from this point on are not to be used directly by users.
	These	routines are to be used by PictureShow object internally.

	object method to advance to next Slide in animation
		theSlideIncr	-	Slide advance increment
*/
PictureShow.prototype.AdvanceSlide = function(theSlideIncr) {
	this.SlideIncr = theSlideIncr;

	if (this.Notes) { this.SetVisibility('hidden');	}
	this.Slide = this.AdvanceToNextSlide();
	if (this.TimeDelays) {
		this.TimeDelay = this.TimeDelays[this.Slide];
	}

	if (this.PreLoad) {
		document.images[this.theImage].src = this.ShowImages[this.Slide].src;
	} else {
		document.images[this.theImage].src = this.NextImage.src;
		this.NextImage.src = this.Site+this.filename[this.AdvanceToNextSlide()];
	}

	if (this.Notes) {
		this.SetVisibility('visible');

	// update form information (if running within a form)
	} else if (this.theForm) {
		if (this.captions)
			document[this.theForm]["theCaption"].value = this.captions[this.Slide];
		if (this.ShowSlideNumber)
			document[this.theForm]["theSlide"].value = this.Slide+1;
	}
}

// object method to increment to next slide number
PictureShow.prototype.AdvanceToNextSlide = function() {
	var n = this.Slide + this.SlideIncr;
	if (n < 0) {
		n = this.SlideCount-1;
	} else if (n >= this.SlideCount) {
		n = 0;
	}
	return n;
}

// object method to run picture show
PictureShow.prototype.AnimateSlides = function() {
	if (! this.Ready) return;
	this.AdvanceSlide(this.SlideIncr);
	this.timeout_id = setTimeout(this.theCode,this.TimeDelay);
}

/* object method to display an enlargement picture in a new window
	Notes:
	1.	there must be a directory at location specified in "EnlargementSite"
		containing picture show enlargement images
	2. enlargement *must* have same name as slide in picture show
	3. if sizing information is available, enlargement will be resized (if required)
		to fit within screen
*/
PictureShow.prototype.ShowEnlargement = function() {
	if (this.EnlargementSite == null) { return false; }
	this.NoAnimate();// first, stop animation
	var loc = '';
	
	if (navigator.appName.indexOf("Netscape") != -1) {
		loc = 'screenX=0,screenY=0,';
	} else if (navigator.appName.indexOf("Microsoft") != -1) {
		loc = 'left=0,top=0,';
	}
	
	var theLink = this.EnlargementSite+'/'+this.filename[this.Slide];
	var image_size  = '';
	
	// is screen size & enlargement size information available ?
	if ( (screen) && (this.EnlargementSized) ) {
		// leave pad around image
		var availWidth  = screen.availWidth - 32;
		var availHeight = screen.availHeight - 50;
		var reqWidth    = this.EnlargementWidth;
		var reqHeight   = this.EnlargementHeight;

		// scale to fit available window size ?
		if ( (availWidth < reqWidth) || (availHeight < reqHeight) ) {
			var ScaleFactor = Math.min(availWidth/reqWidth, availHeight/reqHeight);
			var windowW = Math.floor(ScaleFactor*reqWidth);
			var windowH = Math.floor(ScaleFactor*reqHeight);
			ScaleFactor = Math.min((windowW-12)/reqWidth, (windowH-12)/reqHeight);
			image_size = ' width=' + Math.floor(ScaleFactor*reqWidth)
						  + ' height=' + Math.floor(ScaleFactor*reqHeight);
		// window bigger than image, shrink window to size needed
		} else {
			var windowW = this.EnlargementWidth+16;
			var windowH = this.EnlargementHeight+16;
			image_size = ' width=' + this.EnlargementWidth
						  + ' height=' + this.EnlargementHeight;
		}
		var theFeatures = loc+'width='+windowW+',height='+windowH;
	} else {
		var theFeatures = loc+'scrollbars,resizable,menubar';
	}
	
	var w = window.open("","theEnlargement",theFeatures);// create window with desired attributes

	// create HTML document to display image
	var d = w.document;
	var t = this.filename[this.Slide];
	if (this.captions) t = this.captions[this.Slide];
	var s = '<html><head><title>'+t+'</title><\/head><body bgcolor="white">\n';
	s += '<center>\n';
	s += '<img src="'+theLink+'" alt="" hspace=0 vspace=0 border=0 align=left'+image_size+'>\n';
	s += '<\/center><\/body><\/html>\n';
	d.write(s);
	d.close();
	return false;
}

// object method to stop picture show animation
PictureShow.prototype.NoAnimate = function() {
	if (this.timeout_id)	{ clearTimeout(this.timeout_id); this.timeout_id=null; }
}

/* object method to manually advance (or back up) one picture
		theSlideIncr	-	Slide advance increment
*/
PictureShow.prototype.NextSlide = function(theSlideIncr) {
	this.NoAnimate();	
	this.AdvanceSlide(theSlideIncr);
}

/* object method to go to a specific slide number
		SlideNumber	-	slide number
*/
PictureShow.prototype.GoToSlideNumber = function(SlideNumber) {
	if (this.Notes) this.SetVisibility('hidden');
	this.Slide = SlideNumber;
	if (this.Slide < 0)
		this.Slide = 0;
	else if (this.Slide >= this.SlideCount)
		this.Slide = this.SlideCount-1;
	if (this.Notes) this.SetVisibility('visible');

	if (this.PreLoad) {
		document.images[this.theImage].src = this.ShowImages[this.Slide].src;
	} else {
		document.images[this.theImage].src = this.Site+this.filename[this.Slide];
		this.NextImage.src = this.Site+this.filename[this.AdvanceToNextSlide()];
	}
}