;
/***********************************
ImageSpinner3D v.1.0
Author: Jakob H Nielsen, LEGO.
Notes: sliderpositions left,right not supported yet.
touchevents currently: iphone,ipad,ipad, android, balckberry - no  others
************************************/ 
 
/*
function log(m) {
console.log(m);
}
*/


(function (w, $) {
    //check if Global Namespacing is there
    w = window;


    var LinkObj = function (Xvalues, Yvalues, fadeValues, attribute, linkText) {
        //avoid GlobalNameSpacing
        if (this === window || this === document) {
            alert("no Go - Constructor Functions may Not be Put in global NameSpace");
            return false;
        }




        this.element = $("<a href=\"#\" class=\"spinnerInfoLink\" >" + linkText + "</a>");
        this.handleAttributes(attribute);


        var _self = this;

        var startPos = 150;
        //containes x keys
        var keysCount = 24;
        var dummyFunction = function () {};
        _self.animateX = dummyFunction;
        _self.animateY = dummyFunction;
        _self.animateFade = dummyFunction;

      
        if (this.getObjLength(Xvalues) > 0) {
            var animateXKey = this.createTween(Xvalues, keysCount);
   
            _self.element.css({ "left": animateXKey[0] });
            _self.animateX = function (index) {
                _self.element.css({ "left": animateXKey[index] });

            }
        }

        if (this.getObjLength(Yvalues) > 0) {

            var animateYKey = this.createTween(Yvalues, keysCount);
            _self.element.css({ "top": animateYKey[0] });
            _self.animateY = function (index) {
                _self.element.css({ "top": animateYKey[index] });

            }

        }

        if (this.getObjLength(fadeValues) > 0) {

            var animateFadeKey = this.createTween(fadeValues, keysCount);
           
          
            _self.element.css({ "opacity": animateFadeKey[0], "display":this.setDisplay(animateFadeKey[0])});
            _self.animateFade = function (index) {
            var display = "block";
            
                _self.element.css({ "opacity": animateFadeKey[index], "display": this.setDisplay(animateFadeKey[index]) });

            }

        }


        this.animate = function (index) {
           _self.animateX(index);
           _self.animateY(index);
           _self.animateFade(index);

        } //animate

    };

    LinkObj.prototype.setDisplay = function (value) {
      var display ="block";
      if (value == 0.01)
            {
           
            display = "none";
            }
            return display;
    
    }

    LinkObj.prototype.handleAttributes = function (attribute) {
        for (var i in attribute) {
            if (i.toLowerCase() === "class") {

                this.element.addClass(attribute[i]);
            } else {
                this.element.attr(i, attribute[i]);
               
            }
        }
    }


    LinkObj.prototype.returnElement = function (ele) {
        $(ele).append(this.element);

    }
    LinkObj.prototype.getObjLength = function (Obj) {
        var count = 0;
        for (var i in Obj) if (Obj.hasOwnProperty(i)) count++;
        return count;


    }

    LinkObj.prototype.createTween = function (values, totalKeys) {

        var tweenObj = {};
        var valuesSorted = sortValues();
        var valueDifference;
        var keyDifference;
        var average;
        var nextItemNumber;

        for (var item in valuesSorted) {
            var itemAlias = parseInt(item);
            if (itemAlias < totalKeys) {

                nextItemNumber = getNext(itemAlias);
                tweenObj[item] = valuesSorted[item];

                if (nextItemNumber !== undefined && nextItemNumber !== false) {

                    valueDifference = valuesSorted[nextItemNumber] - valuesSorted[item];
                    keyDifference = parseInt(nextItemNumber) - itemAlias;
                    average = valueDifference / keyDifference;

                    var iterations = keyDifference + 1

                    for (var j = 1; j < iterations; j++) {

                        var newkey = itemAlias + j;
                        tweenObj[newkey] = tweenObj[item] + average * j;

                    }

                }
                else {
                    nextItemNumber = totalKeys - 1;

                    valueDifference = valuesSorted[0] - valuesSorted[item];

                    keyDifference = parseInt(nextItemNumber) - itemAlias + 1;

                    average = valueDifference / keyDifference;

                    var iterations = keyDifference;

                    for (var j = 1; j < iterations; j++) {

                        var newkey = itemAlias + j;
                        tweenObj[newkey] = tweenObj[item] + average * j;

                    }


                }
            }






        }
        //ensures that  ekstra index will return to startposition
        //  tweenObj[totalKeys] = valuesSorted[0];

        return tweenObj;

        function getNext(curIndex) {


            for (var i = parseInt(curIndex) + 1; i < totalKeys; i++) {

                if (valuesSorted[i]) {

                    return parseInt(i);

                }


            }


            return false;

        }


        function sortValues() {
            var sortObj = {};

            for (var i = 0; i < totalKeys; i++) {
                if (values[i]) {
                    sortObj[i] = values[i];
                }

            }
            return sortObj;
        }

    }




    LEGOArchitecture.ImageSpinner3D = function (sentoptions) {

        //set _self for reference
        var _self = this;
        //defaults
        var imageContainer = $("<div id=\"imageSpinnerImgContainer\"></div>");
        var loadedImages = [];
        var frameRate;
        var animateTimer;
        var sliderBg = $("<div id=\"imageSpinner3DSliderBg\"></div>");
        var slider = $("<div id=\"imageSpinner3DSlider\"></div>");
        var currentMouseX;
        var initMouseX = 0;
        var sliderBgOffset;
        var sliderOffset;
        var sliderIndex;
        var indexRatio;
        var sliderStartPos;
        var imageSpinnerOffset;
        //set default options
        var options = {
            imageSpinner3D: $("<div id=\"imageSpinner3D\" ></div>"),
            imageURL: "images/21005/megasprite.jpg", imageNames: new Array('0001.jpg', '0002.jpg', '0003.jpg', '0004.jpg', '0005.jpg', '0006.jpg', '0007.jpg', '0008.jpg',
        '0009.jpg', '0010.jpg', '0011.jpg', '0012.jpg', '0013.jpg', '0014.jpg', '0015.jpg', '0016.jpg', '0017.jpg', '0018.jpg', '0019.jpg', '0020.jpg', '0021.jpg', '0022.jpg', '0023.jpg'),
            imageBaseUrl: "images/21005/newImages/", "imageAlt": "3dSpin", spinnImageSize: 604 , spinnImagesCount: 24, sliderPos: "center", sliderBounds: { x: 21, x2: 301 }

        };

        $.extend(options, sentoptions);


        this.setSliderBounds = function (left, right) {

            var sliderBounds = { x: left, x2: right };

            return sliderBounds;
        }

        _init();

        function _init() {

          //  frameRate = options.framerate;
            options.imageSpinner3D.css({ "width": options.spinnImageSize });
         //   alert( options.spinnImageSize);
            initLinks();
            _wrapMarkup();

            _loadImages();

        }



        function isIDevice() {

            var deviceAgent = navigator.userAgent.toLowerCase();
            return deviceAgent.match(/(iphone|ipod|ipad)/);

        }


        function ready() {
            createSliderMarkup();
            setIndexRatio();
            imageSpinnerOffset = (options.imageSpinner3D.offset().left) - sliderOffset * 0.5;
            $("#imageSpinner3D .spinnerInfoLink").each(function () {
                $(this).callPopup(
                    { containerElement: "#contentMain",
                        addedElement: ".infoPopup",
                        rootPath: "/en-us/Views/Franchise/Architecture/Controls/Home",
                        dataProvider: "SpinnerViewPopUp.aspx"
                    });
            })//each
        }

        function initLinks() {
            LEGOArchitecture.linkArr = [];
            for (var item in LEGOArchitecture.dataObj) {
                LEGOArchitecture.linkArr.push(new LinkObj(LEGOArchitecture.dataObj[item].Xvalues, LEGOArchitecture.dataObj[item].Yvalues, LEGOArchitecture.dataObj[item].fadeValues, LEGOArchitecture.dataObj[item].attr, LEGOArchitecture.dataObj[item].linkText))
            }

        }

        function _wrapMarkup() {
            options.imageSpinner3D.children().wrap(imageContainer);
        }
       

        function _loadImages() {

            if (isIDevice()) {


                loadMultiple();



            }
            else {

                var oldImage = $("#imageSpinnerImgContainer img");
                var bigImage = $("<img>");
                var url = options.imageURL;
                
                bigImage.attr({ "alt": oldImage.attr("alt"), "class": oldImage.attr("class") });
              
                bigImage.attr("src", url).bind("load", function () {
                    $("#imageSpinnerImgContainer").empty();
                    $("#imageSpinnerImgContainer").append(bigImage);
                      bigImage.addClass("loaded");

                    ready();

                });
                
         



            }

        } //loadimages


      

        function loadMultiple() {
            var _spinnerImgContainerWidth = options.spinnImageSize * options.spinnImagesCount;
      
            if (loadedImages.length < options.imageNames.length) {
                var img = $("<img>").attr("alt", options.imageAlt);
                img.attr("src", options.imageBaseUrl + options.imageNames[loadedImages.length]).bind("load", function () {
                    loadedImages.push(img);
                    loadMultiple();

                });

            }
            else {

                var _spinnerImgContainerWidth = options.spinnImageSize * (options.spinnImagesCount + 1);

                $("#imageSpinnerImgContainer").css("width", _spinnerImgContainerWidth);
                for (var img in loadedImages) {
                    $("#imageSpinnerImgContainer").append(loadedImages[img]);
                }
        
                ready();
            }




        }
        function setIndexRatio() {

            var x = slider.bounds.x > 0 ? slider.bounds.x : slider.bounds.x * -1;
            var x2 = slider.bounds.x2 > 0 ? slider.bounds.x2 : slider.bounds.x2 * -1;
            indexRatio = 6.125; //(x+x2)/(options.spinnImagesCount*2);


        }



        function createSliderMarkup() {
            sliderBg.append(slider);
            options.imageSpinner3D.append(sliderBg);
            var sliderPos;

            var sliderBgWidth = parseInt(sliderBg.width());
            var sliderWidth = slider.width();
            sliderOffset = parseInt(sliderWidth);


            slider.bounds = options.sliderBounds; //_self.setSliderBounds(sliderWidth, sliderBgWidth);

            try {

                document.addEventListener("touchmove");
                var deviceAgent = navigator.userAgent.toLowerCase();
                if (isIDevice() || deviceAgent.match(/android/i) || deviceAgent.match(/blackberry/i)) {

                    addMobileEvents();
                }
                else {

                    addEvents();
                }

            }
            catch (e) {

                addEvents();

            }

            setSliderPos(setInitSliderPos(sliderWidth, sliderBgWidth));




            for (var i = 0; i < LEGOArchitecture.linkArr.length; i++) {
                LEGOArchitecture.linkArr[i].returnElement($("#imageSpinner3D"));
                //            link1.returnElement($("#imageSpinner3D"));
            }
        } //createSliderMarkup






        function addMobileEvents() {
            var sliderBgPos = parseInt(sliderBg.css("marginLeft"));
            slider.bind("touchmove", function (e) {

                e.preventDefault();
                var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];

                initMouseX = touch.pageX;

                currentMouseX = touch.pageX - sliderBgPos;
                animateHandler();
                $("body").css({ "cursor": "pointer" });
                currentMouseX = touch.pageX - sliderBgPos;

                //return false;
            }); //mousedown

        };









        function addEvents() {
            var sliderBgPos = parseInt(sliderBg.css("marginLeft"));
            slider.bind("mousedown", function (e) {
                initMouseX = e.pageX;

                currentMouseX = e.pageX - sliderBgPos;
                animateHandler();
                $("body").css({ "cursor": "pointer" });

                $(document).bind("mouseup.3DspinnerMouseUp", function () {

                    $("body").css({ "cursor": "auto" });

                    $(document).unbind("mouseup.3DspinnerMouseUp");
                    $(document).unbind("mousemove.3DspinnerMouseMove");

                    //, mousemove.3DspinnerMouseMove
                    return false
                });

                $(document).bind("mousemove.3DspinnerMouseMove", function (e) {

                    currentMouseX = e.pageX - sliderBgPos;
                    animateHandler();
                }); //mouseupr


                return false;
            }); //mousedown
            //disable selection in ie
            if ("onselectstart" in document) {
                document.getElementById("imageSpinner3D").onselectstart = function () { return false };
         

            }

        }





        function setInitSliderPos(sliderWidth, sliderBgWidth) {
            var sliderPos;
            switch (options.sliderPos.toLowerCase()) {
                case "left":
                    sliderPos = 0;
                    sliderIndex = options.spinnImagesCount * -1;
                    break

                case "right":
                    sliderPos = sliderBgWidth - (sliderWidth * 0.5);
                    sliderIndex = options.spinnImagesCount;
                    break
                default:
                    sliderPos = (sliderBgWidth + sliderOffset * 0.5) * 0.5; // + (sliderWidth*0.5);
                    sliderIndex = 0;
                    break
            }
            sliderStartPos = sliderPos;
            return sliderPos;
        }



        function getSliderPos() {
            return parseInt($("#imageSpinner3DSlider").css("marginLeft"));
        }

        function setSliderPos(value) {
            var xvalue = value - (sliderOffset); 
            $("#imageSpinner3DSlider").css({ "marginLeft": xvalue });
        }

        function getFrameIndex() {
            var rr = getSliderPos() - (sliderStartPos - 7.5);
            var currentIndex = Math.ceil(rr / indexRatio);
            if (rr < sliderStartPos) {
                currentIndex *= -1;

            }
            return currentIndex;
        }
        function animateHandler() {

            var currentPos = currentMouseX - imageSpinnerOffset;

            var sliderX = getSliderPos();
            if (currentPos >= slider.bounds.x && currentPos <= slider.bounds.x2) {
                sliderX = currentPos;
            }
            else {
                if (currentPos < slider.bounds.x) {
                    sliderX = slider.bounds.x;
                }
                else if (currentPos > slider.bounds.x2) {
                    sliderX = slider.bounds.x2;
                }
            } //else

            setSliderPos(sliderX);
            moveSpinimages();

        }

        function moveSpinimages(sliderX) {


            var index = getFrameIndex();
            var index2 = (index * -1);
            var size = options.spinnImageSize;
            var pos = size * index;


              if (index > 0) {
                var ll = (size * (options.spinnImagesCount - 1)) - pos;
                pos = ll * -1;
                index2 = options.spinnImagesCount - (index + 1);

            }

            $("#imageSpinnerImgContainer").css({ "marginLeft": pos });

            for (var i = 0; i < LEGOArchitecture.linkArr.length; i++) {
                LEGOArchitecture.linkArr[i].animate(index2)

            }
         //   log(index2);
        }

    }; //imageSpinner
    //
})(window, jQuery);






