/*
---

script: Pager.js

description: TBD

requires:
- /Mootools

provides: [FadePager]

...
*/
Fx.Custom = new Class({

    Extends: Fx,
    
    options: {
        compute: function(from, to, delta) {
            return false;
        },
        set: function(now) {},
        start: function(from, to) {}
    },

    initialize: function(options){
        this.parent(options);
    },

    compute: function(from, to, delta){
        this.set(this.options.compute(from, to, delta));
    },

    set: function(now){
        this.options.set(now);
        return this;
    },

    start: function(from, to){
        if (!this.check(from, to)) return this;
        this.options.start(from, to);
        return this.parent(from, to);
    }

});


var FadePager = new Class({
    Implements: [Options, Events],
    
    options: {
        mode: 'vertical', // horizontal ou vertical
        loop: 'repeat', // none, repeat ou spin
        autoplay: true,
        'wait-time': 4000
    },
    
    initialize: function(element, options) {
        this.element = $(element);
        this.setOptions(options);
        
        this.build();
    },
    
    build: function() {
        this.list = this.element.getElement('ul');
        this.pages = this.list.getChildren('li');
        this.running = false;
        
        this.size = this.element.getSize();
        this.element.setStyles({
            position: 'relative',
            overflow: 'hidden'
        });
        this.list.setStyles({
            position: 'absolute',
            left: 0,
            top: 0
        });
        
        this.current = 0;
        this.total = this.pages.length;
        
        if (this.total == 0) {
        	return;
        }
            
        this.pages.each((function(el) {
            el.setStyles({
                position: 'absolute',
                left: 0,
                top: 0,
                width: this.size.x,
                height: this.size.y,
                'z-index': 0,
                'opacity': 0
            });
        }).bind(this));
        
        this.getCurrentElement().setStyles({
            'opacity': 1,
            'z-index': 1
        });
        
        this.fx = new Fx.Custom({
            transition: Fx.Transitions.Sine.easeInOut,
            duration: 'long',
            link: 'chain',
            
            start: function(from, to) {
                to.setStyles({
                    'opacity': 0,
                    'z-index': 2
                });
            },
            compute: function(from, to, delta) {
                var now = {};
                
                now.fromElement = from;
                now.toElement = to;
                now.delta = delta;
                
                return now;
            },
            set: (function(now) {
                if (!now) return;
            
                if (now.delta < 1) {
                    now.toElement.setStyle('opacity', now.delta);
                    now.fromElement.setStyle('opacity', (1-now.delta));
                } else {
                    now.toElement.setStyles({
                        'opacity': 1,
                        'z-index': 1
                    });
                    now.fromElement.setStyles({
                        'opacity': 0,
                        'z-index': 0
                    });
                }
            }).bind(this)
        }).addEvent('complete', this.onComplete.bind(this));
        
        if (this.options.autoplay && this.total > 1) {
            this.play();
        }
    },
    
    getCurrent: function() {
        return this.current;
    },
    
    getCurrentElement: function() {
        return this.pages[this.current];
    },
    
    getElement: function(index) {
        return this.pages[index];
    },
    
    count: function() {
        return this.total;
    },
    
    isFirst: function() {
        return (this.current == 0);
    },
    
    isLast: function() {
        return (this.current == this.total-1);
    },
    
    first: function() {
        return this.goto(0);
    },
    
    previous: function() {
        var page = this.current - 1;
        if (page >= 0 || this.options.loop == 'repeat') {
            return this.goto(page);
        } else if (this.options.loop == 'spin') {
            return this.last();
        }
        return false;
    },
    
    next: function() {
        var page = this.current + 1;
        if (page < this.total || this.options.loop == 'repeat') {
            return this.goto(page);
        } else if (this.options.loop == 'spin') {
            return this.first();
        }
        return false;
    },
    
    last: function() {
        return this.goto(this.total-1);
    },
    
    goto: function(page, now) {
        if (now) {
            this.getCurrentPage().setStyles({
                'opacity': 0,
                'z-index': 0
            });
        
            this.current = page.limit(0, this.total-1);
            
            this.getCurrentPage().setStyles({
                'opacity': 1,
                'z-index': 1
            });
            
            this.fireEvent('change');
            return;
        }

        if (page == -1 && this.isFirst()) {
            page = this.total-1;
        } else if (page == this.total && this.isLast()) {
            page = 0;
        } else {
            page = page.limit(0, this.total-1);
        } 

        if (page != this.current) {
            this.fireEvent('beforeChange');
            
            this.fx.start(this.getCurrentElement(), this.getElement(page));
            
            this.current = page;
            this.reset();
            return true;
        }
        return false;
    },
    
    isRunning: function() {
        return this.running;
    },
    
    play: function() {
        if (!this.timer && this.total > 0) {
            this.timer = this.onTimer.delay(this.options['wait-time'], this);
            this.running = true;
        }
    },
    
    stop: function() {
        $clear(this.timer);
        this.timer = false;
        this.running = false;
    },
    
    reset: function() {
        if (this.isRunning()) {
            this.stop();
            this.play();
        }
    },
    
    onTimer: function() {
        this.timer = false;
        if (!this.next()) {
            this.stop();
        }
        
        if (this.current == 0) {
            this.fireEvent('begin');
        } else if (this.current == this.total-1) {
            this.fireEvent('end');
        }
    },
    
    onComplete: function() {
        if (this.repeat) {
            this.goto((this.current < 0 ? this.total-1 : 0), true);
            this.repeat.destroy();
            this.repeat = false;
        }
        this.fireEvent('change');
    }
});


var listExamples = ["boeuf", "agneau", "crêpe", "poulet", "pâtes", "poisson",
	"chocolat", "crème", "dindon", "fromage", "fruits", "gibier", "légumes",
	"oeuf", "crustacés", "porc", "volaille", "riz", "veau", "boisson", "cocktail",
	"brochettes", "déjeuner", "brunch", "dessert", "entrée", "fondue", "pain",
	"pizza", "salade", "sauce", "huile", "soupe", "potage", "barbecue"
];

var ChangeExample = function() {
	$('fExemple').fade('out');
};

window.addEvent('domready', function() {
	var diapos = $('diapos').getElement('img');

	diapos.addEvent('load', function() {
		(function() {
			var src = diapos.get('src');
			src = src.replace('diap1', 'diap2');
			diapos.set('src', src);
		}).delay(4000);
	});
	
	
	// Gestion du rechercher
	var timer = ChangeExample.periodical(3000);
	$('fExemple').set('tween', {
		duration: 'short',
		onComplete: function() {
			if ($('fExemple').getStyle('opacity') <= 0.1) {
				var exemple = listExamples.getRandom();
				$('fExemple').set('text', "ex : " + exemple);
				
				if (timer) {
					$('fExemple').fade('in');
				}
			}
		}
	});
	
	$('fRechercher').addEvent('focus', function() {
		$('fExemple').fade('out');
		$clear(timer);
		timer = false;
	});
	
	$('fRechercher').addEvent('blur', function() {
		if (this.value == "") {
			$('fExemple').fade('in');
			timer = ChangeExample.periodical(3000);
		}
	});
	
	$('fExemple').setStyles({
		opacity: 0,
		display: 'block'
	});
	$('fExemple').get('tween').fireEvent('complete');
	
	
	// Gestion des publicités
    var element = $('externalads');
    if (element) {
        var pager = new FadePager(element, {
            autoplay: true,
            'wait-time': 5000
        });
    }
});