
mybox.Slider = function(sliderId, scrollLeftImg, scrollRightImg, scrollOptions, auto, autoTime) {
    this.sliderId = sliderId;
    this.horizontal = true;
    this.panels = $('#' + sliderId + ' .scrollContainer > div');
    this.container = $('#' + sliderId + ' .scrollContainer');    
    this.scrollOptions = scrollOptions;    
    this.scroll = null;
    this.scrollLeftImg = scrollLeftImg;
    this.scrollRightImg = scrollRightImg;
    this.auto = auto;
    this.autoTime = autoTime == undefined ? 5000 : autoTime;
    this.timerId = null;
    this.init();
}

mybox.Slider.prototype = {
    
    init: function() {        
        var ctx = this;
        if (this.horizontal) {
          this.panels.css({
            'float' : 'left'
            /*,
            'position' : 'relative' */
          });
          this.container.css('width', this.panels[0].offsetWidth * this.panels.length);
        }    

        this.scroll = $('#' + this.sliderId + ' .slider_scroll').css('overflow', 'hidden');
        this.scroll
          .before('<img class="scrollButtons left" src="' + this.scrollLeftImg + '"/>')
          .after('<img class="scrollButtons right" src="' + this.scrollRightImg + '"/>');

        var selectNav = function() {  
          $(this)
            .parents('ul:first')
              .find('a')
                .removeClass('selected')
              .end()
            .end()
            .addClass('selected');


          //$(this).parents('ul').find('img').attr('src', '../images/web/diapo.gif');
          //$(this).find('img').attr('src', '../images/web/diapo_.gif');
          ctx.startAutoSlide();
        }
        //$('#' + this.sliderId + ' .navigation').find('a').click(selectNav);
        $('#navigationPanel .navigation').find('a').click(selectNav);

        var trigger = function(data) {
          //var el = $('#' + ctx.sliderId + ' .navigation').find('a[href$="' + data.id + '"]').get(0);
          var el = $('#navigationPanel .navigation').find('a[href$="' + data.id + '"]').get(0);
          selectNav.call(el);
        }

        if (window.location.hash) {
          trigger({id : window.location.hash.substr(1)});
        } else {
          $('ul.navigation a:first').click();
        }

        var offset = parseInt((this.horizontal ? 
          this.container.css('paddingTop') : 
          this.container.css('paddingLeft')) 
          || 0) * -1;
      
      
       this.scrollOptions.target = this.scroll;
       this.scrollOptions.items = this.panels,
       this.scrollOptions.onAfter = trigger;
       this.scrollOptions.offset = offset;

      
        $('#' + this.sliderId).serialScroll(this.scrollOptions);
        $.localScroll(this.scrollOptions);

        this.scrollOptions.duration = 1;
        $.localScroll.hash(this.scrollOptions);
        
        if (this.auto) {          
            $(this.scroll).mouseover(function() {
                if (ctx.timerId != null) {
                    clearTimeout(ctx.timerId);
                }
            });
            $(this.scroll).mouseout(function() {
                ctx.startAutoSlide();
            });
            this.startAutoSlide();
        }
    },

    pause: function() {
        var ctx = this;
        if (ctx.timerId != null) {
            clearTimeout(ctx.timerId);
        }
    },

    resume: function() {
        var ctx = this;
        ctx.startAutoSlide();
    },

    startAutoSlide: function() {
        if (this.auto) {
            if (this.timerId != null) {
                clearTimeout(this.timerId);
            }
            var ctx = this;
            var ft = function() {
                ctx.updateSlide.call(ctx);
                //ctx.timerId = setTimeout(ft, ctx.autoTime);            
            }            
            this.timerId = setTimeout(ft, this.autoTime);
        }
    },
        
    updateSlide: function() {
        /* 
        var sel = $('#' + this.sliderId).find('.navigation').find('a.selected');
        var p = $(sel).parent('li').next();
        if (p.length == 0) {
            p = $('#' + this.sliderId).find('.navigation').find('li').get(0);
        }
        $(p).find('a').click(this.selectNav);
        */
        var sel = $('#navigationPanel').find('.navigation').find('a.selected');
        //$(sel).find('img').attr('src', '/oryx/images/web/diapo.gif');
        var p = $(sel).parent('li').next();
        if (p.length == 0) {
            p = $('#navigationPanel').find('.navigation').find('li').get(0);
        }
        $(p).find('a').click(this.selectNav);
    }
    
}

