window.addEvent('domready',function(){
	$$('div.product-list a.info-link, div.popup a.chart').each(function(link){
		new simpleLightbox(link);
	});
});

var simpleLightbox = new Class({
	options:{
		closeLink:'a.close,a.close-link',
		animSpeed:400,
		IE:true,
		overlayId:'overlay',
		overlayColor:'#000',
		overlayOpacity:0.5,
		wrapper:'div.container',
		zIndex:2
	},
	initialize:function(element,options){
		this.setOptions(options)
		this.link = element;
		this.lightbox = $$(this.link.getProperty('href'))[0];
		if (!this.lightbox) return;
		this.closeLink = this.lightbox.getElement(this.options.closeLink);
		if (this.options.IE && navigator.userAgent.toLowerCase().indexOf('msie') != -1) this.IE = true;
		else this.IE = false;
		this.createOverlay();
		this.setStyles();
		this.bindEvents();
	},
	createOverlay:function(){
		if (!simpleLightbox.prototype.firstRun) {
			simpleLightbox.prototype.firstRun = true;
			var overlay = $(this.options.overlayId);
			if (!overlay) {
				overlay = new Element('div').setProperty('id',this.options.overlayId).inject($$('body')[0]);
				overlay.setStyles({display:'none',backgroundColor:this.options.overlayColor,position:'absolute',left:0,top:0,zIndex:this.options.zIndex,opacity:0});
				simpleLightbox.prototype.overlay = overlay;
			}
			simpleLightbox.prototype.wrapper = $$(this.options.wrapper)[0];
		}
		this.overlay = simpleLightbox.prototype.overlay;
		this.wrapper = simpleLightbox.prototype.wrapper;
	},
	setStyles:function(){
		this.lightbox.setStyles({left:-99999,top:-99999,visibility:'hidden',zIndex:this.options.zIndex+1});
		if (!this.IE) this.lightbox.setStyles({opacity:0});
	},
	bindEvents:function(){
		this.link.addEvent('click',this.showLightbox.bind(this));
		if (this.closeLink) this.closeLink.addEvent('click', this.closeLightbox.bind(this))
		this.overlay.addEvent('click',this.closeLightbox.bind(this));
		$(window).addEvent('resize',this.setPosition.bind(this,false));
	},
	showLightbox:function(e){
		if (simpleLightbox.prototype.active) {
			simpleLightbox.prototype.active.hidePopup(function(){
				this.showPopup();
				this.setPosition(true);
			}.bind(this));
		} else {
			this.showPopup();
			this.showFader();
			this.setPosition(true);
			simpleLightbox.prototype.active = this;
		}
		if (e) e.preventDefault();
	},
	closeLightbox:function(e){
		this.hidePopup();
		this.hideFader();
		simpleLightbox.prototype.active = false;
		if (e) e.preventDefault();
	},
	showPopup:function(){
		var lightboxFx = new Fx.Morph(this.lightbox,{duration:this.options.animSpeed});
		this.lightbox.setStyles({top:0,left:0,visibility:'visible'});
		if (!this.IE) lightboxFx.start({opacity:1});
	},
	showFader:function(){
		var overlayFx = new Fx.Morph(this.overlay,{duration:this.options.animSpeed});
		this.overlay.setStyles({display:'block'});
		overlayFx.start({opacity:this.options.overlayOpacity});
	},
	hidePopup:function(cb){
		var lightboxFx = new Fx.Morph(this.lightbox,{duration:this.options.animSpeed,onComplete:function(){
			this.lightbox.setStyles({visibility:'hidden'});
			if (typeof cb === 'function') cb();
		}.bind(this)});
		if (!this.IE) lightboxFx.start({opacity:0});
		else {
			this.lightbox.setStyles({visibility:'hidden'});
			if (typeof cb === 'function') cb();
		}
	},
	hideFader:function(){
		var overlayFx = new Fx.Morph(this.overlay,{duration:this.options.animSpeed,onComplete:function(){
			this.overlay.setStyles({display:'none'});
		}.bind(this)});
		overlayFx.start({opacity:0});
	},
	setPosition:function(openFlag){
		var windowW = $(window).getSize().x;
		var popupW = this.lightbox.getSize().x;
		var wrapperW = this.wrapper.getSize().x;
		
		if (windowW < wrapperW) {
			this.lightbox.setStyles({left:wrapperW/2-popupW/2})
			this.overlay.setStyles({width:wrapperW});
		} else {
			this.lightbox.setStyles({left:windowW/2-popupW/2});
			this.overlay.setStyles({width:windowW})
		}
		//y offset
		var docH;
		var windowH = $(window).getSize().y;
		var wrapperH = this.wrapper.getSize().y;
		if (windowH < wrapperH) docH = wrapperH
		else docH = windowH;
		
		if (openFlag) {
			var popupH = this.lightbox.getSize().y;
			var scroll = $(window).getScroll().y
			if (popupH < windowH) this.lightbox.setStyles({top:windowH/2-popupH/2+scroll});
			else if (scroll+popupH > docH){
				this.lightbox.setStyles({top:docH-popupH});
			} else {
				this.lightbox.setStyles({top:scroll});
			}
		}
		this.overlay.setStyles({height:docH});
	},
	Implements:[Options, Events]
});