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

	options:
	{
		autoplay: false,
		autopause: false,
		autodots: false,

		browse:
		{
			previous: null,
			next: null
		},

		direction: 'left',
		delay: 4000,
		duration: 'long'
	},

	initialize: function(el, options)
	{
		this.element = $(el);

		/*
		if (this.element.style.position != 'absolute')
		{
			this.element.style.position = 'relative';
		}
		*/

		this.element.store('slideshow', this);

		if (!options)
		{
			options = {};
		}

		if (this.element.hasClass('autoplay'))
		{
			options.autoplay = true;
		}

		if (this.element.hasClass('autopause'))
		{
			options.autopause = true;
		}

		if (this.element.hasClass('autodots'))
		{
			options.autodots = true;
		}

		if (this.element.hasClass('left'))
		{
			options.direction = 'left';
		}

		if (this.element.hasClass('right'))
		{
			options.direction = 'right';
		}

		if (this.element.hasClass('top'))
		{
			options.direction = 'top';
		}

		if (this.element.hasClass('bottom'))
		{
			options.direction = 'bottom';
		}


		var cl = this.element.className;

		var transitionSpeed = cl.match(/transition-speed:([^\s]+)/);

		if (transitionSpeed)
		{
			this.options.duration = transitionSpeed[1];
		}






		this.slices = this.element.getChildren();

		if (this.slices.length < 2)
		{
			return;
		}

		this.setOptions(options);

		this.dots = null;

		if (this.options.autodots)
		{
			this.dots = new Element('ul', { 'class': 'wd-slideshow-dots' });

			this.slices.each
			(
				function (dummy, i)
				{
					el = new Element('li', { html: 'dot' });

					if (!i)
					{
						el.addClass('selected');
					}

					el.addEvent
					(
						'click', function(ev)
						{
							this.setActive(i);
						}
						.bind(this)
					);

					this.dots.adopt(el);
				},

				this
			);

			this.dots.inject(this.element, 'after');
		}

		this.browse = this.element.getParent().getElement('div.wd-slideshow-browse');

		if (this.browse)
		{
			this.browse.set('opacity', 0);
			this.options.browse.previous = this.browse.getElement('a[href$=previous]');
			this.options.browse.next = this.browse.getElement('a[href$=next]');
		}

		var is_vertical = (this.options.direction == 'top' || this.options.direction == 'bottom');

		var tweenProperty = is_vertical ? 'top' : 'left';
		var el_size = this.element.getSize();

		this.el_size = el_size;

		var hidden = this.getHiddenPositions();
		var hidden_start = hidden.start;

		var tweens = [];
		var slices = this.slices;
		var slices_count = slices.length;

		for (var i = 0 ; i < slices_count ; i++)
		{
			var slice = slices[i];

			tweens[i] = new Fx.Tween(slice, { property: tweenProperty, link: 'chain', duration: this.options.duration });

			var styles =
			{
				position: 'absolute',
				top: is_vertical ? el_size.y * i : 0,
				left: is_vertical ? 0 : el_size.x * i
			};

			if (i > 0)
			{
				styles[tweenProperty] = hidden_start;
			}

			slice.setStyles(styles);
		}

		this.tweens = tweens;
		this.index = 0;

		//
		// browse
		//

		if (this.options.browse.previous)
		{
			this.options.browse.previous.addEvent
			(
				'click', function(ev)
				{
					ev.stop();

					this.previous();
				}
				.bind(this)
			);
		}

		if (this.options.browse.next)
		{
			this.options.browse.next.addEvent
			(
				'click', function(ev)
				{
					ev.stop();

					this.next();
				}
				.bind(this)
			);
		}

		//
		// autopause
		//

		if (this.options.autopause)
		{
			var self = this;

			function enter(ev)
			{
				self.pause();

				if (self.browse)
				{
					self.browse.fade('in');
				}
			}

			function leave(ev)
			{
				var c = this.getCoordinates();
				var x = ev.page.x;
				var y = ev.page.y;

				//console.log('leave: %a, %d <= %d <= %d, %d <= %d <= %d', ev, c.left, x, c.right, c.top, y, c.bottom);

				if (c.left <= x && x <= c.right && c.top <= y && y <= c.bottom)
				{
					//console.log('still inside: %d, %d, %d, %d', c.left <= x, x <= c.right, c.top <= y, y <= c.bottom);

					return;
				}

				if (this == self || this == self.browse)
				{
					self.browse.fade('out');
				}

				//console.log('play !');

				self.play();
			}

			this.element.addEvents
			({
				mouseenter: enter,
				mouseleave: leave.bind(this.element)
			});

			if (this.browse)
			{
				this.browse.addEvents
				({
					mouseenter: enter,
					mouseleave: leave.bind(this.browse)
				});
			}

			if (this.dots)
			{
				this.dots.addEvents
				({
					mouseenter: this.pause.bind(this),
					mouseleave: leave.bind(this.dots)
				});
			}
		}

		//
		// autoplay
		//

		if (this.options.autoplay)
		{
			this.play();
		}
	},

	play: function()
	{
		if (this.timer)
		{
			return;
		}

		this.timer = this.next.periodical(this.options.delay, this);
	},

	pause: function()
	{
		if (!this.timer)
		{
			return;
		}

		clearInterval(this.timer);

		this.timer = null;
	},

	setActive: function(i, direction, immediate)
	{
		var length = this.slices.length;
		var out_i = this.index % length;
		var in_i = i % length;

		this.index = in_i;

		if (out_i == in_i)
		{
			return;
		}

		if (this.dots)
		{
			var children = this.dots.getChildren();

			children.removeClass('selected');
			children[in_i].addClass('selected');
		}

		var pos = this.getHiddenPositions(direction);

		if (immediate)
		{
			this.tweens[in_i].set(0);
			this.tweens[out_i].set(pos.finish);
		}
		else
		{
			this.tweens[in_i].start(pos.start, 0);
			this.tweens[out_i].start(0, pos.finish);
		}

		this.fireEvent('changed', { target: this, active: this.slices[in_i] });
	},

	next: function()
	{
		this.setActive(this.index + 1);
	},

	previous: function()
	{
		this.setActive(this.index + this.slices.length - 1, 'right');
	},

	getHiddenPositions: function(direction)
	{
		direction = direction || this.options.direction;

		var is_vertical = (direction == 'top' || direction == 'bottom');
		var size = this.el_size[is_vertical ? 'y' : 'x'];

		var start;
		var finish;

		switch (direction)
		{
			case 'bottom':
			case 'right':
			{
				start = -size - 1;
				finish = size;
			}
			break;

			case 'top':
			case 'left':
			{
				start = size;
				finish = -size - 1;
			}
			break;
		}

		return { start: start, finish: finish};
	}
});

window.addEvent
(
	'load', function()
	{
		var col1 = $('actu');
		var col2 = $('second-column');
		var col3 = $('third-column');

		if (!col1 || !col2 || !col3)
		{
			return;
		}

		var h = col1.getSize().y;

		var col1Pad = col1.getStyle('padding-top').toInt() + col1.getStyle('padding-bottom').toInt();
		var col2Pad = col2.getStyle('padding-top').toInt() + col2.getStyle('padding-bottom').toInt();

		h = Math.max(h, col2.getSize().y - col1Pad);
		h = Math.max(h, col3.getSize().y - col2Pad);

		col1.setStyle('height', h - col1Pad);
		col2.setStyle('height', h - col2Pad);
	}
);

window.addEvent
(
	'domready', function()
	{
		$$('#search-quick input').each
		(
			function(el)
			{
				var label = el.get('data-placeholder');

				if (!el.value)
				{
					el.addClass('empty');
					el.value = label;
				}

				el.addEvents
				({
					focus: function()
					{
						if (this.hasClass('empty'))
						{
							this.value = '';
							this.removeClass('empty');
						}
					},

					blur: function()
					{
						if (!this.value)
						{
							this.addClass('empty');
							this.value = label;
						}
					}
				});
			}
		);
	}
);

window.addEvent
(
	'load', function()
	{
		var inserts = $('detail-metier');

		if (inserts)
		{
			(function() {

			var slideContainer = inserts.getElement('ul');
			var browsePrevious = inserts.getElement('a[href=#previous]');
			var browseNext = inserts.getElement('a[href=#next]');

			var slideshow = new WdSlideshow
			(
				slideContainer,
				{
					autopause: true,

					browse:
					{
						previous: browsePrevious,
						next: browseNext
					},

					duration: 'normal'
				}
			);

			slideshow.play();

			}) ();
		}
	}
);

window.addEvent
(
	'domready', function()
	{
		var trigger = $('credit-popup');

		if (!trigger)
		{
			return;
		}

		var dimmer = new Element('div', { styles: { position: 'fixed', left: 0, top: 0, right: 0, bottom: 0, background: 'black', opacity: 0 }});
		var content = $('credit-content-target');

		dimmer.set('tween', { property: 'opacity', duration: 'short', chain: 'cancel' });

		function show()
		{
			dimmer.inject(document.body);
			content.setStyle('display', 'block');
			dimmer.get('tween').start(.6);
		}

		function hide()
		{
			dimmer.get('tween').start(0).chain
			(
				function()
				{
					content.setStyle('display', '');
					dimmer.dispose();
				}
			);
		}

		dimmer.addEvent('click', hide);

		trigger.addEvent
		(
			'click', function(ev)
			{
				ev.stop();

				show();
			}
		);
	}
);
