/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

/*Slide show controller */
// function test(){EC.Slideshow.moveNext()}
EC = function () {}
EC.Slideshow = function () {
    var _timeout;
    var _imageboxid;
    var _imagecontrollerboxid;
    var _totalimages;
    var _current_controller_id;
    var _slide_interval_timer;    

    /*Private stuff*/
    _start = function(imagebox, imagecontrollerbox, timeout) {
        /* set values:: */
        // time out
        (timeout > 0)  ? _timeout = timeout : _timeout = 5000 ;

        // image box
        (imagebox != null) ? _imageboxid = imagebox : _imageboxid = 'slideshow_box';

        // total images
        _totalimages =  jQuery('#' + _imageboxid + ' SPAN').length;

        // image controller box
        if(imagecontrollerbox != null){
            _imagecontrollerboxid = imagecontrollerbox;
            _buildController();
        }

        // set interval
        if(_totalimages>1) {
            _setSlideInterval();
        }
    }

    _setSlideInterval = function () {
        // set interval
        _slide_interval_timer = window.setInterval("EC.Slideshow.moveNext()", _timeout);
    }

    _clearSlideInterval = function () {
        // Clear interval
        window.clearInterval(_slide_interval_timer);
    }

    // Move next
    _moveNext = function() {
        
        var $active = jQuery('#' + _imageboxid + ' SPAN.active');
        if ( $active.length == 0 ) {
            $active = jQuery('#' + _imageboxid + ' SPAN:last');
        }
        // use this to pull the images in the order they appear in the markup
        var $next =  $active.next().length ? $active.next() : jQuery('#' + _imageboxid + ' SPAN:first');
        $active.addClass('last-active');
        $next.css({
            opacity: 0.0
        })
        .addClass('active')
        .animate({
            opacity: 1.0
        }, 1000, function() {
            $active.removeClass('active last-active');
        });
        // Change controller:
        _changeController();
        
    }

    // Move next
    _movePrevious = function() {
        var $active = jQuery('#' + _imageboxid + ' SPAN.active');
        if ( $active.length == 0 ) {
            $active = jQuery('#' + _imageboxid + ' SPAN:last');
        }
        // use this to pull the images in the order they appear in the markup
        var $prev =  $active.prev().length ? $active.prev() : jQuery('#' + _imageboxid + ' SPAN:last');
        $active.addClass('last-active');
        $prev.css({
            opacity: 0.0
        })
        .addClass('active')
        .animate({
            opacity: 1.0
        }, 1000, function() {
            $active.removeClass('active last-active');
        });
        // Change controller:
        _changeController();
    }

    // Move next
    _jumpTo = function(cntrid) {
        gotoid = _getControllerId(cntrid);
        currid = _getControllerId(_current_controller_id);
        // go forward
        if(gotoid > currid) {
            for(mv=0; mv<(gotoid - currid); mv++){
                _moveNext();
            }
        } else if (gotoid < currid) {
        //console.log(_totalimages + '=>' +gotoid +'=> '+ (_totalimages - gotoid));
        /*for(mv=0; mv <= (_totalimages - gotoid); mv++){
                _moveNext();
            }*/
        //_movePrevious();
        }
        
        _clearSlideInterval();
        _setSlideInterval();
    }

   


    // Change controller
    _changeController = function (selected_id) {
        // if no selected id, Go next ::
        ctrlid = 0;
        if(selected_id != null && selected_id != undefined) {
            ctrlid =  _getControllerId(selected_id);
            // if last set to zero ::
            ctrlid = (_controllerIsLast(ctrlid)) ? 0 :  ctrlid ;
        } else {
            ctrlid = _getControllerId(_current_controller_id);
            ctrlid = (_controllerIsLast(ctrlid)) ? 0 :  ++ctrlid  ;
        }
        _resetController(ctrlid);
    }

    // Reset
    _resetController = function (ctrlid) {
        // Reset
        jQuery('#' + _current_controller_id).removeClass ('slideshow-cntrl-active');
        jQuery('#' + _current_controller_id).addClass ('slideshow-cntrl-inactive');

        // Add new class
        jQuery('#slds_ctrl_'+ctrlid).removeClass ('slideshow-cntrl-inactive');
        jQuery('#slds_ctrl_'+ctrlid).addClass ('slideshow-cntrl-active');

        // current
        _current_controller_id = "slds_ctrl_"+ctrlid;                
    }

    // Move controller
    _getControllerId = function (selected_id) {
        // if no selected id, Go next ::        
        return selected_id.substring(selected_id.indexOf('ctrl_')+5);
    }

    // Check it ctroller is last
    _controllerIsLast = function (ctrlid) {
        return (ctrlid == (_totalimages-1)) ? true : false ;
    }

    // Build Controller
    _buildController = function () {
        strhtnl = "<table cellpadding=0 cellspacing=0 class='slideshow-controller-table'><tr>";
       
        for(i=0; i <_totalimages; i++) {
            if(i==0) {
                strhtnl += "<td class='slideshow-cntrl-active' id='slds_ctrl_"+i+"' onclick='EC.Slideshow.goTo(&quot;slds_ctrl_"+i+"&quot;)'></td>";
                _current_controller_id = "slds_ctrl_"+i;
            } else {
                strhtnl += "<td class='slideshow-cntrl-inactive' id='slds_ctrl_"+i+"' onclick='EC.Slideshow.goTo(&quot;slds_ctrl_"+i+"&quot;)'></td>";
            }
        }
        strhtnl = strhtnl + "</tr></table>";
        // insert into box id
        jQuery('#' + _imagecontrollerboxid).html(strhtnl);
    }

    /* External Interface: */
    var external = {
        /**
         *  Start slide show: Pass the image box, controller box and the timeout preferred
         */
        start : function(imagebox, imagecontrollerbox, timeout) {            
            _start(imagebox, imagecontrollerbox, timeout);
        },

        goTo : function(ctrlid) {
            _jumpTo(ctrlid);
        },

        changeTimeout : function(newtime) {
            _changeTimeout(newtime);
        },

        moveNext : function() {
            _moveNext();
        },

        movePrevious : function() {
            _movePrevious();
        }
    }

    return external;
}();
/*END CLASS*/


//Main:
// Controls the Slide shows
// Header Menu
// Add to cart button in product page
jQuery(function () {
    var pbd=jQuery('#main_produc_desc_block');
    var sldb=jQuery('#slideshow_box');
    var sldc = jQuery('#slideshow_box_controller');
    /**
     *    1) Header control:
     *    Check if header exists at the bottom:
     */
    if(jQuery('#header').length==1 && jQuery('#header-container').length==1) {
        // Move header to the top ::
        jQuery('#header-container').html(jQuery('#header').html());
        // move menu slightly above ::
        jQuery('#menu-box').html(jQuery('#menus').html());
        // hide header box at the bottom ::
        jQuery('#header').remove();
        jQuery('#menus').remove();
        jQuery('.footer > #search_mini_form').remove();
		jQuery('.footer > .store-switcher').remove();
		jQuery('#my_footer > .form-search').remove();
    }

    /**
     * 2) Homepage slides controll
     */
    if(sldb.length==1)
    {   // start slideshow
        //slidecntrl = new EC.Slideshow();
        EC.Slideshow.start('slideshow_box','slideshow_box_controller',5000);
    }
    
    /*
     * 3)  Add to Cart Button in Product Page ::
     *  // Move it from its box to the custom box just under the products orientation image
     **/
     if(jQuery('.add-to-box').length==1 && jQuery('#custom_add_to_cart').length==1) {
            jQuery('#custom_add_to_cart').html(jQuery('.add-to-box').html());
             jQuery('.add-to-box').remove();
     }

     // 4) Move the category description to the bottom :: Should be utilized on category pages only:
     if(jQuery('#category-text-container').length==1 && jQuery('#category-description-orig').length==1) {
        (jQuery('#category-text-container').html(jQuery('#category-description-orig').html()));
        jQuery('#category-description-orig').hide();
     }

});


/**
 *     Work around for Toggle Menu
 *     As toggleMenu is missing in latest magento: Enable this function to allow the menu items with toggleMenu call fuction to work
 **/
function toggleMenu(el, over)
{
    if (over) {
        Element.addClassName(el, 'over');
    }
    else {
        Element.removeClassName(el, 'over');
    }
}