/* 
	dsl.js
	
	Project: DSL
	
	Contains: utility functions for DSL web site.
	
	iomer internet solutions - Nov 2008
	iomer.com
	
*/

var DSL = {
    sliderList: {
        viewportWidth:  850, /* pixels */
        waitInterval:   '',
        slideMultiplier:9000,   /*default value : milliseconds*/
        transformation: 'linear',
        /* Selectors */
        wrapper_s:      '#sliderBar',
        mask_s:         '.mask',
        ul_s:           'ul.sf_simpleList',
        img_s:          'ul.sf_simpleList li img',
        buttonLeft_s:   '#slideButtonLeft',
        buttonRight_s:  '#slideButtonRight',

        init: function() {
            /*	Resize the width of the UL to the full width of its contents to
            float everything in one long line (instead of it wrapping)! */

            $(this.img_s, $(this.wrapper_s))
            .each(function() {
                if (this.complete) {
                    // do width calculations
                    DSL.sliderList.widthTracker.add(this.width);    /* Grab the images width attribute and add it to the widthtracker */
                    var w = DSL.sliderList.widthTracker.getWidth();
                    $(DSL.sliderList.ul_s, DSL.sliderList.wrapper_s).width(w < DSL.sliderList.viewportWidth ? DSL.sliderList.viewportWidth : w);
                } else {
                    $(this).load(function() {
                        DSL.sliderList.widthTracker.add(this.width);    /* Grab the images width attribute and add it to the widthtracker */
                        var w = DSL.sliderList.widthTracker.getWidth();
                        $(DSL.sliderList.ul_s, DSL.sliderList.wrapper_s).width(w < DSL.sliderList.viewportWidth ? DSL.sliderList.viewportWidth : w);
                    });
                }
            });

            /* Attach sliding control */
            /*
            This should be programmed to move a maximum of
            850px per slide (that's the width of the mask: mask_s)
            */
            $(this.buttonLeft_s).click(function() {
                /* move content left to show what was hidden on the right */
                var mover = $(DSL.sliderList.ul_s);
                var overflowR = mover.width() - DSL.sliderList.viewportWidth + mover.position().left;
                if (overflowR > 0) { /*&& mover.position().left >= 0*/
                    overflowR = (overflowR > DSL.sliderList.viewportWidth) ? DSL.sliderList.viewportWidth : overflowR;
                    mover.queue("fx", []);
                    mover.stop();
                    mover.animate({ left: mover.position().left - overflowR }, 1500, DSL.sliderList.wait);
                }
                return false;
            });

            $(this.buttonRight_s).click(function() {
                /* move content right to show what was hidden on the left */
                var mover = $(DSL.sliderList.ul_s);
                var overflowL = Math.abs(mover.position().left);
                if (overflowL > 0) { /*&& mover.position().left >= 0*/
                    overflowL = (overflowL > DSL.sliderList.viewportWidth) ? DSL.sliderList.viewportWidth : overflowL;
                    mover.queue("fx", []);
                    mover.stop();
                    mover.animate({ left: mover.position().left + overflowL }, 1500, DSL.sliderList.wait);
                }
                return false;
            });
            this.bounce();
        },
        widthTracker: {
            _w: 0,
            add: function(w) { this._w += w; },
            subtract: function(w) { this._w -= w; },
            getWidth: function() { return this._w; },
            reset: function() { this._w = 0; }
        },
        wait: function() {
            if (this.waitInterval) { clearTimeout(this.waitInterval); };
            this.waitInterval = setTimeout('DSL.sliderList.bounce();', 3000);
        },
        bounce: function() {
            /*  maybe not the ideal place for this calculation as it gets computed so many times, but
            I need to guarantee that we're using the full width
            */
            DSL.sliderList.slideInterval = DSL.sliderList.slideMultiplier * (DSL.sliderList.widthTracker.getWidth() / DSL.sliderList.viewportWidth);

            var mover = $(DSL.sliderList.ul_s);
            var overflowL = Math.abs(mover.position().left);
            if (overflowL <= 0) { /*&& mover.position().left >= 0*/
                mover.animate({ left: -(mover.width() - DSL.sliderList.viewportWidth) }, DSL.sliderList.slideInterval, DSL.sliderList.transformation);
                mover.animate({ left: 0 }, DSL.sliderList.slideInterval, DSL.sliderList.transformation, DSL.sliderList.bounce);
            } else {
                mover.animate({ left: 0 }, DSL.sliderList.slideInterval, DSL.sliderList.transformation);
                mover.animate({ left: -(mover.width() - DSL.sliderList.viewportWidth) }, DSL.sliderList.slideInterval, DSL.sliderList.transformation, DSL.sliderList.bounce);
            }
        }
    },

    searchBox: {
        searchText: 'Search...',
        init: function() {
            $('.sf_searchText').focus(function() {
                if ($(this).attr('value') == DSL.searchBox.searchText) {
                    $(this).attr({ value: '' });
                }
            })
	        .blur(function() {
	            if ($(this).attr('value') == '') {
	                $(this).attr({ value: DSL.searchBox.searchText });
	            }
	        })
	        .attr({ value: DSL.searchBox.searchText });
        }
    },
    rotatingImage: {
        intervalIndex: -1,
        initDone: false,
        /* debug: this path will need to have the /dslinc.com removed/added depending on uat or prod */
        libPath:            '/Libraries/Homepage_Images/',
        filenameRoot:       'homeImage',
        ext:                '.sflb.ashx',
        currentIndex:       0,
        rotateInterval:     6000,  /* 6 seconds */
        numImages:          6,


        init: function() {
            this._buildUrl = function(index) {
                index = index || '1';
                return this.libPath + this.filenameRoot + index + this.ext;
            };
            /* preload the first image and fade it in */
            var bgRef = this._buildUrl(this.currentIndex + 1);
            var imgPreloader = new Image();
            imgPreloader.onload = function() { $('#rotatingPictureFrame').css({ display: 'none', backgroundImage: 'url(' + bgRef + ')' }).fadeIn(1500); };
            imgPreloader.src = bgRef;
            /* add the holder div for the image transition feature */
            $("<div class=\"newImage\"></div>").css('display', 'none').prependTo($('#rotatingPictureFrame'));
            this.intervalIndex = setInterval('DSL.rotatingImage.rotate()', DSL.rotatingImage.rotateInterval);
            this.initDone = true;
        },
        rotate: function() {
            // choose image from set
            var selector = '#rotatingPictureFrame';
            if (!this.initDone) return;

            this.currentIndex = (this.currentIndex + 1) % this.numImages;
            // preload and fade in image
            var bgRef = this._buildUrl(this.currentIndex + 1);
            var imgPreloader = new Image();
            imgPreloader.onload = function() { $(selector + " .newImage").css({ backgroundImage: 'url(' + bgRef + ')' }).fadeIn(1500, DSL.rotatingImage.swap); };
            imgPreloader.src = bgRef;
        },
        swap: function() {
            $('#rotatingPictureFrame').css('backgroundImage', $('#rotatingPictureFrame .newImage').css('background-image'));
            $('#rotatingPictureFrame .newImage').css('display', 'none');
        }
    }
};