var Headerslider = new Class({
  
  current: 0,
  container: null,
  outer: null,
  arrEl: null,
  offset: 0,
  options: {},
  
  resetZ: function ()
  {
      this.arrEl.each(
        function(item,index)
        {
            if(index != this.current)
                  item.setStyles({'z-index':'11','display':'none'});
              else
                    item.setStyles({'z-index':'13'});
        }.bind(this)
      );
  },
    init: function(outer, options){
      if(options) this.options = options;
      this.outer = outer;
      if(!this.outer) return;
      this.container = new Element('div',{'class':'slider_inner'}).inject(this.outer);
      this.arrEl = this.outer.getElements('.sliderbox_outer');
      this.container.setStyle('width',496*this.arrEl.length);
      this.container.adopt(this.arrEl);
      this.icons = new Element('div',{'class':'sliderbox_icons_outer'}).inject(this.outer);

      this.arrEl.each(
        function(item,index)
        {
            if(item.getElements('img').length <= 0)
            {
                    item.destroy();
                    this.arrEl[index] = null;
            }
        }.bind(this));
        this.arrEl = this.arrEl.clean();
      this.arrEl.each(
        function(item,index)
        {
            if(!item) return;
            if(this.container.getSize().y < item.getSize().y)
                this.container.setStyle('height',item.getSize().y);
            item
                .setStyles({'z-index':'11','display':'none'})
                .set('tween',{'duration': 500,'link':'chain'});
            
            
            if(item.getElements('.sliderbox_text .csc-default').length <= 0) {
                item.getElements('.sliderbox_text')[0].setStyle('display','none');
            }
                
            var ie = new Element('div',{'class':'sliderbox_icon'})
                .inject(this.icons)
                .addEvent('click',function (i) {
                    this.moveTo(i);
                }.bind(this,index));
                if(this.options.imagePreview)
                {
                    ie.adopt(new Element('img', {src: item.getElement('img').src}));
                    ie.adopt(new Element('p',{text: item.getElement('.sliderbox_text h2').get('text')}));
                }
           
        }.bind(this)
      );
      
      if(this.options.imagePreview)
      {
        this.icons.setStyle('height',this.arrEl.length*80);
        this.outer.setStyle('height',this.arrEl.length*80);
      }
      //this.container.setStyle('width',this.arrEl.length * 496);
      //this.container.setStyles({left: this.offset});

      this.moveTo(0);
      
      if(this.options.autoStart)
      {
        this.timer = this.moveRight.periodical(10000,this);
      }
      //this.outer.addEvent('mouseenter', function () { clearInterval(this.timer) }.bind(this));
      //this.outer.addEvent('mouseleave', function () { this.timer = this.moveRight.periodical(10000,this) }.bind(this));
    },
    stopTimer: function()
    {
      clearInterval(this.timer);
      $$('.slider_outer_stop').setStyle('display','none');
      $$('.slider_outer_start').setStyle('display','block');
    },
    startTimer: function ()
    {
      this.timer = this.moveRight.periodical(10000,this);
      $$('.slider_outer_stop').setStyle('display','block');
      $$('.slider_outer_start').setStyle('display','none');
    },
  moveLeft: function () {
    if(this.current <= 0)
    {
      this.current = this.arrEl.length;
    }
    this.moveTo(this.current-1);
  },
  
  moveRight: function () {
    if(this.current >= (this.arrEl.length-1)) 
    {
      this.current = -1;
      //return;
    }
    this.moveTo(this.current+1);
  },
  moveTo: function (i) {
      $$('.sliderbox_icon_current').removeClass('sliderbox_icon_current');
      $$('.sliderbox_icon')[i].addClass('sliderbox_icon_current');
      this.arrEl[i].setStyles({
          left: 496,
          top: 0,
          'z-index': 15,
          'display': 'block'
      }
      );
      
    //var nl = i*-496;
    //this.currentPos = nl;
    this.current = i;
    this.arrEl[i].get('tween').chain(this.resetZ.bind(this));
    this.arrEl[i].tween('left',0);
    
    
    $$('.homepage_welcome').setStyle('display', 'block');
    if(this.arrEl[i].getElements('.sliderbox_text .csc-default').length <= 0) {
  $$('.homepage_welcome').setStyle('display', 'none');
    }
    
    
  }
  
});

window.addEvent('domready',
function()
{
   if($$('.slider_outer').length > 0)
   {
           var sl = new Headerslider();
           sl.init($$('.slider_outer')[0], {'autoStart':true});
           new Element('div',{'class':'slider_outer_stop'})
           .addEvent('click',sl.stopTimer.bind(sl))
           .inject($$('.slider_outer')[0]);
           new Element('div',{'class':'slider_outer_start'})
           .setStyle('display','none')
           .addEvent('click',sl.startTimer.bind(sl))
           .inject($$('.slider_outer')[0]);
   }
   if($$('.slider_products').length > 0)
   {
           var sl = new Headerslider();
           sl.init($$('.slider_products')[0], {'imagePreview': true, 'autoStart':false});
   }
});