function Scrollbar(divID, classSfx, objName, barWidth, imgWidth, imgHeight){
	this.divID = divID;
	this.classSfx = classSfx;
	this.objName = objName;
	this.imgCount = 0;
	this.imgWidth = imgWidth;
	this.imgHeight = imgHeight;
	this.arrowWidth = 25;
	this.barWidth = barWidth;
	this.imgScroller = this.barWidth - this.arrowWidth * 2;
	this.numImgShown = Math.floor(this.imgScroller / this.imgWidth);
	this.leftArrMax = 0;
	this.scrollBy = this.numImgShown * 120;
	this.scrollStep = this.numImgShown;
	this.scrollPos = this.numImgShown;
	this.loadedImgs = new Array();
	for (i = 1; i <= this.numImgShown + 1; i++) {
		this.loadedImgs[i] = true;
	}
	this.imgs = new Array();
	this.addImg = addImg;
	this.loadBar = loadBar;
	this.leftArrowMouseover = leftArrowMouseover;
	this.leftArrowMouseout = leftArrowMouseout;
	this.rightArrowMouseover = rightArrowMouseover;
	this.rightArrowMouseout = rightArrowMouseout;
	this.leftArrowClick = leftArrowClick;
	this.rightArrowClick = rightArrowClick;
	this.checkArr = checkArr;
	this.loadImgs = loadImgs;
}

function addImg(img, link, title){
	this.imgCount++;
	this.imgs[this.imgCount] = new Array();
	this.imgs[this.imgCount]['img'] = img;
	this.imgs[this.imgCount]['link'] = link;
	this.imgs[this.imgCount]['title'] = title;
}

function loadBar(){
	this.rightArrMax = parseInt((-this.imgWidth * (this.imgCount - this.numImgShown)));
	html='<span class="left-arrow-'+this.objName+'" id="left-arrow-disable'+this.classSfx+'" onmouseover="'+this.objName+'.leftArrowMouseover()" onmouseout="'+this.objName+'.leftArrowMouseout()" onclick="'+this.objName+'.leftArrowClick()"></span><div id="cust-scroller-'+this.objName+'" style="width:'+this.imgScroller+'px; overflow:hidden; display:inline; float:left; white-space:nowrap; position:relative;"><div id="cust-scroller-2-'+this.objName+'" style="z-index:1; white-space:nowrap; width:'+this.imgScroller+'px; overflow:hidden; position:relative;"><ul id="cust-scroll-'+this.objName+'" style="white-space:nowrap; padding:0px !important; width:10000px; position:relative; left:0px;">';
	for (i = 1; i <= this.imgCount; i++) {
		html=html+'<li class="bar-thumbs'+this.classSfx+'"><a href="'+this.imgs[i]['link']+'" class="bar-thumb'+this.classSfx+'" id="bar-thumb-'+this.objName+'-'+i+'">';
		if (i <= this.numImgShown + 1) {
			html = html + '<img src="' + this.imgs[i]['img'] + '" title="' + this.imgs[i]['title'] + '" alt="' + this.imgs[i]['title'] + '" style="width:' + this.imgWidth + 'px; height:' + this.imgHeight + 'px;"/>';
		}
		html=html+'</a></li>';
	}
	html=html+'</ul></div></div><span class="right-arrow-'+this.objName+'" ';
	if (this.imgCount <= this.barWidth/120) {
		html=html+'id="right-arrow-disable'+this.classSfx+'"';
	}else{
		html=html+'id="right-arrow-default'+this.classSfx+'"';
	}
	html=html+' onmouseover="'+this.objName+'.rightArrowMouseover()" onmouseout="'+this.objName+'.rightArrowMouseout()" onclick="'+this.objName+'.rightArrowClick()"></span>';
	jQuery("#"+this.divID).html(html);
}

function leftArrowMouseover(){
	if(jQuery(".left-arrow-" + this.objName).attr("id") != 'left-arrow-disable'+this.classSfx) {
		jQuery(".left-arrow-" + this.objName).attr("id", "left-arrow-over"+this.classSfx);
	}
}

function leftArrowMouseout(){
	if(jQuery(".left-arrow-" + this.objName).attr("id") != 'left-arrow-disable'+this.classSfx) {
		jQuery(".left-arrow-" + this.objName).attr("id", "left-arrow-default"+this.classSfx);
	}
}

function rightArrowMouseover(){
	if(jQuery(".right-arrow-" + this.objName).attr("id") != 'right-arrow-disable'+this.classSfx){
		jQuery(".right-arrow-" + this.objName).attr("id", "right-arrow-over"+this.classSfx);
	}
}

function rightArrowMouseout(){
	if(jQuery(".right-arrow-" + this.objName).attr("id") != 'right-arrow-disable'+this.classSfx){
		jQuery(".right-arrow-" + this.objName).attr("id", "right-arrow-default"+this.classSfx);
	}
}

function leftArrowClick(){
	leftpos = parseInt(jQuery('#cust-scroll-'+this.objName).css("left"));
	if (leftpos < this.leftArrMax && -leftpos / this.imgWidth == this.scrollPos - this.scrollStep) {
		leftpos = leftpos + this.scrollBy;
		if (leftpos > this.leftArrMax) {
			leftpos = this.leftArrMax
		}
		if (leftpos == this.leftArrMax) {
			jQuery(".left-arrow-" + this.objName).attr("id", "left-arrow-disable"+this.classSfx);
		}
		jQuery('#cust-scroll-' + this.objName).animate(
			{left: leftpos},
			{duration: 1300, easing: 'easeInQuad'}
		);
		this.scrollPos = this.scrollPos - this.scrollStep;
		if (this.scrollPos < this.scrollStep) {
			this.scrollPos = this.scrollStep;
		}
		this.checkArr();
	}
}

function rightArrowClick(){
	leftpos = parseInt(jQuery('#cust-scroll-'+this.objName).css("left"));
	if (leftpos > this.rightArrMax && -leftpos / this.imgWidth == this.scrollPos - this.scrollStep) {
		leftpos = leftpos + -this.scrollBy;
		if (leftpos < this.rightArrMax) {
			leftpos = this.rightArrMax
		}
		if (this.scrollPos >= this.imgCount) {
			leftpos = this.rightArrMax;
		} //fail safe
		if (leftpos == this.rightArrMax) {
			jQuery(".right-arrow-" + this.objName).attr("id", "right-arrow-disable"+this.classSfx);
		}
		jQuery('#cust-scroll-'+this.objName).animate(
			{left: leftpos},
			{duration: 1300, easing: 'easeInQuad'}
		);
		this.scrollPos = this.scrollPos + this.scrollStep;
		if (this.scrollPos > this.imgCount) {
			this.scrollPos = this.imgCount;
		}
		this.checkArr();
		if (leftpos >= this.rightArrMax) {
			this.loadImgs(); //Only on right arrow since only new images can come from the right.
		}
	}
}

function checkArr(){
	left = parseInt(jQuery('#cust-scroll-'+this.objName).css("left"));
	if(left <= this.rightArrMax){
		jQuery(".right-arrow-"+this.objName).attr("id", "right-arrow-default"+this.classSfx);;
	}
	if(left >= this.leftArrMax){
		jQuery(".left-arrow-"+this.objName).attr("id", "left-arrow-default"+this.classSfx);;
	}
}

function loadImgs(){
	for (i = this.scrollPos - this.scrollStep; i <= this.scrollPos + 1; i++) {
		if (this.loadedImgs[i] === undefined && i <= this.imgCount) {
			//Append thumb to the list
			thumb = '<img src="' + this.imgs[i]['img'] + '" title="' + this.imgs[i]['title'] + '" alt="' + this.imgs[i]['title'] + '" style="width:' + this.imgWidth + 'px; height:' + this.imgHeight + 'px;" />';
			jQuery("#bar-thumb-" + this.objName + "-" + i).html(thumb);
			this.loadedImgs[i] = true;
		}
	}
}

