var imgScroller = function(params, imgs){
	this.d = document;
	this.cssClass = 'imgscroller';
	this.width = params.width;
	this.height = params.height;
	this.border = params.border;
	this.arrWidth = params.arrWidth;
	this.imgBorderRight  = params.imgBorderRight;
	this.id = this.cssClass + '_' + String(Math.random()).substr(3,8);
	this.imgs = imgs;
	this.initFrame();
	this.initLayer();
	this.addImages();
	this.initArrows();
	var _this = this;
	
	window.onload = function(){
		_this.resize('imgscroller');
	}
	window.onresize = function(){
		_this.resize('imgscroller');
	}
	
};

imgScroller.prototype.resize = function(cssClass){
	var divs = document.getElementsByTagName('div');
	var layer = null;
	var i = 0;
	try {
		for (i in divs) {
			if (cssClass == divs[i].className) {
				layer = divs[i].childNodes[0];
				if (divs[i].offsetWidth >= layer.offsetWidth) {
					layer.style.left = '0px';
					divs[i].childNodes[1].style.visibility = 'hidden';
					divs[i].childNodes[2].style.visibility = 'hidden';
				}
				else {
					divs[i].childNodes[1].style.visibility = 'visible';
					divs[i].childNodes[2].style.visibility = 'visible';
					var left = Math.abs(parseInt(layer.style.left));
					if(layer.offsetWidth - left < divs[i].offsetWidth){
						layer.style.left = divs[i].offsetWidth - layer.offsetWidth + 'px';
					}
				}
			}
		}
	} catch (err) {};
}

imgScroller.prototype.initFrame = function(){
	this.d.writeln('<div class="'+this.cssClass+'" id="'+this.id+'"></div>');
	
	this.frame = this.d.getElementById(this.id);
	this.frame.style.width = this.width;
	this.frame.style.height = this.height;
	this.frame.style.border = this.border;
}

imgScroller.prototype.addImages = function(){
	var v = null;
	var HTML = '';
	
	for (v in this.imgs){
		if (this.imgs[v].big){
			HTML+= '<a href="'+this.imgs[v].big+'" ';
			HTML+= (!this.imgs[v].rel) ? 'rel="lightbox" ' : 'rel="lightbox['+this.imgs[v].rel+']" ';
			HTML+= (!this.imgs[v].title) ? '' : 'title="'+this.imgs[v].title+'" ';
			HTML+= '>';
			HTML+= '<img src="'+this.imgs[v].small+'" height="'+this.height+'" style="';
			HTML+= (!this.imgBorderRight) ? '' : 'border-right:'+this.imgBorderRight+';';
			HTML+= '" /></a>';
		} else {
			if (!this.imgs[v].small) return;
			HTML+= '<img src="'+this.imgs[v].small+'" height="'+this.height+'" style="';
			HTML+= (!this.imgBorderRight) ? '' : 'border-right:'+this.imgBorderRight+';';
			HTML+= '" />';
		}
	}
	this.layer.innerHTML = HTML;
}

imgScroller.prototype.getEventMouseover = function(obj){
	var result = '';	
	result+= 'obj.childNodes[0].style.opacity = 0.5;';
	result+= 'obj.childNodes[1].style.opacity = 0.8;';
	result+= 'obj.childNodes[0].style.filter = \'alpha(opacity=50)\';';
	result+= 'obj.childNodes[1].style.filter = \'alpha(opacity=80)\';';
	
	result+= 'var layer = obj.parentNode.childNodes[0];';
	result+= 'var frame = layer.parentNode;';
	result+= 'imgScrollerStep = 2;'
	
	result+= 'if (/_left$/i.test(obj.className)) {';
		result+= 'imgScrollerTimer = setTimeout(function(){moveItRight(frame, layer)}, 10);';
	result+= '} else {';
		result+= 'imgScrollerTimer = setTimeout(function(){moveItLeft(frame, layer)}, 10);';
	result+= '};';	
	
	result+= 'function moveItLeft(frame, layer){';
		result+= 'var left = layer.offsetWidth - Math.abs(parseInt(layer.style.left));';
		result+= 'if (left > frame.offsetWidth) {';
		result+= 'layer.style.left = parseInt(layer.style.left) - imgScrollerStep + \'px\';';
			result+= 'imgScrollerTimer = setTimeout(function(){moveItLeft(frame, layer)}, 10);';
		result+= '} else {';
			result+= 'if (left - imgScrollerStep <= frame.offsetWidth){';
				result+= 'layer.style.left = frame.offsetWidth - layer.offsetWidth + \'px\';';
			result+= '}';	
		result+= '}';
	result+= '}';

	result+= 'function moveItRight(frame, layer){';
		result+= 'var left = parseInt(layer.style.left);';
		result+= 'if (left < 0) {';
			result+= 'layer.style.left = parseInt(layer.style.left) + imgScrollerStep + \'px\';';
			result+= 'imgScrollerTimer = setTimeout(function(){moveItRight(frame, layer)}, 10);';
		result+= '} else {';
			result+= 'if (left + imgScrollerStep >= 0){';
				result+= 'layer.style.left = \'0px\';';
			result+= '}';	
		result+= '}';
	result+= '}';
	
	return result;	
}

imgScroller.prototype.getEventMouseout = function(obj){
	var result = '';
	result+= 'obj.childNodes[0].style.opacity = 0.7;';
	result+= 'obj.childNodes[1].style.opacity = 1.0;';
	result+= 'obj.childNodes[0].style.filter = \'alpha(opacity=70)\';';
	result+= 'obj.childNodes[1].style.filter = \'alpha(opacity=100)\';';
		
	result+= 'clearTimeout(imgScrollerTimer);';
	
	return result;	
}

imgScroller.prototype.getEventMousedown = function(obj){
	var result = '';
	result+= 'obj.childNodes[1].style.opacity = 0.5;';
	result+= 'obj.childNodes[1].style.filter = \'alpha(opacity=50)\';';

	result+= 'if(imgScrollerStep < 10) {';
		result+= 'imgScrollerStep+= 2;';
	result+= '}';	
	return result;	
}

imgScroller.prototype.getEventMouseup = function(obj){
	var result = '';
	result+= 'obj.childNodes[1].style.opacity = 0.8;';
	result+= 'obj.childNodes[1].style.filter = \'alpha(opacity=80)\';';
	return result;	
}

imgScroller.prototype.initArrows = function(){
	// to right
	var rDiv = this.d.createElement('div');
	rDiv.className = this.cssClass + '_left';
	rDiv.setAttribute('direction', 'left');
	rDiv.style.height = this.height;
	rDiv.style.width = this.arrWidth;
	
	this.frame.appendChild(rDiv);
	var lDiv = rDiv.cloneNode(false);	
	
	var rDivBack = this.d.createElement('div');
	rDivBack.style.opacity = 0.7;
	rDivBack.style.filter = 'alpha(opacity=70)';
	rDivBack.style.backgroundColor = '#ffffff';
	rDivBack.style.height = this.height;
	rDivBack.style.width = this.arrWidth;
	rDiv.appendChild(rDivBack);
	this.addEvents(rDiv);
	
	var lDivBack = rDivBack.cloneNode(true);
	
	var rDivArr = this.d.createElement('div');
	rDivArr.style.height = this.height;
	rDivArr.style.width = this.arrWidth;
	rDivArr.style.position = 'absolute';
	rDivArr.style.top = '0px';
	rDivArr.style.left = '0px';
	rDivArr.className = this.cssClass + '_left_arr';
	rDiv.appendChild(rDivArr);
	var lDivArr = rDivArr.cloneNode(true);
	
	// to left
	lDiv.className = this.cssClass + '_right';
	lDiv.setAttribute('direction', 'right');
	this.frame.appendChild(lDiv);
	this.addEvents(lDiv);
	
	lDiv.appendChild(lDivBack);
	lDivArr.className = this.cssClass + '_right_arr';
	lDiv.appendChild(lDivArr);
	
	this.rDiv = rDiv;
	this.lDiv = lDiv;
}

imgScroller.prototype.addEvents = function(obj){
	var _this = this;
	
	// msie
	if(this.d.attachEvent){
		// onmouseover
		obj.attachEvent('onmouseover', function(){eval(_this.getEventMouseover(obj))});
		// onmouseout
		obj.attachEvent('onmouseout', function(){eval(_this.getEventMouseout(obj))});
		// onmousedown
		obj.attachEvent('onmousedown', function(){eval(_this.getEventMousedown(obj))});
		// onmouseup
		obj.attachEvent('onmouseup', function(){eval(_this.getEventMouseup(obj))});		
	// webkit, gecko, op			
	} else {
		// onmouseover
		obj.addEventListener('mouseover', function(){eval(_this.getEventMouseover(obj))}, false);
		// onmouseout
		obj.addEventListener('mouseout', function(){eval(_this.getEventMouseout(obj))}, false);	
		// onmousedown
		obj.addEventListener('mousedown', function(){eval(_this.getEventMousedown(obj))}, false);
		// onmouseup
		obj.addEventListener('mouseup', function(){eval(_this.getEventMouseup(obj))}, false);			
	}
}

imgScroller.prototype.initLayer = function(){
	var lDiv = this.d.createElement('div');
	lDiv.className = this.cssClass + '_layer';
	lDiv.style.top = '0px';
	lDiv.style.left = '0px';
	lDiv.style.position = 'absolute';
	lDiv.style.zIndex = 3;
	this.frame.appendChild(lDiv);
	this.layer = lDiv;
}