/**
@author Ferdi Hulleman
@requires unobtrusive.js (Behaviour), prototype.js, effects.js (Scriptaculous)

Based on 'side scrolling page' by David Baxter (www.creativeui.com)
*/

var ScrollBox = Class.create();
ScrollBox.prototype = {
  initialize: function(id,less,more,styleopts,lessaction, moreaction) {
    this.id = id || 'ScrollBox';
    this.less = less || 'LeftArrow';
    this.more = more || 'RightArrow';
    this.styleopts = styleopts || {  
      color:{ 
	normal: '#555', 
	disabled: '#cbccce'
      },
      cursor:{
	normal: 'pointer',
	disabled: 'default'
      }
    }; 
    this.lessaction = lessaction;
    this.moreaction = moreaction;

    var elem = $(this.id);
    if (elem) {
      this.width = elem.getWidth();
      this.blocks = elem.getElementsByClassName('block').length;
      this.current_block = this.blocks;
      Behaviour.addHandler(document.getElementById(this.less), 'onclick', this.moveLeft.bind(this)); 
      Behaviour.addHandler(document.getElementById(this.more), 'onclick', this.moveRight.bind(this));  
      this.bigbox = elem.getElementsByClassName('bigbox')[0];
      // use disabled styles for LeftArrow/backbutton
      for (var i in this.styleopts) { 
	document.getElementById(this.less).style[i] = this.styleopts[i].disabled;
      }
    }
    else {
      throw('Cannot init ScrollBox, perhaps an incorrect id?');      
    }
  },

  moveLeft: function() {
      for (var i in this.styleopts) { 
	document.getElementById(this.more).style[i] = this.styleopts[i].normal;
      }

    if (this.current_block!=this.blocks) {
      new Effect.MoveBy(this.bigbox, 0, this.width , 
                              {
                                  duration: 0.4,  
                                  transition: Effect.Transitions.sinoidal,
				  queue: 'end'
                              });
      this.current_block++;
      if (this.moreaction){
	eval(this.moreaction);
      }
    }
    if (this.current_block == this.blocks) {
      for (var j in this.styleopts) { 
	document.getElementById(this.less).style[j] = this.styleopts[j].disabled;
      }      
    }
  },

  moveRight: function() {
    for (var i in this.styleopts) { 
	document.getElementById(this.less).style[i] = this.styleopts[i].normal;
    }

    if (this.current_block!=1) {
      new Effect.MoveBy(this.bigbox, 0, -this.width , 
                              {
                                  duration: 0.4,  
                                  transition: Effect.Transitions.sinoidal,
				  queue: 'end'
			      });
      this.current_block--;
      if (this.lessaction){
	eval(this.lessaction);
      }
    }
    if (this.current_block == 1)
    {
      for (var j in this.styleopts) { 
	document.getElementById(this.more).style[j] = this.styleopts[j].disabled;
      } 
    }
  }
};