imageSrcArray = new Array("images-2009/video-bar/shows.jpg", "images-2009/video-bar/star.jpg", "images-2009/video-bar/viva.jpg", "images-2009/video-bar/blog-news.jpg");
imageURLArray = new Array("http://www.proarts.ca/proarts/shows-to-go.html", "http://www.proarts.ca/proarts/star-in-your-own.html", "http://www.proarts.ca/proarts/viva/lasdivas-mov.html", "http://www.proarts.ca/proarts/news-blog.html");
var imageMargin = 15;
var imageBorderSize = 0;
var imageBorderStyle = 'solid #555';
var imageWidth = 160;
var containerWidth = 950;

imageArray = new Array();
var totalImageWidth;
var container;

var speed=0.6;
var position= 0;
var defaultChange = 1;

var delay = 40;



function initScroller(scrollContainerId) {
	
	container = document.getElementById(scrollContainerId);
	
	container.style.overflow = "hidden";
	
	id=0;
	for(var i=0; i < 4; i++) {
	for(var imgi=0; imgi < imageSrcArray.length; imgi++) {

		container.innerHTML = container.innerHTML + '<a href="' + imageURLArray[imgi] + '" id="scroller-image-' + id + '"><img src="' + imageSrcArray[imgi] + '" style="border:'+ imageBorderSize + 'px ' + imageBorderStyle+'; width:' + imageWidth + 'px"/></a>';
		imageArray[id] = document.getElementById('scroller-image-' + id);
		imageArray[id].style.margin = imageMargin + 'px';
		/*imageArray[id].style.border = imageBorderSize + 'px ' + imageBorderStyle;
		imageArray[id].style.width = imageWidth + 'px';*/
		
		id++;
	}
	}
	totalImageWidth = imageWidth + (2*imageBorderSize) + (4*imageMargin);
	
	totalImages=id;
	scroll();
	
	initMouseControl(scrollContainerId);
	
}

var imageId =0;
function scroll() {
		
	//var offset = position - (totalImageWidth*imageId);
	var offset = position;
	
	if(offset > imageMargin) {
			   		imageId = getNext(imageId, 'down', totalImages-1, 1);
		var imageToMove = document.getElementById('scroller-image-' + imageId);
		var newImage = imageToMove.cloneNode(true);
		newImage.id = 'TEMPTEMPTEMP';
	   container.removeChild(imageToMove);
	   container.insertBefore(newImage, container.firstChild);
	   newImage.id = 'scroller-image-' + imageId;
	   newImage.style.margin = imageMargin + 'px ' + imageMargin + 'px ' + imageMargin + 'px ' + (-1*totalImageWidth) + 'px';

		position=-1*totalImageWidth;
setTimeout('scroll()', delay/1);
	return;
	   
	}
	if(offset < -1*totalImageWidth) {
		var imageToMove = document.getElementById('scroller-image-'  + imageId);
		var newImage = imageToMove.cloneNode(true);
		newImage.id = 'TEMPTEMPTEMP';
	   container.removeChild(imageToMove);
	   container.appendChild(newImage);
	   newImage.id = 'scroller-image-'  + imageId;
	   
	   newImage.style.margin = imageMargin + 'px';
	   
		imageId = getNext(imageId, 'up', totalImages-1, 1);
setTimeout('scroll()', delay/1);
	position=0;

	return;
	   
	}
	

	
	position = getNext(position, 'up', (totalImages*totalImageWidth)-1, defaultChange*speed);
	
	
	
	document.getElementById('scroller-image-' + imageId).style.margin = imageMargin + 'px ' + imageMargin + 'px ' + imageMargin + 'px ' + (imageMargin+offset) + 'px';
	
	setTimeout('scroll()', delay);

}


function debug(txt) {
	document.getElementById('debug').innerHTML = txt + "<br/>" + document.getElementById('debug').innerHTML;
}

function getNext(current, direction, total, change) {

	if(direction == 'up') {
		var next = (current >= total) ? 0 : current+change;
	} else {
		var next = (current <= 0) ? total : current-change;
	}
	return next;
}

var controller;

var mouseon = false;
var IE = document.all?true:false


function initMouseControl(scrollContainerId) {
	controller = document.getElementById(scrollContainerId);
	// If NS -- that is, !IE -- then set up for mouse capture
    if (!IE) document.captureEvents(Event.MOUSEMOVE)
	
	controller.onmouseover = function() {
			mouseon = true;
		}
		controller.onmouseout = function() {
			mouseon = false;
		}

		//document.onmousemove = control;
		
		addEvent(document, 'mousemove', control);
		

}
var reverseOrder = true;

function control(e) {
	if(mouseon == true) {
		var logBox = document.getElementById('log');
		if (IE) {
	      tempX = event.clientX + document.body.scrollLeft
        } else {  // grab the x-y pos.s if browser is NS
          tempX = e.pageX
        }
		var pos = tempX - findPosX(controller);
	    
		var centered = 2*(pos-(containerWidth/2))/containerWidth;
		speed = -centered*4;
	}
}


function findPosX(obj)
  {
    var curleft = 0;
    if(obj.offsetParent)
        while(1) 
        {
          curleft += obj.offsetLeft;
          if(!obj.offsetParent)
            break;
          obj = obj.offsetParent;
        }
    else if(obj.x)
        curleft += obj.x;
    return curleft;
  }
  
function addEvent(obj, evType, fn){ 
 if (obj.addEventListener){ 
   obj.addEventListener(evType, fn, false); 
   return true; 
 } else if (obj.attachEvent){ 
   var r = obj.attachEvent("on"+evType, fn); 
   return r; 
 } else { 
   return false; 
 } 
}