Element.implement({	
	backgroundOpacity: function(options) {
		var width = this.getSize().x;
		var height = this.getSize().y;
		
		var div = new Element('div', {
			'class': 'background-opacity',
			'styles': {
				'position': 'absolute',
				'left': this.getPosition().x,
				'top': this.getPosition().y,
				'opacity': options.opacity,
				'width': width+'px',
				'height': height+'px',
				'background-color': options.backgroundColor,
				'zIndex': 10
			}
		}).inject(document.body);

		this.setStyles({
			'position': 'relative',
			'zIndex': 1000
		});

	window.addEvent('resize', function() {
			div.setStyles({
				'left': this.getPosition().x,
				'top': this.getPosition().y
			});
		}.bind(this));

	}
});


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

	options: {
		
	},

	initialize: function(container, options) {
		
		this.container = container;
	
		this.setOptions(options);
		this.list = this.container.getElement('ul');

		this.items = this.list.getElements('li');
		this.list.setStyle('opacity', 0);

		this.items.setStyles({
			'float': 'left'
		});

		var images = [];
		this.items.each(function(el) {
			images.push(el.getElement('img').getAttribute('src'));
		});
		

		this.preload(images);

	},
	preload: function(images) {
		this.loadedImages = new Asset.images(images, {
			'onComplete': this.init.bind(this)
		});
		
	},
	init: function() {
		
		this.items.each(function(el) {			
			this.width += el.getSize().x;
		}.bind(this));
		// normalement faudrait calculer les marges
		//this.width += 120;
	
		this.list.setStyles({
			'width': this.width*3+'px',
			'position': 'absolute',
			'left': 0
		});

		this.fx = new Fx.Tween(this.list, {'duration': 20000, 'transition': Fx.Transitions.linear });
	
		this.startFx();

		this.list.addEvents({
			'mouseover': function() {
				this.fx.pause();
			}.bind(this),
			'mouseleave': function() {
				this.fx.resume();
			}.bind(this)
		});
		
		this.copy = this.items.clone();
		this.copy.inject(this.list);

		this.fx.addEvent('complete', function() {
			this.list.setStyle('left', 0);
			this.startFx();
		}.bind(this));

		this.list.fade(1);

	},
	startFx: function() {
		this.fx.start('left', -this.width+'px');
	},
	container: null,
	list: null,
	items: null,
	width: 0,
	fx: null,
	copy: null,
	loadedImages: null
});


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

	options: {
		imageWidth: 195
	},

	initialize: function(container, options) {
		this.container = container;
		this.covers = this.container.getElement('ul#covers');
		this.magazines = this.container.getElement('ul#magazines');

		this.links = this.magazines.getElements('li.title');

		this.links.each(function(el) {
			el.addEvent('click', function() {
				this.fx.cancel();
				var target = el.getAttribute('id').split('_');
				this.moveTo(target[1]);
				return false;
			}.bind(this));
		}.bind(this));

		this.nbCovers = this.covers.getElements('img').length;
		this.fx = new Fx.Tween(this.covers, {'duration': 800, 'transition': Fx.Transitions.Cubic.easeInOut });
	},
	moveTo: function(position) {
		position = parseInt(position);
		this.currentPosition = position*this.options.imageWidth;
		this.fx.start('left', -this.currentPosition+'px');
	},
	next: function() {
		this.currentPosition = this.currentPosition+this.options.imageWidth;
		if(this.nbCovers * this.options.imageWidth > this.currentPosition) {
			this.fx.cancel();
			this.fx.start('left', -this.currentPosition+'px');
		}
	},
	previous: function() {
		this.currentPosition = this.currentPosition-this.options.imageWidth;
		if(this.currentPosition > -1) {
			this.fx.cancel();
			this.fx.start('left', -this.currentPosition+'px');
		}
	},
	container: null,
	covers: null,
	magazines: null,
	links: [],
	currentPosition: 0,
	nbCovers: 0
});

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

	options: {
		'width': 640,
		'height': 480,
		'overlay': {
			'opacity': 0.8,
			'background': '#000'
		}
	},
	initialize: function(element, options) {
		this.element = element;
		this.element.addEvent('click', this.preload.bind(this));
	},
	show: function() {

		this.overlay = new Element('div', {
			'class': 'overlay',
			'styles': {
				'position': 'absolute',
				'top': '0',
				'left': '0',
				'width': '100%',
				'background': this.options.overlay.background,
				'opacity': '0',
				'display': 'none',
				'zIndex': '50000',
				'height': window.getSize().y+'px'
			}
		}).inject(document.body);


		this.image = new Element('img', {
			'src': 'images/presse/'+this.element.getAttribute('alt')+'/page.jpg'
		});


		this.container = new Element('div',{
			'class': 'lightbox-container',
			'styles': {
				'width': this.image.width+'px',
				'height': this.image.height+'px',
				'top': '100px',
				'left': 0,
				'position': 'absolute'
			}
		}).inject(document.body);

		this.image.inject(this.container);

		//var pageImage = new Image('images/presse/'+this.element.getAttribute('alt')+'/page.jpg');

		/* add close button */
		this.closeButton = new Element('a', {
			'class': 'lightbox-close',
			'href': '#',
			'text': 'FERMER'
		}).inject(this.container);

		this.centerImage();

		if(this.detailImage) {
			this.image.addEvents({
				'mouseenter': function() {
					this.image.src = 'images/presse/'+this.element.getAttribute('alt')+'/detail.jpg';
					this.centerImage();
				}.bind(this),
				'mouseleave': function() {
					this.image.src = 'images/presse/'+this.element.getAttribute('alt')+'/page.jpg';
					this.centerImage();
				}.bind(this)
			})
		}
		

		this.closeButton.addEvent('click', this.close.bind(this));

		/* show overlay */
		
		this.overlay.setStyle('display', 'block');
		this.overlayFx = new Fx.Tween(this.overlay, {
			'duration': 500,
			'transition': Fx.Transitions.Sine.easeInOut
		});

		

		this.container.setStyles({
			'display': 'block',
			'opacity': 0
		});
		this.centerImage();
		this.fx = new Fx.Tween(this.container, {
			'duration': 500
		});

		this.fx.start('opacity', 1);
		this.overlayFx.start('opacity', this.options.overlay.opacity);

		this.overlayFx.addEvent('complete', this.centerImage.bind(this));


		this.hideLoader();

		return false;
	},
	centerImage: function() {		
		this.container.setStyles({
			'left': '50%',
			'margin-left': - this.image.width/2 +'px'
		});
	},
	close: function() {
		this.fx.start('opacity', 0);
		this.overlayFx.start('opacity', 0);
		this.fx.addEvent('complete', function() {
			this.container.destroy();
			this.overlay.destroy();
		}.bind(this));
		return false;
	},
	preload: function() {		
		if(this.element.hasClass('detail')) {
			this.showLoader();
			this.pageImage = new Asset.images('images/presse/'+this.element.getAttribute('alt')+'/page.jpg', {
				'onComplete': function() {
					this.show();
				}.bind(this)
			});
			this.detailImage = new Asset.images('images/presse/'+this.element.getAttribute('alt')+'/detail.jpg');

			return false;
		}
		if(this.element.hasClass('page')) {
			this.showLoader();
			this.pageImage = new Asset.images('images/presse/'+this.element.getAttribute('alt')+'/page.jpg', {
				'onComplete': function() {
					this.show();
				}.bind(this)
			});
			return false;
		}	
		return false;
	},
	showLoader: function() {
		this.loader = new Element('div', {
			'class': 'lightbox-loader',
			'styles': {
				'opacity': '0.5',
				'background-color': '#000'
			}
		});
		this.element.getParent().grab(this.loader);
	},
	hideLoader: function() {
		this.loader.destroy();
	},
	element: null,
	overlay: null,
	overlayFx: null,
	loader: null,
	container: null,
	fx: null,
	pageImage: null,
	detailImage: null,
	image: null
});

