/*-------------------------------------------------------------------------------------------*/
//	ImagePanel: uses dhtml to produce a horizontal scrolling area
/*-------------------------------------------------------------------------------------------*/
function ImagePanel () {}
Object.extend(ImagePanel.prototype, {
	Images: new Array(),
	Key: "",
	Timer: null,
	Container: null,
    DisplayArea: null,
	btnLeft: null,
	btnRight: null,
	btnLeftFast: null,
	btnRightFast: null,
	btnNext: null,
	btnPrev: null,
	divCurrentImage: null,
	Selected: 0,
	Current: 0,
	Next: -1,
	Path: "",
	Height: 0,
	Width: 0,
	DisplayCount: 0,
	PaddingTop: 0,
	PaddingBottom: 0,
	PaddingLeft: 0,
	PaddingRight: 0,
	BorderWidth: 1,
	BorderColor: "#cccccc",
	BorderColorSel: "#666666",
	BorderStyle: "solid",
	Distance: 0,
	Delay: 0,
	TargetPos: 0,
	TotalWidth: 0,
	PreloadCount: 5,
	bMouseDown: false,
	bMoving: false,
	Title: "",
	onClickMethod: null,
	GalleryID: 0,
	
	init: function() 
	{
		var self = this;
		
		this.Container = $(this.Container);
		this.Container.style.height = this.Height + this.BorderWidth*2 + "px";
		this.Container.style.overflow = "hidden";
		this.Container.scrollLeft = 0;
		
		this.DisplayArea = document.createElement("div");	
		this.DisplayArea.style.height = this.Height + this.BorderWidth*2 + "px";
		this.Container.appendChild(this.DisplayArea);
		
		for (var nIndex=0; nIndex<this.Images.length; nIndex++) 
		{
			if (this.TotalWidth <= parseInt(this.Container.style.width)) this.DisplayCount = nIndex;
			
			this.Images[nIndex].element = document.createElement("div");
			this.Images[nIndex].element.className = "thumbnail";
			
			this.Images[nIndex].element.style.marginTop = this.PaddingTop + "px";
			this.Images[nIndex].element.style.marginBottom = this.PaddingBottom + "px";
			this.Images[nIndex].element.style.marginRight = this.PaddingRight / 2 - this.BorderWidth + "px";
			this.Images[nIndex].element.style.marginLeft = this.PaddingLeft / 2 - this.BorderWidth + "px";
			
			this.Images[nIndex].image = new Image(this.imageWidth(nIndex), this.Height);
			
			this.Images[nIndex].image.src = this.Path + this.Images[nIndex].Name;
			this.Images[nIndex].image.id = this.Images[nIndex].lID;
			this.Images[nIndex].image.name = this.Images[nIndex].Name;
			this.Images[nIndex].image.title = this.Title;
			
			//this.Images[nIndex].image.onclick =  function(event) {self.selectImage(this.id); self.onClickMethod(this.id);}
			this.Images[nIndex].image.onclick =  function(event) {self.Selected = this.id; self.onClickMethod(this.id);}
			
			this.Images[nIndex].image.style.cursor = "pointer";			
			this.Images[nIndex].image.style.borderStyle = this.BorderStyle;
			this.Images[nIndex].image.style.borderWidth = this.BorderWidth + "px";
			this.Images[nIndex].image.style.borderColor = this.BorderColor;
			
			this.Images[nIndex].element.appendChild(this.Images[nIndex].image);
			this.DisplayArea.appendChild(this.Images[nIndex].element);
			
			this.Images[nIndex].nOffset = this.TotalWidth;
			this.TotalWidth += this.imageWidth(nIndex) + (this.PaddingLeft + this.PaddingRight)/2;
		}
		
		this.DisplayArea.style.width = this.TotalWidth + "px";
		this.Container.style.width = (this.Width + (this.PaddingLeft + this.PaddingRight)/2) * this.DisplayCount + "px";
		
		if (this.btnLeft != null)
		{
		    this.btnLeft = $(this.btnLeft);
		    this.btnLeft.onmousedown = function(event) {self.bMouseDown = true; self.movePrev(1);}
		    this.btnLeft.onmouseup = function(event) {self.bMouseDown = false; self.endMove();}
		    this.btnLeft.style.cursor = "pointer";	
		}
		
		if (this.btnRight != null)
		{
		    this.btnRight = $(this.btnRight);
		    this.btnRight.onmousedown = function(event) {self.bMouseDown = true; self.moveNext(1);}
		    this.btnRight.onmouseup = function(event) {self.bMouseDown = false; self.endMove();}
		    this.btnRight.style.cursor = "pointer";	
		}
		
		if (this.btnLeftFast != null)
		{
		    this.btnLeftFast = $(this.btnLeftFast);
		    this.btnLeftFast.onmousedown = function(event) {self.bMouseDown = true; self.movePrev(self.DisplayCount);}
		    this.btnLeftFast.onmouseup = function(event) {self.bMouseDown = false; self.endMove();}
		    this.btnLeftFast.style.cursor = "pointer";	
		}
		
		if (this.btnRightFast != null)
		{
		    this.btnRightFast = $(this.btnRightFast);
		    this.btnRightFast.onmousedown = function(event) {self.bMouseDown = true; self.moveNext(self.DisplayCount);}
		    this.btnRightFast.onmouseup = function(event) {self.bMouseDown = false; self.endMove();}
		    this.btnRightFast.style.cursor = "pointer";	
		}
		
		if (this.btnNext != null)
		{
		    this.btnNext = $(this.btnNext);
		    this.btnNext.onmousedown = function(event) { self.loadNext(); }
		    this.btnNext.style.cursor = "pointer";	
		}
		
		if (this.btnPrev != null)
		{
		    this.btnPrev = $(this.btnPrev);
		    this.btnPrev.onmousedown = function(event) { self.loadPrev(); }
		    this.btnPrev.style.cursor = "pointer";	
		}
		
		if (this.divCurrentImage != null) this.divCurrentImage = $(this.divCurrentImage);
		
		window.onresize = function(event) {self.resize();}
		this.resize();
		
		if (this.Selected == 0 || !this.exists(this.Selected)) this.Selected = this.Images[0].lID;
		this.selectImage(this.Selected);
	},
	
	resize: function() 
	{
		//this.Container.style.height = this.Height;
	},
	
	imageWidth: function(nIndex) 
	{
		if (this.Images[nIndex].Width > 0) 
			return Width = this.Images[nIndex].Width;
		else
			return this.Width;
	},
	
	screenWidth: function() 
	{
		if (UserAgent.browser == "Explorer") {
			return document.body.offsetWidth;
		}
		else {
			return window.innerWidth;
		}
	},
	
	screenHeight: function() 
	{
		if (UserAgent.browser == "Explorer") {
			return document.body.offsetHeight;
		}
		else {
			return window.innerHeight;
		}
	},
	
	clearImages: function() 
	{
		this.Images = new Array();
	},
	
	addImage: function(lID, Name, Width) 
	{
		var Image = new Object;
		
		Image.lID = lID;
		Image.Name = Name;
		Image.Width = Width;
		
		this.Images.push(Image);
	},
	
	exists: function(lID) 
	{
		var bExists = false;
		for (nIndex=0; nIndex<this.Images.length; nIndex++) 
		{
			if (this.Images[nIndex].lID == lID) bExists = true;
		}	
		return bExists;
	},
	
	loadNext: function()
	{
	    for (nIndex=0; nIndex<this.Images.length-1; nIndex++) 
		{
			if (this.Images[nIndex].lID == this.Selected) 
			{
                this.Selected = this.Images[nIndex+1].lID;
	            this.onClickMethod(this.Images[nIndex+1].lID);
	            //this.selectImage(this.Images[nIndex+1].lID);  
	            break;
			}
		}	
	},
	
	loadPrev: function()
	{
	    for (nIndex=1; nIndex<this.Images.length; nIndex++) 
		{
			if (this.Images[nIndex].lID == this.Selected) 
			{
                this.Selected = this.Images[nIndex-1].lID;
	            this.onClickMethod(this.Images[nIndex-1].lID);
	            //this.selectImage(this.Images[nIndex-1].lID);  
	            break;
			}
		}	
	},
	
	setScrollPosition: function(nIndex)
	{
        if (nIndex >= this.Current+this.DisplayCount) 
        {
            if (nIndex > this.Current+(this.DisplayCount*2))
                this.moveNext(nIndex-this.Current-this.DisplayCount+1);
            else
                this.moveNext(this.DisplayCount);
        }
        else if (nIndex < this.Current) 
        {
            if (this.Current-nIndex > this.DisplayCount)
                this.movePrev(this.Current-nIndex);
            else
                this.movePrev(this.DisplayCount);
        }
	},
	
	selectImage: function(lID) 
	{
		this.Selected = lID;
		
		for (nIndex=0; nIndex<this.Images.length; nIndex++) 
		{
			if (rgb2Hex(this.Images[nIndex].image.style.borderColor).toLowerCase() == this.BorderColorSel) this.Images[nIndex].image.style.borderColor = this.BorderColor;
			if (this.Images[nIndex].lID == lID) 
			{
			    this.Images[nIndex].image.style.borderColor = this.BorderColorSel;
			    if (this.divCurrentImage != null) this.divCurrentImage.innerHTML = (nIndex+1) + " ";
			    this.setScrollPosition(nIndex);
			}
		}
	},
	
	moveTo: function(nIndex, nCount) 
	{
		if (!this.bMoving) 
		{
			clearInterval(this.Timer);
			this.bMoving = true;
			this.Next = -1;
			
			if (this.TotalWidth > this.Images[nIndex].nOffset + parseInt(this.Container.style.width))
				this.TargetPos = this.Images[nIndex].nOffset;
			else
				this.TargetPos = this.TotalWidth - parseInt(this.Container.style.width);
			
			if (nCount == 1)
			    delay = this.Delay;
			else
			    delay = 1;
			
			if (this.TargetPos < this.Container.scrollLeft)
				this.Timer = setInterval(this.Key+".scrollToLeft("+nCount+")", delay);
			else
				this.Timer = setInterval(this.Key+".scrollToRight("+nCount+")", delay);
				
		}
		else {
			this.Next = nIndex;
		}
	},
	
	movePrev: function(nCount) 
	{
		if (this.Current > 0) 
		{
		    if (this.Current > nCount)
			    this.Current -= nCount;
			else
			    this.Current = 0;
			
			this.moveTo(this.Current, nCount);
		}
	},
	
	moveNext: function(nCount) 
	{
		if (this.Current < this.Images.length - this.DisplayCount) 
		{	    
		    if (this.Current + nCount < this.Images.length - this.DisplayCount)
		        this.Current += nCount;
		    else
		        this.Current = this.Images.length - this.DisplayCount;
			        
			this.moveTo(this.Current, nCount);
		}
	},
	
	endMove: function() 
	{
		if (!this.bMoving) clearInterval(this.Timer);
	},
	
	scrollToLeft: function(nCount) 
	{
		if (nCount == 1)
		    dist = this.Distance;
		else
		    dist = parseInt(this.Width/4);
		    
		if (this.Container.scrollLeft - dist < this.TargetPos)
			this.Container.scrollLeft = this.TargetPos;
		else
			this.Container.scrollLeft -= dist;
			
		if (this.Container.scrollLeft == this.TargetPos) {
		
			this.bMoving = false;
			clearInterval(this.Timer);
			
			if (this.Next == -1 && this.bMouseDown) {
				this.movePrev(nCount);
			}
			if (this.Next != -1) {
				this.moveTo(this.Next)
			};
		}
	},
	
	scrollToRight: function(nCount) 
	{
		if (nCount == 1)
		    dist = this.Distance;
		else
		    dist = parseInt(this.Width/4);
	
		if (this.Container.scrollLeft + dist > this.TargetPos)
			this.Container.scrollLeft = this.TargetPos;
		else
			this.Container.scrollLeft += dist;
		
		if (this.Container.scrollLeft == this.TargetPos) {
		
			this.bMoving = false;
			clearInterval(this.Timer);
			
			if (this.Next == -1 && this.bMouseDown) {
				this.moveNext(nCount);
			}
			if (this.Next != -1) {
				this.moveTo(this.Next)
			};
		}
	}
	
});