// The ImageSet handles a set of images and thumbs for a Category.
//
// Uses Categories.js (arrays initilised by server script). Categories[] holds the set of all images in each Category
// ShowCategory(CatIndex) is called to start the showing a Category
//
// Uses ImageLoader.js to pre-load a set of full size images and to load a particular image within the set

function _ImageSet()
{
	this.Cat = null
	this.ImageNames = null
	this.FullSizeJimg = null
	this.ClickCount = 4
	this.SaveCoordX = 0
	this.AutoTimerId = null
	this.getImageId = function(idx)			{ return this.Category.getImageId(idx)			}
	this.getThumbSmallId = function(idx){ return this.Category.getThumbSmallId(idx)	}
	this.getIdx = function(id)					{ return this.Category.getIdx(id)						}
	this.getThumbClass = function()			{ return this.Category.getThumbClass()			}
	this.getImagePath = function()			{ return this.Category.getImagePath()				}
	this.getThumbSmallPath = function()	{ return this.Category.getThumbSmallPath()	}

	//////////////////////////////////////
	// Called by 'onclick' menu options
	//////////////////////////////////////
	this.ShowCategory = function(CatIndex)
	{
		$('#PrevBtnId,#NextBtnId,#PlayBtnId,#StopBtnId').addClass('Btns')
																										.css({opacity:0})
																										.show()
		// Halt any current display
		this.EndSlideShow()
		ScreenSaver.End()
		this.HideThumbs()

		this.LoadThumbs(CatIndex)
		ThumbCrawl.Init( $('.' + this.getThumbClass()) )

		// Show the 1st Image in the Category
		ImageLoader.InitSequence( this.ImageNames, this.Category, 1 )					// Init, but don't start preloading
		this.ImageIndex = 0
		ImageLoader.LoadRequestedImage( this.ImageIndex )											// Show my image 1st. Will call ShowFullSizeJimg()
		ImageLoader.PreLoadImage()																						// Start preloading
		ReDrawFunc = 'ImageSet.ReDrawThumbsAndImage()'
	}

	this.LoadThumbs = function(CatIndex)
	{
		var Cat = this.Category = Categories[CatIndex]
		this.ImageNames = Cat.ImageNames
		
		if( Cat.ThumbsSmallLoaded )
			return
		Cat.ThumbsSmallLoaded = true

		// Note, we use a <div> to avoid flashing scroll bars
		var thumbArea = $('#thumbAreaId')
		var thumbClass = this.getThumbClass()
		var thumbPath = this.getThumbSmallPath()
		for( Iindex in this.ImageNames )
		{
			thumbArea.append(
				$(new Image())
					.attr({src : thumbPath + this.ImageNames[ Iindex ],
								  id : this.getThumbSmallId(Iindex)})
					.addClass( thumbClass )
					.css({display:'none',
								position:'absolute',
								opacity:'hide',
								top:0,
								left:0,
								border:0
								})
					.bind('click', ImageSet.LoadFullSizeJimg)
			)
		}
	}

	this.HideThumbs = function()
	{
		$('.' + this.getThumbClass()).fadeOut('slow')
	}

	this.HideMainImage = function()
	{
		this.FullSizeJimg.hide('slow')
		$('#MainNullImageId').hide()
	}

	this.ReDrawThumbsAndImage = function()
	{
		// Get the size of the window, and clip it by subtracting Footer and Thumbs from the bottom and the 'Category Menus area' on the left
		var WindowWidth = GetWindowWidth()
		var WindowHeight = GetWindowHeight()
		var MaxImgWidth = WindowWidth - (LeftMargin + LogoMenuMaxWidth + RightMargin)
		var MaxImgHeight = WindowHeight - (TopMargin + FootNoteMargin + ThumbCrawl.ThumbMargin + ThumbCrawl.centreThumbHeight + ThumbTopMargin)

		// Position the Image in the centre.
		this.FullSizeJimg.fitToSize( MaxImgWidth, MaxImgHeight )
										 .centre( LeftMargin, TopMargin, MaxImgWidth, MaxImgHeight )
										 .fadeIn('slow')

		// Place the Null image over the whole Image area
		$('#MainNullImageId').width(MaxImgWidth)
												 .height(MaxImgHeight)
												 .css({left: LeftMargin,
															 top : TopMargin})
												 .show()

		// Divide the area between the Previous/Stop-Start/Next buttons
		var QuarterImgWidth = Math.floor(MaxImgWidth / 4)
		var EigthImgWidth = Math.floor(MaxImgWidth / 8)
		this.MaxPrevX = LeftMargin + QuarterImgWidth + EigthImgWidth
		this.MinNextX = this.MaxPrevX + QuarterImgWidth
		this.SaveCoordLowestY = TopMargin + MaxImgHeight

		// Position the Previous/Stop-Start/Next buttons
		var CentreXLeft = LeftMargin + Math.floor((MaxImgWidth - $('#PrevBtnId').width()) / 2)
		var CentreY = TopMargin + Math.floor(MaxImgHeight / 2)
		$('#PrevBtnId').css({left:CentreXLeft - QuarterImgWidth, top:CentreY})
		$('#NextBtnId').css({left:CentreXLeft + QuarterImgWidth, top:CentreY})
		$('#PlayBtnId').css({left:CentreXLeft, top:CentreY})
		$('#StopBtnId').css({left:CentreXLeft, top:CentreY})

		ThumbCrawl.Show(this.ImageIndex)

		PositionPageItems()
	}

	// Called when a thumbnail is clicked.
	this.LoadFullSizeJimg = function(event)
	{
		var idx = ImageSet.getIdx(event.target.id)
		ImageLoader.LoadRequestedImage( idx )
	}

	this.ShowFullSizeJimg = function(Jimg)
	{
		if (this.FullSizeJimg != null)
			this.FullSizeJimg.fadeOut('slow')
		this.FullSizeJimg = Jimg
		this.ImageIndex = this.getIdx(this.FullSizeJimg[0].id)
		this.ReDrawThumbsAndImage()
		
		// Google
		var src = this.FullSizeJimg[0].src
		var idx = src.indexOf('loads/')
		src = src.substring(idx + 5)
		pageTracker._trackPageview(src)
	}

	this.SaveCoords = function(event)
	{
		ImageSet.SaveCoordX = event.clientX
	}

	this.ShowPreviousOrNext = function()
	{
		this.SetButtonUnderCursor()
		if( this.ClickCount != 0 )
			this.ClickCount--
		switch( this.ButtonUnderCursor )
		{
			case 'p': this.EndSlideShow()
								this.ShowNextImage( -1 )
								break

			case 'n':this.EndSlideShow()
								this.ShowNextImage( 1 )
								break

			case 'a': if( this.AutoTimerId == null )
								{
									this.AutoBtn.stop().fadeTo('slow',0)
									this.AutoBtn = $('#StopBtnId').stop().fadeTo('slow',0.5)
									this.DoSlideShow()
								}
								else
									this.EndSlideShow()

								this.ShowToolTip()
		}
	}

	this.DoSlideShow = function()
	{
		this.ShowNextImage( 1 )
		this.AutoTimerId = setTimeout('ImageSet.DoSlideShow()', 3000)
	}

	this.EndSlideShow = function()
	{
		this.AutoBtn = $('#PlayBtnId')
		if( this.AutoTimerId != null )
		{
			clearTimeout( this.AutoTimerId )
			this.AutoTimerId = null
		}
	}

	this.ThumbClicked = function()
	{
		this.EndSlideShow()
		ThumbCrawl.ThumbClicked()
	}

	this.SetButtonUnderCursor = function()
	{
		if( ImageSet.SaveCoordX < ImageSet.MaxPrevX )
			this.ButtonUnderCursor = 'p'
		else if( ImageSet.SaveCoordX < ImageSet.MinNextX )
			this.ButtonUnderCursor = 'a'
		else
			this.ButtonUnderCursor = 'n'
	}

	this.ShowToolTip = function()
	{
		if( this.ClickCount == 0 )
			return
			
		if( this.ButtonUnderCursor == 'p')
			$('#PrevBtnId').stop().fadeTo('slow',0.5)
		else
			$('#PrevBtnId').stop().fadeTo('slow',0)

		if( this.ButtonUnderCursor == 'a')
			this.AutoBtn.stop().fadeTo('slow',0.5)
		else
			this.AutoBtn.stop().fadeTo('slow',0)

		if( this.ButtonUnderCursor == 'n')
			$('#NextBtnId').stop().fadeTo('slow',0.5)
		else
			$('#NextBtnId').stop().fadeTo('slow',0)
	}

	this.MouseMove = function(event)
	{
		ImageSet.SaveCoordX = event.clientX
		if( ImageSet.SaveCoordLowestY > event.clientY )
		{
			this.SetButtonUnderCursor()
			this.ShowToolTip()
		}
	}

	this.MouseOut = function()
	{
		$('.Btns').stop().fadeTo('slow',0)
	}

	this.ShowNextImage = function(inc)
	{
		var ImageNames = this.ImageNames
		this.ImageIndex = this.getIdx(this.FullSizeJimg[0].id) + inc
		if( this.ImageIndex < 0 )
			this.ImageIndex += ImageNames.length
		else if( this.ImageIndex == ImageNames.length )
			this.ImageIndex = 0
		ImageLoader.LoadRequestedImage( this.ImageIndex )
	}
}

var ImageSet = new _ImageSet()