/**
* blueend Paginator 2.21
* (c) blueend web:applications AG
* -------------------------------------------------------------------
* MIT License
*/
bePaginator = Class.create();
bePaginator.prototype = {
  initialize:function(el,options){
    this.el = $(el);
    if (!this.el) return false;
    
     // Default Options
    this.options = {};
    this.options.firstItem = 0; // First page/item to show, use 'random' or id of page (starts with 0)
    this.options.slideMargin = 10; // Margin between Slides
    this.options.autoNext = 0; // Go to next slide each x Seconds
    this.options.centerVertical = false; // Center items vertically
    this.options.align = 'horizontal'; // Alignment for slide transition: vertical or horizontal
    this.options.transition = 'slide'; // Possible types: slide, fade or none
    this.options.transition_type = Effect.Transitions.sinoidal; // e.g. Effect.Transitions.spring/linear/
    this.options.duration = 1; // Duration of transition effect in seconds
    this.options.startWithTransition = false; // If enabled, the first page will be faded in/slided in using the transition set
    this.options.loop = true; // If enabled, going to the next item on the last item will go back to item 1 and vice-versa
    this.options = Object.extend(this.options, options);
    
    // PageNavigation
    if(options.pagenav){
      this.pagenav = $(options.pagenav);
    }else{
      this.pagenav = false;
    }

    // Init
    this.items = $(el).childElements();
   
    this.current_item = 0;
    this.item_height = 0;
    
    if (this.options.firstItem == 'random') this.current_item = Math.floor(Math.random() * this.items.length-1);
    
    if (this.items[0]){
      this.item_width = this.items[0].getWidth();
      this.item_height =  this.items[0].getHeight();
    }
    this.container_height = this.el.getHeight();
    this.container_width = this.el.getWidth();
    if (this.item_width == 0) this.item_width = this.container_width;
    
    this.items.each(function(el){
      if (this.container_height<el.getHeight())
        if (el.getHeight()>0) 
          this.container_height = el.getHeight();
    }.bind(this));
  

    this.el.setStyle({width: this.item_width+'px', overflow: 'hidden', position: 'relative'});
    if (this.item_height>0) this.el.setStyle({height: this.item_height});

    if ((this.options.transition=='fade') || (this.options.transition=='none'))
      this._initializeFade();
    else
      this._initializeSlide();
      
    if (this.options.centerVertical)
      this.items.each(function(el){
        var new_height = ((this.item_height - el.getHeight()) / 2);
        el.setStyle({top: new_height});
      }.bind(this));

    this.queue = [];

    if (this.options.autoNext > 0){
      new PeriodicalExecuter(this._autoNext.bind(this), this.options.autoNext);
    }
    
    document.observe("dom:loaded", function(){
      this._moveTo(this.current_item);
    }.bind(this));
  },

  nextItem: function(no_queue){
    this.options.autoNext = false;
    this._nextItem();
    this._pageNav();
  },

  previousItem: function(){
    this.options.autoNext = false;
    this._previousItem();
    this._pageNav();
  },
  
  gotoItem: function(number){
    this.options.autoNext = false;
    if(this.current_item != number){
      this._moveTo(number);
      this.current_item = number;
      this._pageNav();
    }
  },
  
  _initializeSlide: function(){
    // Create Slider Container
    this.slideContainer = $(document.createElement('div'));
    this.items.each(function(el){this.slideContainer.appendChild(el)}.bind(this));
    this.el.appendChild(this.slideContainer);
    this.slideContainer.absolutize();
    
    // Position items on Slider Container
    this.next_pos = 0;
    this.items.each(function(el){
      if (this.options.align == 'vertical'){
        el.setStyle({position: 'absolute', top: 0,  width: this.item_width, top: this.next_pos+'px'});
        this.next_pos = this.next_pos + this.item_height+this.options.slideMargin;
      } else {
        el.setStyle({position: 'absolute', top: 0,  width: this.item_width, left: this.next_pos+'px'});
        this.next_pos = this.next_pos + this.item_width+this.options.slideMargin;        
      }
    }.bind(this));
    
    if (!this.options.startWithTransition){
      if (this.options.align == 'vertical')
        this.slideContainer.setStyle({top: '-'+this.items[this.current_item].getStyle('top')});
      else
        this.slideContainer.setStyle({top: '-'+this.items[this.current_item].getStyle('top')});
    }
  },
  
  _initializeFade: function(){
     this.items.each(function(el,el_id){
        if (el_id == this.current_item)
          el.setStyle({position: 'absolute', top: 0,  width: this.item_width, left: 0});
        else
          el.setStyle({position: 'absolute', top: 0,  width: this.item_width, left: 0, display: 'none'});
     }.bind(this)); 
  },
  
  _pageNav: function(){
    if (this.pagenav){
      this.pagenav.select('.pagebtn').invoke('removeClassName','sel');
      this.pagenav.select('.pagebtn')[this.current_item].addClassName('sel');
    }
  },

  _autoNext: function(){
    if (this.options.autoNext>0) {
      this._nextItem();
      this._pageNav();
    }
  },

  _nextItem: function(no_queue){
    var nextItem = ((this.current_item + 1)>(this.items.length-1)) ? (this.options.loop ? 0 : (this.items.length-1)) : (this.current_item + 1);
    this._moveTo(nextItem);
    this.current_item = nextItem;
  },

  _previousItem: function(no_queue){
    var nextItem = ((this.current_item - 1)>=(0)) ? (this.current_item - 1) : (this.options.loop ? (this.items.length-1) : 0);
    this._moveTo(nextItem);
    this.current_item = nextItem;
  },
  
  _moveTo:function(itemID){
    if (this.options.transition == 'slide')
      return this._moveToSlide(itemID);
    if (this.options.transition == 'none')
      return this._moveToNone(itemID);
    if (this.options.transition == 'fade')
      return this._moveToFade(itemID);
  },
  
  // No Transition
  _moveToNone:function(itemID){
    this.items.each(function(el){el.hide();});
    this.items[itemID].show();
  },
  
  // Fade Transition
  _moveToFade:function(itemID){
    var queue_scope = 'slider_transition_' + this.el.identify();
    var queue = Effect.Queues.get(queue_scope); // Create a queue for each element on this page
    queue.each(function(effect) { effect.cancel(); });
    this.items.each(function(el, el_id){ 
      if (el_id == itemID){
        Effect.Appear(el, {duration: this.options.duration, queue: {scope: queue_scope}, transition: this.options.transition_type});
      } else {
        Effect.Fade(el, {duration: this.options.duration, queue: {scope: queue_scope}, transition: this.options.transition_type});
      }
    }.bind(this));
  },
  
  // Slide Transition (vertical or horizontal)
  _moveToSlide:function(itemID){
    if (this.lastMove) this.lastMove.cancel();
    if (this.options.align == 'vertical'){
      this.lastMove = new Effect.Morph(this.slideContainer,{style: 'top: -'+ this.items[itemID].getStyle('top'), duration: this.options.duration, transition: this.options.transition_type}); 
    } else {
      this.lastMove = new Effect.Morph(this.slideContainer,{style: 'left: -'+ this.items[itemID].getStyle('left'), duration: this.options.duration, transition: this.options.transition_type}); 
    }
  }
}
