Array.prototype.sum = function() {
  return (! this.length) ? 0 : this.slice(1).sum() +
      ((typeof this[0] == 'number') ? this[0] : 0);
};

var ScrollHwebisodes = {
    Init: function() {
        //elements
        var sMove = $('#ScrollMovableArea')
        var sWrap = $('#ScrollStaticHolder')
        var arrowLT = $('#arrowLT a');
        var arrowRT = $('#arrowRT a');

        var holder = document.getElementById('ScrollStaticHolder');
        var moveArea = document.getElementById('ScrollMovableArea');
        var holderW = holder.offsetWidth;
        var moveAreaW = moveArea.offsetWidth;
        var speed = 10;
        var scrollLeftInt;
        var scrollRightInt;
        var x = 0;


        arrowRT.voidLink().mousedown(mousedownLeft).mouseup(mouseupLeft);
        arrowLT.voidLink().mousedown(mousedownRight).mouseup(mouseupRight);

        function mousedownLeft() {
            scrollLeftInt = setInterval(scrollLeft, speed);
        }
        function mouseupLeft() {
            clearInterval(scrollLeftInt);
        }
        function mousedownRight() {
            scrollRightInt = setInterval(scrollRight, speed);
        }
        function mouseupRight() {
            clearInterval(scrollRightInt);
        }
        arrowLT.addClass('off');

        function scrollLeft() {
            x += speed;
            var max = moveAreaW - holderW;
            if (moveArea.offsetLeft > -max) {
                moveArea.style.left = -(moveArea.offsetLeft + x) + 'px';
                arrowLT.removeClass('off');
            } else {
                clearInterval(scrollLeftInt);
                x = 0;
                arrowRT.addClass('off');
            }
        }
        function scrollRight() {
            var max = moveAreaW - holderW;
            if (moveArea.offsetLeft < 0) {
                moveArea.style.left = (moveArea.offsetLeft + speed) + 'px';
                arrowRT.removeClass('off');
            } else {
                clearInterval(scrollLeftInt);
                arrowLT.addClass('off');
            }
        }

    }
}


var ScrollHproducts = {
	Init : function() {
		
		//set moveArea width
		var sContentLeft = $('.sContentLeft')
		var sContent = $('.sContent')
		var sContentRight = $('.sContentRight')
		
		//console.log(sContentLeft.width()+ ' :: '+ sContent.width() + ' :: '+sContentRight.width() )
		var wrapperWidth = $('.sWrap').width();
		var moveAreaWidth = (sContentLeft.width()+sContent.width()+sContentRight.width());
		var moveAreaWidthCss = (sContentLeft.width()+sContent.width()+sContentRight.width())*5 + 'px';
		$('.sMove').css('width', moveAreaWidthCss)
		//console.log($('.sMove').width()+' /// '+moveAreaWidth);
		

		
		
		//arrow clicks
		$('#arrowRT a').voidLink().mousedown(function(){animateLeft();});
		$('#arrowLT a').voidLink().mousedown(function(){animateRight();});
		$('#arrowLT a').addClass('off');

		var index = 0;
		var beforeArray = new Array();
		function setAnimation(){
			if(index < ($('.sMove ul li').length-1)){
				for(var i = 0; i < index; i++){
					beforeArray.push($('.sMove ul li:eq('+i+')').width());
				}
				$('.sMove').animate({
					left : -beforeArray.sum()
				},1000);
			}else{
				$('.sMove').stop();
			}
		}
		setAnimation();
		function animateLeft(){
			if(index < ($('.sMove ul li').length-1)){
				index += 1;
				beforeArray.push($('.sMove ul li:eq('+index+')').width());
				$('.sMove').animate({
					left : -beforeArray.sum()
				},500);
				if(index == ($('.sMove ul li').length-1)){
					$('#arrowRT a').addClass('off');
				}
			}else{
				$('.sMove').stop();
			}
			$('#arrowLT a').removeClass('off');
		}
		function animateRight(){
			if(index > 0){
				index -= 1;
				beforeArray.pop(index+1)
				$('.sMove').animate({
					left : -beforeArray.sum()
				},500);
				if(index==0){
					$('#arrowLT a').addClass('off');
				}
			}else{
				$('.sMove').stop();
				
			}
			$('#arrowRT a').removeClass('off');
			
		}
	}
}

var ScrollV = {
	 Init: function(){
		var speed = 1500;
		var scrollContainer = $('#scrollContainer');
		var scrollArea = $('#scrollArea');
		var track = $('#track');
		var thumb = $('#thumb');
		var trackHeight = track.parent().height() - thumb.height();
		var st = -(scrollArea.height() + 200);

		/*set product family container to bottom and then auto-scroll up  */
		/*Drag is inited when auto-scroll finishes */

		
		
		var newTop;
		var percentageTop;
		var prodFam = $('.productFamily:visible');
		var entries = $('.productFamily:visible .entry');
		
		
		//tracking product families
		//console.log(prodFam.get(0))
		if(prodFam.hasClass('.cranberry')){
			_hbPageView('[cranberry raisinets]','products');
		}
		if(prodFam.hasClass('.darkChocolate')){
			_hbPageView('[dark chocolate]','products');
		}
		if(prodFam.hasClass('.milkChocolate')){
			_hbPageView('[milk chocolate]','products');
		}

		
		thumb.voidLink().draggable({ 
			axis: 'y',
			containment: 'parent', 
			start: function() {
				scrollArea.css({
					top: 0
				});
				thumb.css({
					top: 0
				});
			},
			drag : function(){
				var ThumboffSet = thumb.position();
				percentageTop = ThumboffSet.top / trackHeight;
				newTop = ( scrollArea.height() - scrollArea.parent().height() ) * percentageTop;
				scrollArea.css({ 'top': -newTop });
				
			},
			stop : function() {
				/*this is where we could put a snapping effect*/
				
			}
		});
	}
}