var Ticker = new Class({
 Implements : [Options],
  options: {
   speed: 1500,
   delay: 5000,
   direction: 'vertical'
 },
 initialize: function(el, options){
  this.setOptions(options);
  this.el = $(el).addEvents({
   'mouseover': this.over.bind(this),
   'mouseout': this.out.bind(this)
  });

  this.items = this.el.getElements('li');
  var w = 0;
  var h = 0;
  if (this.options.direction.toLowerCase() == 'horizontal') {
   h = this.el.getSize().y;
   this.items.each(function(li, index) {
    w += li.getSize().x;
   });
  } else {
   w = this.el.getSize().x;
   this.items.each(function(li, index) {
    h += li.getSize().y;
   });
  }
  this.el.setStyles({
   position: 'absolute',
   top: 0,
   left: 0,
   width: w,
   height: h
  });

  this.fx = new Fx.Morph(this.el, {duration:this.options.speed, onComplete:function() {
   var i = (this.current == 0) ? this.items.length : this.current;
   this.items[i-1].injectInside(this.el);
   this.el.setStyles({
    left:0,
    top:0
   });
  }.bind(this)});
  this.current = 0;
  this.next();
 },
 next: function() {
  this.current++;
  if (this.current >= this.items.length) this.current = 0;
  var pos = this.items[this.current];
  this.fx.start({
   top: -pos.offsetTop,
   left: -pos.offsetLeft
  });
  this.timeoutId = this.next.bind(this).delay(this.options.delay + this.options.speed);
 },
 over: function(){
  this.fx.pause();
  $clear(this.timeoutId);
 },
 out: function(){
  this.fx.resume();
  this.next();
 }

});


window.addEvent('domready',function(){
  var vertck = new Ticker('TickerVertical', {
   speed: 1500,
   delay: 3000,
   direction: 'vertical'
  });
/*
  $('stop_scroll').addEvent('click', function() {
   $('play_scroll_cont').setStyle('display', 'block');
   $('stop_scroll_cont').setStyle('display', 'none');
   vertck.pause();
  });
  $('play_scroll').addEvent('click', function() {
   $('stop_scroll_cont').setStyle('display', 'block');
   $('play_scroll_cont').setStyle('display', 'none');
   vertck.resume();
  });
*/
})