var Ticker = Class.create(
{

    initialize: function(element) {
        
        this.speed  = 70; /* px/sec */
        this.margin = 15;
        this.fps    = 30;
        this.effect = Effect.Transitions.linear;
        
        this.container = element;
        
        this.width = this.container.getWidth(); 
        
        this.window = element.select('.window')[0]; 
        
        total_width = 0;
        this.window.childElements().each(function(elem) {
                                            elem.setStyle({ left: total_width + 'px'});
                                            total_width += elem.getWidth()+this.margin;
                                            }.bind(this));
        
        this.total_width = total_width;
        
        this.container.setStyle({ visibility: 'visible' });
        
        this.window.setStyle({ left: this.width + 'px' }); 
        
        // clone window
        this.window_clone = this.window.clone(true);
        this.container.insert({ bottom: this.window_clone });
        
        this.window_clone.setStyle({ left: this.width+this.total_width +'px' });
        
        // stop/start on mouseover/mouseout
        this.container.select('.ticker-elem').each(function(elem) {
                                                   elem.observe('mouseover', this.stop.bind(this)); 
                                                   elem.observe('mouseout', this.startAll.bind(this));                  
                                                   }.bind(this));
        
        this.startAll();
    },

    startAll: function() {
        this.start(this.window);
        this.start(this.window_clone);  
    },
    
    start: function(window) {
        
        pixels_remaining = this.total_width - (-parseInt(window.getStyle('left')));
        duration = pixels_remaining/this.speed;
        
        window.effmove = new Effect.Move(window, { 
                                         mode: 'absolute', 
                                         x: -this.total_width, 
                                         duration: duration,
                                         transition: this.effect,
                                         fps: this.fps,
                                         afterFinish: function(window) {
                                             window.setStyle({ left: this.total_width + 'px' });
                                             this.start(window);
                                         }.bind(this, window)
                                        }
                                       );
        
    },
    
    stop: function(event) {
        this.window.effmove.cancel();
        this.window_clone.effmove.cancel();
        event.stop();
    }
    
});

