//Home page scroller

if(navigator.userAgent.indexOf("Chrome") > -1) {
	document.onselectstart = function () { return false; }
}

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

scroller.prevArrowNormalIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='/bravia/image/layout/btnNewScrollerPreviousArrowNormal.png')";
scroller.prevArrowPassiveIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='/bravia/image/layout/btnNewScrollerPreviousArrowPasive.png')";
scroller.prevArrowHoverIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='/bravia/image/layout/btnNewScrollerPreviousArrowHover.png')";

scroller.nextArrowNormalIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='/bravia/image/layout/btnNewScrollerNextArrowNormal.png')";
scroller.nextArrowPassiveIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='/bravia/image/layout/btnNewScrollerNextArrowPasive.png')";
scroller.nextArrowHoverIE6 = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enable='true',sizingMethod='crop',src='/bravia/image/layout/btnNewScrollerNextArrowHover.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('scroller_slider').style.left + 0);
    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('scroller_track').offsetWidth) - parseInt(document.getElementById('scroller_slider').offsetWidth);
    var posFromRight = availableTrack - posFromLeft;
    if(posFromRight < 0) posFromLeft = availableTrack;
    //set slider position
    if(scroller.holding)document.getElementById('scroller_slider').style.left = posFromLeft + 'px';
    //set gallery position
    scroller.moveGallery(posFromLeft, availableTrack);
	
	scroller.prevNextArrowVisibilityControl();
    return false;
}
scroller.moveGallery = function(left, width){
    var gallery = document.getElementById('scroller_gallery');
    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('scroller_gallerymask').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('scroller_gallery'))
    for(var i=0;i<prods.length;i++){
        if(prods[i].className == 'prod'){
            numProds++;
        }
    }
    return numProds;
}

scroller.getProdWidth = function(){
    var prods = document.getElementsByTagName('div', document.getElementById('scroller_gallery'))
    for(var i=0;i<prods.length;i++){
        if(prods[i].className == 'prod'){
            scroller.prodWidth = prods[i].offsetWidth;
            break;
        }
    }
}
scroller.jump = function(step,e){
    var availableTrack = this.getAvailableTrack();
    var leftPos;
    scroller.getProdWidth()    
    scroller.scrollBy((scroller.prodWidth * -step))
    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)+document.getElementById('scroller_track').offsetLeft+14)<parseInt(document.getElementById('scroller_slider').style.left))step = -1;
    this.jump(step);
}
scroller.getElementsByClassName = function(node, className) {
  var children = node.getElementsByTagName('*');
  var elements = new Array();

  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('scroller_gallery');
    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('scroller_gallery');
    var currPos = gallery.style.left;
    if(currPos=='')currPos = gallery.scrollLeft;
    return parseInt(currPos);
}
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('scroller_track').offsetWidth) - parseInt(document.getElementById('scroller_slider').offsetWidth);
}
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('scroller_slider').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('scroller_gallerymask').offsetWidth)
	var galleryLeft = parseInt(scroller.scrollerGallery.style.left);
	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)}