// Mijo! Brands Carousel v0.1 BETA
// Vertical Only
// Simple and Fancy
(function($){
  $.fn.mijoC = function (option) {
    option = $.extend({}, $.fn.mijoC.option, option);
    
    return this.each(function() {
      var mainbox = $(this), 
        cllbck      = 0,  lastdiv     = '', firstdiv      = '', appenddiv = '', divclass  = '', slctr_last  = '', 
        slctr_first = '', playIntval  = '', pauseTimeout  = '';
      
      // Animate Box
      function animateBox(direction, clicked) {
        if (cllbck == 1) { return false; }
        if (direction == 'down') {
          slctr_last  = ':last';
          slctr_first = ':first';
        } else {
          slctr_last  = ':first';
          slctr_first = ':last';
        }
        
        cllbck    = 1;
        lastdiv   = mainbox.find('.'+ option.childrens + slctr_last);
        firstdiv  = mainbox.find('.'+ option.childrens + slctr_first);
        divclass  = lastdiv.attr('class');
        //appenddiv = '<div class="'+ option.childrens +' nbhidden">'+ lastdiv.html() +'</div>';
        appenddiv = '<div class="'+ divclass +' nbhidden">'+ lastdiv.html() +'</div>';
        
        if (direction == 'down') {
          firstdiv.before(appenddiv);
        } else {
          firstdiv.after(appenddiv);
        }
        
        lastdiv.fadeOut(option.slideSpeed, '', function() {
          $(this).remove();
          firstdiv  = mainbox.find('.'+ option.childrens + slctr_first);
          
          firstdiv.fadeIn(option.slideSpeed, function () {
            $(this).removeClass('nbhidden');
            cllbck = 0;
          });
        });
      }
      
      // Add Controls
      if (option.controls) {
        mainbox.css({position: 'relative'});
        mainbox.append('<div class="mijoC-controls"><span class="controls" id="up"></span><span class="controls" id="down"></div>');
        mainbox.children('div.mijoC-controls').css({position: 'absolute', top: option.controlPosY, right: option.controlPosX, height: 32, width: 16});
        mainbox.children('div.mijoC-controls').children('span').css({cursor: 'pointer', display: 'block', float: 'right', height: 16, width: 16});
        mainbox.children('div.mijoC-controls').children('span#up').css({background: 'url(/ui/frontend/img/jquery.ui/ui-icons_009dd9_256x240.png) no-repeat -96px -192px transparent'});
        mainbox.children('div.mijoC-controls').children('span#down').css({background: 'url(/ui/frontend/img/jquery.ui/ui-icons_009dd9_256x240.png) no-repeat -64px -192px transparent'});
        
        // Event Click
        mainbox.children('div.mijoC-controls').children('span').click(function (e) {
          e.stopImmediatePropagation();
          if (cllbck == 1) { return false; }
          
          option.slideDirection = $(this).attr('id');
          animateBox(option.slideDirection, false);
          
          if (option.slidePause) {
            clearTimeout(mainbox.data('pause'));
            clearInterval(mainbox.data('interval'));
            
            pauseTimeout = setTimeout(function () {
              clearTimeout(mainbox.data('pause'));
              
              playIntval = setInterval(function () {
                animateBox(option.slideDirection, true);
              }, option.slideInterval);
              
              mainbox.data('interval', playIntval);
            }, option.slidePause);
            
            mainbox.data('pause', pauseTimeout);
          } else {
            clearInterval(mainbox.data('interval'));
          }
        });
      }
      
      // Starting animation
      playIntval = setInterval(function () {
        animateBox(option.slideDirection, false);
      }, option.slideInterval);
      mainbox.data('interval', playIntval);
      // Enjoy
    });
  };
  
  $.fn.mijoC.option = {
    container:  'box_news', // ID of Container Div
    childrens:  'newbox',   // Class name of Childrens Div
    slideSpeed: 1000,       // Speed in Milisec of transition
    slideInterval: 5000,    // Speed in Milisec between transitions
    slidePause: 5000,       // Speed in Milisec that function will restart
    slideDirection: 'down', // Direction of animation onload.
    controls: true,        // Add Controls to Sldier
    controlPosY: 15,        // Position Relative at Top of the box
    controlPosX: 20         // Position Relative at Right of the box
  };
})(jQuery);
