// UTILITES

function getMouseOffset(target, ev){
	ev = ev || window.event;

	var docPos    = getPosition(target);
	var mousePos  = mouseCoords(ev);
	return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y};
}

function getPosition(e){
	var left = 0;
	var top  = 0;

	while (e.offsetParent){
		left += e.offsetLeft;
		top  += e.offsetTop;
		e     = e.offsetParent;
	}

	left += e.offsetLeft;
	top  += e.offsetTop;

	return {x:left, y:top};
}

function mouseCoords(ev){
	if(ev.pageX || ev.pageY){
		return {x:ev.pageX, y:ev.pageY};
	}
	
	return {
		x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
		y:ev.clientY + document.body.scrollTop  - document.body.clientTop
	};
}


// MODEL LINE SCROLLER

var modelLineScroller = null;
var modelLineScrollerContainer = null;
var modelLineScrollerLeftMarker = null;
var modelLineScrollerRightMarker = null;
		
var modelLineScrollerCurrentPosition = 50;
var modelLineScrollerTargetPosition = 50;
var modelLineScrollerScrollInterval = null;

var modelLineScrollerContainerWidth = 732;
var modelLineScrollerMargin = 50;
var modelLineScrollerScrollSteps = 5;

function modelLineScrollerScroll(evt){
	
	modelLineScrollerContainerWidth = modelLineScrollerContainer.clientWidth;
			
	var modelLineScrollerXOffset = getMouseOffset(modelLineScrollerContainer, evt).x;
	var modelLineScrollerWidth = modelLineScroller.clientWidth;
	
	
	if(modelLineScrollerContainerWidth < (modelLineScrollerWidth + 2 * modelLineScrollerMargin)){
		var modelLineScrollerPosition = Math.round(modelLineScrollerMargin - (modelLineScrollerWidth - modelLineScrollerContainerWidth + modelLineScrollerMargin * 2) * (modelLineScrollerXOffset  / modelLineScrollerContainerWidth) );
		modelLineScrollerTargetPosition = modelLineScrollerPosition;
		modelLineScrollerMove();
	}
}

function modelLineScrollerMove(){
	if(modelLineScrollerTargetPosition != modelLineScrollerCurrentPosition){
		
		var modelLineScrollerLeftMarkerPosition = null;
		var modelLineScrollerRightMarkerPosition = null;
		
		var delta = Math.round((modelLineScrollerTargetPosition - modelLineScrollerCurrentPosition) / modelLineScrollerScrollSteps);
		
		if(delta != 0){	
			modelLineScrollerCurrentPosition += delta;
			modelLineScroller.style.left = modelLineScrollerCurrentPosition + "px";
		}
		else{
			modelLineScrollerCurrentPosition = modelLineScrollerTargetPosition ;
			modelLineScroller.style.left = modelLineScrollerCurrentPosition + "px";
		}
		
		var modelLineScrollerWidth = modelLineScroller.clientWidth;
		
	}
}

function initializeScroller(){
	modelLineScroller = document.getElementById('imagescontainer');
	modelLineScrollerContainer = document.getElementById('imagesbox');
	
	if(modelLineScrollerContainer){
		
		if(modelLineScrollerContainer.clientWidth > (modelLineScroller.clientWidth + 2 * modelLineScrollerMargin)){
			modelLineScrollerTargetPosition = Math.round(modelLineScrollerContainer.clientWidth / 2 - modelLineScroller.clientWidth / 2);
		}
		
		modelLineScrollerContainer.onmousemove = modelLineScrollerScroll;
		 
		setInterval('modelLineScrollerMove()', 20 );
	}
}