/* 
Copyright 2009 Jeroen 'VeXocide' Habraken

Permission is hereby granted, free of charge, to any person
obtaining a copy of this software and associated documentation
files (the "Software"), to deal in the Software without
restriction, including without limitation the rights to use,
copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the
Software is furnished to do so, subject to the following
conditions:

The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.

--- 

Our carousel has been well and truely hacked to bits. 
To view the original go to http://dev.vexocide.org/

The F5 Team

*/

var vScroller = new Class({
    Extends: Scroller,

    // Extended with an option to specify a listener instead of the default element
    initialize: function(element, options) {
        this.parent(element, options);
        if (this.options.listener)
            this.listener = $(this.options.listener);
    },

    // Extended to ignore the y coordinate, this saves a lot of useless onChange y events
    scroll: function() {
        var size = this.element.getSize(), 
            scroll = this.element.getScroll(),
            // MooTools 1.1 compatible, pos = this.element.getPosition()
            pos = this.element.getOffsets(), 
            change = {'x': 0};

        if (this.page.x < (this.options.area + pos.x) && scroll.x != 0)
            change.x = (this.page.x - this.options.area - pos.x) * this.options.velocity;
        else if (this.page.x + this.options.area > (size.x + pos.x) && size.x + size.x != scroll.x)
            change.x = (this.page.x - size.x + this.options.area - pos.x) * this.options.velocity;

        if (change.x)
            this.fireEvent('onChange', [scroll.x + change.x, 0]);
    } 
});

var vCarousel = new Class({
    Implements: [Events, Options],

    options: {
        'slider': null,
        'title': null,
        onProgress: $empty,
        onPreload: $empty,
        onComplete: $empty
    },
    
    initialize: function(list, options) {
        this.setOptions(options);

        this.list = $(list);
        this.container = this.list.getParent();
        this.listener = this.container.getParent();
        
        this.container.setStyle('overflow', 'hidden').scrollTo(0, 0);
       
        var sources = [];
        var items = this.list.getChildren();
		
        items.each(function(item) {
		
            var image = item.getElement('img') || item.getElement('a img');
			var heading = item.getElement('h1');
			var text = item.getElement('p');
			
			if(image){
				if (image.getParent().get('tag') == 'a')
					item.setProperty('_href', image.getParent().getProperty('href'));         
	
				sources.push(image.getProperty('src'));
				//item.empty(); 
			}
        });

        var t = this;
        var assets = Asset.images(sources, {
            onProgress: function(counter, index) {
                this.fireEvent('onProgress', [counter + 1, sources.length]);
            }.bind(t),
            onComplete: function() {
                assets.each(function (asset, index) {
                    
					var wrapper = new Element('div', {'class': 'image', 'styles': {'opacity': '0.0'}}).adopt(asset);
                    //items[index].adopt(wrapper);				                
				}, this);

                this.fireEvent('onPreload');

                assets.each(function(asset) {
                    asset.getParent().fade('in', {'duration': 'long'});
                }); 

                var last = list.getLast();
                var size = last.getOffsets(list).x + (last.getStyle('width').toInt() - last.getFirst().getStyle('padding-right').toInt());
                list.setStyle('width', size);

                this.scroller = new vScroller(this.container, {
                    'area': Math.floor(this.container.getSize().x / 6),
                    'velocity': 0.1,
                    'listener': this.listener,
                    onChange: function(x) {
                        this.container.scrollTo(x, 0);
                        if (this.slider)
                            this.slider.set(x);
                    }.bind(this)
                }, this); 
                this.scroller.start();
              
                this.listener.addEvent('mouseenter', this.scroller.attach.bind(this.scroller))
                             .addEvent('mouseleave', this.scroller.detach.bind(this.scroller));

                this.options.slider.options = $merge({
                    'steps': this.list.getSize().x - this.container.getSize().x,
                    onChange: function(x) { 
                        this.container.scrollTo(x);
                    }.bind(this)
                }, this.options.slider.options);
            
                this.fireEvent('onComplete');
            }.bind(t)
        });
    },

    scrollTo: function(x) {
        this.container.scrollTo(x, 0);
    }
});