﻿// ################################################################################################################################################################## 
// ### Scrolling.js
// =================================================================================================================================================================



// JScript File

    var scrollTimer;
    
    var scrollJumpCatalogue;
    var scrollJumpSmallCart = 60;
    var scrollJumpProductColours = 55;
    var scrollJumpRelatedItems = 55;

    var extraScroll; // to scroll up correctly when scroll down has not used the whole scrolling unit

    var scrollClickCount;
    var scrollClickCountCatalogue = 0;
    var scrollClickCountSmallCart = 0;
    var scrollClickCountProductColours = 0;
    var scrollClickCountRelatedItems = 0;
    
    var catalogueScrollID = 'ScScrollDivCatalogue';
    var smallCartScrollID = 'ScScrollDivCartCont';
    var scrollProductColoursID = 'ScScrollDivProdColours';
    var scrollRelatedItemsID = 'ScScrollDivRelatedItems';
    
    var numberOfItemsCatalogue;
    var numberOfItemsSmallCart;
    var numberOfItemsProductColours;
    var numberOfItemsRelatedItems;
    
    
    //This setup is not quite accurate, you have to experiment
    var numberOfVisibleItemsCatalogue;
    var numberOfVisibleItemsSmallCart = 6;
    var numberOfVisibleItemsProductColours = 3;
    var numberOfVisibleItemsRelatedItems = 5;
    

var currentIdToScroll = '';
var wheelScrollCount = 3;


  function hookEvent(element, eventName, callback, id)
    {
        if(id != currentIdToScroll)
        {
            if(typeof(element) == "string")
                element = document.getElementById(element);
            if(element == null)
                return;
            if(element.addEventListener)
            {
                if(eventName == 'mousewheel')
                    element.addEventListener('DOMMouseScroll', callback, false);  

                element.addEventListener(eventName, callback, false);
            }
            else if(element.attachEvent)
                element.attachEvent("on" + eventName, callback);

            currentIdToScroll = id;
        }
    }

    function mouseScroll(e)
    {
        if (wheelScrollCount % 3 == 0)
        {
            var delta = 0;
            if(isIE() || isSafari())
            {
                delta = e.wheelDelta;
            }
            else
            {
                e = e ? e : window.event;
                delta = e.detail ? e.detail * -1 : e.wheelDelta / 40;
            }
            
	        if (delta < 0)
            {
                downArrowClick(currentIdToScroll);
            }
	        else
	        {
		        upArrowClick(currentIdToScroll);
            }
            wheelScrollCount = 0;
        }
        wheelScrollCount++;
    }


    function GetScrollJumpValue(senderId, isScrollDown)
    {
        if (senderId.indexOf(catalogueScrollID) == 0)
        {
            if (scrollJumpCatalogue)
                return (isScrollDown ? scrollJumpCatalogue : scrollJumpCatalogue * (-1) );
            else
                return (isScrollDown ? 100 : -100);
        }
        else if (senderId.indexOf(smallCartScrollID) == 0)
        {
            return (isScrollDown ? scrollJumpSmallCart : scrollJumpSmallCart * (-1) );
        }
        else if (senderId.indexOf(scrollProductColoursID) == 0)
        {
            return (isScrollDown ? scrollJumpProductColours : scrollJumpProductColours * (-1) );
        }
        else if (senderId.indexOf(scrollRelatedItemsID) == 0)
        {
            return (isScrollDown ? scrollJumpRelatedItems : scrollJumpRelatedItems * (-1) );
        }
    }
    
    
    function resetScrollClickCount(id)
    {
        if (id.indexOf(catalogueScrollID) == 0)
        {
            if (!scrollClickCountCatalogue)
                scrollClickCountCatalogue = 0;
        }
        else if (id.indexOf(smallCartScrollID) == 0)
        {
            if (!scrollClickCountSmallCart)
                scrollClickCountSmallCart = 0;
        }
        else if (id.indexOf(scrollProductColoursID) == 0)
        {
            if (!scrollClickCountProductColours)
                scrollClickCountProductColours = 0;
        }
        else if (id.indexOf(scrollRelatedItemsID) == 0)
        {
            if (!scrollClickCountRelatedItems)
                scrollClickCountRelatedItems = 0;
        }
    }

    function setScrollClickCount(id, incr)
    {
        if (id.indexOf(catalogueScrollID) == 0)
        {
            scrollClickCountCatalogue = (incr ? scrollClickCountCatalogue + 1 : scrollClickCountCatalogue - 1);
        }
        else if (id.indexOf(smallCartScrollID) == 0)
        {
            scrollClickCountSmallCart = (incr ? scrollClickCountSmallCart + 1 : scrollClickCountSmallCart - 1);
        }
        else if (id.indexOf(scrollProductColoursID) == 0)
        {
            scrollClickCountProductColours = (incr ? scrollClickCountProductColours + 1 : scrollClickCountProductColours - 1);
        }
        else if (id.indexOf(scrollRelatedItemsID) == 0)
        {
            scrollClickCountRelatedItems = (incr ? scrollClickCountRelatedItems + 1 : scrollClickCountRelatedItems - 1);
        }
    }
    
    function setScrollLines(id)
    {
        if (id.indexOf(catalogueScrollID) == 0)
        {
            return (scrollClickCountCatalogue + 2) * (isSideCatalogue ? 1 : 4);
        }
        else if (id.indexOf(smallCartScrollID) == 0)
        {
            return (scrollClickCountSmallCart + numberOfVisibleItemsSmallCart + 1);
        }
        else if (id.indexOf(scrollProductColoursID) == 0)
        {
            return (scrollClickCountProductColours + numberOfVisibleItemsProductColours + 1);
        }
        else if (id.indexOf(scrollRelatedItemsID) == 0)
        {
            return (scrollClickCountRelatedItems + numberOfVisibleItemsRelatedItems + 1);
        }
    }
    
    function getNumberOfItems(id)
    {
        if (id.indexOf(catalogueScrollID) == 0)
        {
            numberOfItemsCatalogue = loadedImagesIDsArray ? loadedImagesIDsArray.length : 0;
            return numberOfItemsCatalogue;
        }
        else if (id.indexOf(smallCartScrollID) == 0)
        {
            return numberOfItemsSmallCart ? numberOfItemsSmallCart : 0;
        }
        else if (id.indexOf(scrollProductColoursID) == 0)
        {
            return numberOfItemsProductColours ? numberOfItemsProductColours : 0;
        }
        else if (id.indexOf(scrollRelatedItemsID) == 0)
        {
            return numberOfItemsRelatedItems ? numberOfItemsRelatedItems : 0;
        }
    }
    
    
    
    
    function scrollSlide(id, px)
    {
        var s = document.getElementById(id);
        var prefix = id.substring(0 , id.lastIndexOf('_'));

        resetScrollClickCount(id);
                        
        var millisec  = 500;
        errorFlag = false;
        var speed = Math.round(millisec / 100); //speed for each frame
        var timer = 0;

        if(px > 0)  //determine the direction for the blending, if start and end are the same nothing happens
        {
            setScrollClickCount(id, true);
            
            document.getElementById(prefix + '_upArrow').style.visibility = 'visible';
            for(i = 1; i <= px; i++) 
            {
                scrollTimer = setTimeout("Slide(1,'" + id + "')",(timer * speed));
                timer++;
                if (errorFlag == true)
                    break;
            }
            setTimeout("showHideArrows('" + id + "')",10);
        } 
        else 
        {
            setScrollClickCount(id, false);
            
            for(i = 1; i >= px; i--)
            {
                scrollTimer = setTimeout("Slide(-1,'" + id + "')",(timer * speed));
                timer++;
                if (errorFlag == true)
                    break;
            }
            setTimeout("showHideArrows('" + id + "')",10);
        }
    }

    function showHideArrows(id)
    {
        var s = document.getElementById(id);
        var prefix = id.substring(0 , id.lastIndexOf('_'));
    
        var scrollLines = setScrollLines(id);
        var nbOfItems = getNumberOfItems(id);

        if (scrollLines >= nbOfItems)
            document.getElementById(prefix + '_downArrow').style.visibility = 'hidden';
        else
            document.getElementById(prefix + '_downArrow').style.visibility = 'visible';
        
        if (s.scrollTop == 0)
            document.getElementById(prefix + '_upArrow').style.visibility = 'hidden';
        else
            document.getElementById(prefix + '_upArrow').style.visibility = 'visible';
    }

    
    function Slide(pix, id)    //change the opacity for different browsers
    {
        var o = document.getElementById(id);
        
        if (o)
        {
            o.scrollTop += pix;
            
            if (o.scrollTop == 0)
            {
                var u = document.getElementById(id + '_upArrow');
                if(u) 
                    u.style.visibility = 'hidden';
            }
        }
        else
        {
            errorFlag = true;
            return false;
        }
        
    } 
    

function upArrowClick(id)
{
    if (document.getElementById(id + '_upArrow').style.visibility == 'visible')
        scrollSlide(id + '_divCatalogueScroll', GetScrollJumpValue(id, false));
}

function downArrowClick(id)
{
    if (document.getElementById(id + '_downArrow').style.visibility == 'visible')
    {
        if(id == catalogueScrollID)
        {
            downloadMoreContentViaXHR(); 
        }
        scrollSlide( id + '_divCatalogueScroll', GetScrollJumpValue(id, true));
        document.getElementById(id + '_upArrow').style.visibility = 'visible';
    }
    
}





