var scroller = {};
scroller.holding = false;
scroller.xPos = 0;
scroller.fingerPos = 0;
scroller.prodWidth = 0;
scroller.numProds = 0;
scroller.prevArrow = document.getElementById('prizesPrevButton'); 
scroller.nextArrow = document.getElementById('prizesNextButton');
scroller.scrollerGallery = document.getElementById('prizesGallery');
scroller.gLeft = 0;
scroller.gEnd = 0;

scroller.prevArrowNormalIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='img/arrow-prev.png')";
scroller.prevArrowPassiveIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='img/arrow-prev.png')";
scroller.prevArrowHoverIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='img/arrow-prev.png')";

scroller.nextArrowNormalIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='img/arrow-next.png')";
scroller.nextArrowPassiveIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='img/arrow-next.png')";
scroller.nextArrowHoverIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='img/arrow-next.png')";

// Default values for previous and next arrows
scroller.scrollerGallery.style.left = 0;
scroller.prevArrow.style.cursor = "default";

var isIE = navigator.userAgent.indexOf('MSIE') > -1;
var isIE6 = navigator.userAgent.indexOf('MSIE 6.0') > -1;

if(isIE6) 
{
	scroller.prevArrow.style.filter = scroller.prevArrowPassiveIE6;	
	scroller.nextArrow.onmouseover = function () { scroller.nextArrow.style.filter = scroller.nextArrowHoverIE6; };	
	scroller.nextArrow.onmouseout = function () { scroller.nextArrow.style.filter = scroller.nextArrowNormalIE6; };	
}
else 
{
	scroller.prevArrow.className = "passive";
	scroller.nextArrow.onmouseover = function () { scroller.nextArrow.className = "hover"; };
	scroller.nextArrow.onmouseout = function () { scroller.nextArrow.className = ""; };
}

scroller.hold = function(e){
	this.listen(e);
    this.holding = true;
    scroller.fingerPos = e.clientX - parseInt(document.getElementById('prizesThumb').style.left + 0, 10);
    scroller.getProdWidth();
    return false;
};
scroller.move = function(e){
    scroller.xPos = e.clientX;
    //prevent scroll beyond LHS
    var posFromLeft = scroller.xPos - scroller.fingerPos;
    if(posFromLeft < 0){posFromLeft = 0;}
    //prevent scroll beyond RHS
    var availableTrack = parseInt(document.getElementById('prizesTrack').offsetWidth, 10) - parseInt(document.getElementById('prizesThumb').offsetWidth, 10);
    var posFromRight = availableTrack - posFromLeft;
    if(posFromRight < 0){posFromLeft = availableTrack;}
    //set slider position
    if(scroller.holding){document.getElementById('prizesThumb').style.left = posFromLeft + 'px';}
    //set gallery position
    scroller.moveGallery(posFromLeft, availableTrack);
	
	scroller.prevNextArrowVisibilityControl();
    return false;
};
scroller.moveGallery = function(left, width){
    var gallery = document.getElementById('prizesGallery');
    var galleryWidth = 0; //gallery.offsetWidth;
    //calculate width of gallery based on the number of products
    if(scroller.numProds===0){scroller.numProds = scroller.getNumProds();}
    if(this.numProds>0){
        galleryWidth = this.prodWidth * this.numProds;
    }
    maskWidth = document.getElementById('prizesGalleryMask').offsetWidth;
    scrollableWidth = galleryWidth - maskWidth;
    
    if(scrollableWidth > 0){
        gallery.style.left = -((scrollableWidth / width) * left) + 'px';
    }
};
scroller.getNumProds = function(){
    var numProds = 0;
    var prods = document.getElementsByTagName('div', document.getElementById('prizesGallery'));
    for(var i=0;i<prods.length;i++){
        if(prods[i].className == 'sPrize'){
            numProds++;
        }
    }
    return numProds;
};

scroller.getProdWidth = function(){
    var prods = document.getElementsByTagName('div', document.getElementById('prizesGallery'));
    for(var i=0;i<prods.length;i++){
        if(prods[i].className == 'sPrize'){
            scroller.prodWidth = prods[i].offsetWidth;
            break;
        }
    }
};
scroller.jump = function(step,e){
    var availableTrack = this.getAvailableTrack();
    var leftPos;
    scroller.getProdWidth();
    scroller.scrollBy((scroller.prodWidth * -step * 5));//edit * 5
    this.matchScrollBar();
	scroller.prevNextArrowVisibilityControl();
	if (e) {
		if (step > 0 && this.gLeft != -this.gEnd && (scroller.nextArrow.onclick)) {
			if(isIE6) {
				scroller.nextArrow.style.filter =  scroller.nextArrowHoverIE6;
			
			} else {
				scroller.nextArrow.className="hover";
			}
		} else if (step < 0 && this.gLeft !== 0) {
				if(isIE6) {
				scroller.prevArrow.style.filter =  scroller.prevArrowHoverIE6;
			} else {
				scroller.prevArrow.className="hover"; 
			}
		}
	}
};
scroller.jumpTrack = function(e){
    //user clicked on the track, so work out which direction to jump
    var step = 1;
    if(e.clientX-(parseInt(this.getElementsByClassName(document.body, 'main')[0].offsetLeft, 10)+document.getElementById('prizesTrack').offsetLeft+14)<parseInt(document.getElementById('scroller_slider').style.left, 10)){step = -1;}
    this.jump(step);
};
scroller.getElementsByClassName = function(node, className) {
  var children = node.getElementsByTagName('*');
  var elements = [];

  for (var i = 0; i < children.length; i++) {
    var child = children[i];
    var classNames = child.className.split(' ');
    for (var j = 0; j < classNames.length; j++) {
      if (classNames[j] == className) {
        elements.push(child);
        break;
      }
    }
  }
  return elements;
};
scroller.clickBar = function(e){
    e.cancelBubble = true;    
};
scroller.scrollBy = function(distance){
    var gallery = document.getElementById('prizesGallery');
    var currPos = this.getCurrentGalleryPosition();
    var galleryWidth = this.getGalleryWidth();

    if(currPos<0 && distance>0){
        if(-currPos<distance){currPos = distance = 0;}
        gallery.style.left = (currPos + distance) + 'px';
    }
    else{
        if(currPos>((5*this.prodWidth)-galleryWidth) && distance<0){
            if((currPos + distance)<((5*this.prodWidth)-galleryWidth)){
                currPos = (5*this.prodWidth)-galleryWidth;
                distance = 0;
            }
            gallery.style.left = (currPos + distance) + 'px';
        }
    }
};
scroller.getCurrentGalleryPosition = function(){
    var gallery = document.getElementById('prizesGallery');
    var currPos = gallery.style.left;
    if(currPos===''){currPos = gallery.scrollLeft;}
    return parseInt(currPos, 10);
};
scroller.getGalleryWidth = function(){
    var galleryWidth = 0;
    if(this.numProds===0){this.numProds = this.getNumProds();}
    if(this.numProds>0){galleryWidth = this.prodWidth * this.numProds;}
    return galleryWidth;
};
scroller.getAvailableTrack = function(){
    return parseInt(document.getElementById('prizesTrack').offsetWidth, 10) - parseInt(document.getElementById('prizesThumb').offsetWidth, 10);
};
scroller.matchScrollBar = function(){
    //position scrollbar to match the position of the gallery
    var galleryPos = this.getCurrentGalleryPosition();
    var maxScrollAmount = this.getGalleryWidth() - (5*this.prodWidth);
    var percentageScrolled = -galleryPos * 100 / maxScrollAmount;
    var scrollbarMaxScrollAmount = this.getAvailableTrack();
    document.getElementById('prizesThumb').style.left = (scrollbarMaxScrollAmount * percentageScrolled / 100) + 'px';
};
scroller.release = function(e){
    scroller.stopListening(e);
    scroller.holding = false;
    return false;
};
scroller.listen = function(e){
    if(isIE) {
        document.attachEvent("onmousemove", scroller.move);
        document.attachEvent("onmouseup", scroller.release);
        window.event.cancelBubble = true;
        window.event.returnValue = false;
    }
    else{
        document.addEventListener("mousemove", scrollerMove, true);
        document.addEventListener("mouseup", scrollerRelease, true);
        e.preventDefault();
    }      
};
scroller.stopListening = function(e){
    if(isIE) {
        document.detachEvent("onmousemove", scroller.move);
        document.detachEvent("onmouseup",   scroller.release);
    }
    else{
        document.removeEventListener("mousemove", scrollerMove,   true);
        document.removeEventListener("mouseup",   scrollerRelease, true);
    }
};

scroller.prevNextArrowVisibilityControl = function(){

	var prodItemLength = scroller.getNumProds();
	prodsLength = scroller.prodWidth * prodItemLength;
	leftEndNum = prodsLength - parseInt(document.getElementById('prizesGalleryMask').offsetWidth, 10);
	var galleryLeft = parseInt(scroller.scrollerGallery.style.left, 10);
	this.gLeft = galleryLeft;
	this.gEnd = leftEndNum;
	// when the previous arrow was the first item
	if(galleryLeft === 0)
	{
		scroller.prevArrow.style.cursor = "default";		
		
		if(isIE6) 
		{
			scroller.prevArrow.style.filter = scroller.prevArrowPassiveIE6;	
			scroller.prevArrow.onmouseover = function(){ scroller.prevArrow.style.filter =  scroller.prevArrowPassiveIE6; };
			scroller.prevArrow.onmouseout = function(){ scroller.prevArrow.style.filter = scroller.prevArrowPassiveIE6; };
		}
		else 
		{
			scroller.prevArrow.className = "passive";
			scroller.prevArrow.onmouseover = function(){ scroller.prevArrow.className="passive"; };
			scroller.prevArrow.onmouseout = function(){ scroller.prevArrow.className="passive"; };
		}
	
	} 
	else
	{
		scroller.prevArrow.style.cursor = "pointer";

		if(isIE6) 
		{
			scroller.prevArrow.style.filter = scroller.prevArrowNormalIE6;
			scroller.prevArrow.onmouseover = function(){ scroller.prevArrow.style.filter = scroller.prevArrowHoverIE6;};
			scroller.prevArrow.onmouseout = function(){ scroller.prevArrow.style.filter = scroller.prevArrowNormalIE6;};
		}
		else 
		{
			scroller.prevArrow.className = "";
			scroller.prevArrow.onmouseover = function(){ scroller.prevArrow.className="hover"; };
			scroller.prevArrow.onmouseout = function(){ scroller.prevArrow.className=""; };
		}

	}
	
	// when the previous arrow was the last item
	if(galleryLeft == -leftEndNum)
	{
		scroller.nextArrow.style.cursor = "default";

		if(isIE6) 
		{
			scroller.nextArrow.style.filter = scroller.nextArrowPassiveIE6;	
			scroller.nextArrow.onmouseover = function(){ scroller.nextArrow.style.filter =  scroller.nextArrowPassiveIE6; };
			scroller.nextArrow.onmouseout = function(){ scroller.nextArrow.style.filter = scroller.nextArrowPassiveIE6; };
		}
		else 
		{
			scroller.nextArrow.className = "passive";
			scroller.nextArrow.onmouseover = function(){ scroller.nextArrow.className="passive"; };
			scroller.nextArrow.onmouseout = function(){ scroller.nextArrow.className="passive"; };
		}
	} 
	else 
	{
		scroller.nextArrow.style.cursor = "pointer";
		
		if(isIE6) 
		{
			scroller.nextArrow.style.filter = scroller.nextArrowNormalIE6;	
			scroller.nextArrow.onmouseover = function(){ scroller.nextArrow.style.filter =  scroller.nextArrowHoverIE6; };
			scroller.nextArrow.onmouseout = function(){ scroller.nextArrow.style.filter = scroller.nextArrowNormalIE6; };
		}
		else 
		{
			scroller.nextArrow.className = "";
			scroller.nextArrow.onmouseover = function(){ scroller.nextArrow.className="hover"; };
			scroller.nextArrow.onmouseout = function(){ scroller.nextArrow.className=""; };
		}
	}	  
};

scrollerMove = function(e){scroller.move(e);};
scrollerRelease = function(e){scroller.release(e);};