var LightShow = {
	_all: [],
	_active: [],
	_actual: 0,
	_full: false,
	_sizes: null,
	_config: {},
	init: function(c) {

		if (!I('fx_lightshow')) {

			// Trovo e inizializzo i link di lightshow
			var j = 0, iw = (c || (c = {})).initWidth || 160, ih = c.initHeight || 160, sp = c.padding || 10,
			dp = sp * 2, p = Env.viewCenter(iw + dp, ih + dp);

			// MI salvo la configurazione
			LightShow._config = c || {};

			// Aggiungo l'evento per mostrare l'immagine per ogni link
			T('a').each(function(o){
				var h = o.getAttribute('href'), r = o.getAttribute('rel');
				if (h && r && r.match(/^lightshow/)) {
					Event.add(o, 'onclick', function(e){
						LightShow.show(this);
						return Event.stop(e);
					});
					LightShow._all[j++] = [h, o.getAttribute('title'), r];
				}
			});

			// Creo gli elementi per il lightshow
			D(['div', {
				id: 'fx_lightshow',
				style: {
					display: 'none',
					position: 'absolute',
					left: p[0] + 'px',
					top: p[1] + 'px',
					zIndex: '26',
					padding: sp + 'px'
				}
			}, ['div', {
				id: 'fx_lightshow_content',
				style: {
					position: 'relative'
				}
			}, ['div', {
				id: 'fx_lightshow_image',
				style: {
					width: iw + 'px',
					height: ih + 'px'
				}
			}], ['div', {
				id: 'fx_lightshow_loading',
				style: {
					width: iw + 'px',
					height: ih + 'px',
					position: 'absolute',
					top: '0px',
					left: '0px',
					zIndex: '28'
				}
			}], ['div', {
				id: 'fx_lightshow_title',
				style: {
					width: iw + 'px',
					left: (-sp) + 'px',
					top: ih + 'px',
					zIndex: '27',
					padding: sp + 'px',
					opacity: 0
				}
			}, ' ']], ['div', {
				id: 'fx_lightshow_close',
				onmouseover: function(){
					this.morph({
						styles: {
							opacity: [ACTUAL, 1]
						},
						time: 0.3
					});
				},
				onmouseout: function(){
					this.morph({
						styles: {
							opacity: [ACTUAL, 'original']
						},
						time: 0.3
					});
				},
				onclick: function(){
					ViewPort.close();
				},
				style: {
					opacity: 0.5
				}
			}, ['span', 'Close']], ['div', {
				id: 'fx_lightshow_prev',
				onmouseover: function(){
					this.morph({
						styles: {
							opacity: [ACTUAL, 1]
						},
						time: 0.3
					});
				},
				onmouseout: function(){
					this.morph({
						styles: {
							opacity: [ACTUAL, 'original']
						},
						time: 0.3
					});
				},
				onclick: function() {
					LightShow.changeImage(LightShow._actual - 1);
				},
				style: {
					opacity: 0.5,
					display: 'none'
				}
			}, ['span', 'Prev']], ['div', {
				id: 'fx_lightshow_next',
				onmouseover: function(){
					this.morph({
						styles: {
							opacity: [ACTUAL, 1]
						},
						time: 0.3
					});
				},
				onmouseout: function(){
					this.morph({
						styles: {
							opacity: [ACTUAL, 'original']
						},
						time: 0.3
					});
				},
				onclick: function() {
					LightShow.changeImage(LightShow._actual + 1);
				},
				style: {
					opacity: 0.5,
					display: 'none'
				}
			}, ['span', 'Next']], ['div', {
				id: 'fx_lightshow_full',
				onmouseover: function(){
					this.morph({
						styles: {
							opacity: [ACTUAL, 1]
						},
						time: 0.3
					});
				},
				onmouseout: function(){
					this.morph({
						styles: {
							opacity: [ACTUAL, 'original']
						},
						time: 0.3
					});
				},
				onclick: function(){
					LightShow.switchSize();
				},
				style: {
					opacity: 0.5,
					display: 'none'
				}
			}, ['span', 'Full']]], T('body')[0]);

			// Inizializzo il Viewport
			ViewPort.init();

			// Aggiungo la funzione per chiudere il Lightshow alla chiusura del Viewport
			ViewPort.addCloseEvent(function(){
				LightShow.hide();
			});

			// Eventi da tastiera
			Event.add(document, 'keydown', function(e){
				if (I('fx_lightshow').style.display == 'block') {
					var k = Event.getKey(e), l = k.key.toLowerCase(),
					c = Event.checkKey(k), i = LightShow._actual,
					a = LightShow._active, s = LightShow._sizes, n;

					if (c == 'Escape')
						ViewPort.close();
					else if (l == 'z' || l == 'p' || c == 'CursorLeft') {
						i--;
						LightShow.changeImage(i);
					}
					else if (l == 'x' || l == 'n' || c == 'CursorRight') {
						i++;
						LightShow.changeImage(i);
					}
					else if ((l == 'c' || l == 'f' || c == 'CursorUp' || c == 'CursorDown') && s)
						LightShow.switchSize();

					return Event.stop(e);
				}
			});
		}
	},
	show: function(o) {
		var r = o.getAttribute('rel'), h = o.getAttribute('href'), t = o.getAttribute('title'),
		n = 0, c = [], j = 0;
		if(r == 'lightshow')
			c[j] = [h, t];
		else
			LightShow._all.each(function(e){
				// Se il rel è uguale a quello attuale, aggiungo i dati dell'immagine
				if (e[2] == r) {
					c[j] = e;
					// Se l'href è uguale a quello attuale mi salvo la posizione dell'immagine attuale
					if (e[0] == h)
						n = j;
					j++;
				}
			});
		LightShow._active = c;

		// Resetto il Lightshow
		LightShow.reset();

		// Mostro il Lightshow
		I('fx_lightshow').show();

		// Imposto l'immagine trovata
		LightShow.changeImage(n);

		/*I('fx_lightshow').morph({
			styles: {
				opacity: [0, 1],
				display: ['block']
			},
			time: 0.5,
			onfinish: function() {
				LightShow.changeImage(n);
			}
		})*/



		// Apro il Viewport
		ViewPort.open();
	},
	hide: function() {
		// Nascondo il Lightshow
		I('fx_lightshow').hide();
	},
	reset: function() {
		var	bs = I('fx_lightshow').style,
			is = I('fx_lightshow_image').style,
			ls = I('fx_lightshow_loading').style,
			ts = I('fx_lightshow_title').style,
			ps = I('fx_lightshow_prev').style,
			ns = I('fx_lightshow_next').style,
			zs = I('fx_lightshow_full').style,
			c = LightShow._config, iw = c.initWidth || 160, ih = c.initHeight || 160, dp = (c.padding || 10) * 2,
			p = Env.viewCenter(iw + dp, ih + dp), w = 'width', h = 'height', d = 'display';

			// Imposto la posizione dell'elemento contenitore a quella di partenza
			bs['left'] = p[0] + 'px';
			bs['top'] = p[1] + 'px';

			// Imposto le dimensioni di tutti gli elementi a quella di partenza
			bs[w] = is[w] = ls[w] = ts[w] = iw + 'px';
			bs[h] = is[h] = ls[h] = ts['top'] = ih + 'px';

			// Nascondo gli elementi dell'immagine
			is[d] = ps[d] = ns[d] = zs[d] = 'none';

			// Mostro il loading
			ls['display'] = 'block';
	},
	changeImage: function(i) {
		var l = LightShow._active, a = l[i];

		if (a) {
			// Salvo la posizione attuale
			LightShow._actual = i;

			var h = a[0], t = a[1];

			// Nascondo l'immagine e il titolo attuale con un effetto di fading
			I('fx_lightshow_image').morph({
				styles: {
					opacity: [ACTUAL, 0]
				},
				time: 0.3,
				onchange: function(s){
					var o = s.opacity;
					if(o)
						I('fx_lightshow_title').setOpacity(o);
				},
				onfinish: function(){
					I('fx_lightshow_loading').show();
					Load.image({
						url: h,
						onload: function(){
							LightShow.showImage(this, t);
						}
					});
				},
				stop: true
			});

			var pl = LightShow._config.preload || true, p = l[i - 1], n = l[i + 1],
			po = I('fx_lightshow_prev'), no = I('fx_lightshow_next');

			// Se esiste un'immagine precedente, mostro il bottone PREV e ne faccio il preload
			if (p) {
				po.show();
				if(pl)
					Load.image({
						url: p[0]
					});
			}
			else
				po.hide();

			// Faccio lo stesso per l'immagine sucessiva
			if (n) {
				no.show();
				if(pl)
					Load.image({
						url: n[0]
					});
			}
			else
				no.hide();

			// Nascono il bottone FULL
			I('fx_lightshow_full').hide();
		}
	},
	showImage: function(i, it) {
		var c = LightShow._config,
			mp = c.padding || 10, dp = mp * 2,
			mm = c.margin || 50, dm = mm * 2,
			w = i.width, h = i.height, ow = w, oh = h,
			cs = Env.viewSize(),
			jw = cs[0] - dp - dm,
			jh = cs[1] - dp - dm,
			is = i.style;

		// Controllo la larghezza e l'altezza dell'immagine rispetto alla larghezza della visuale (meno padding e margin)
		if(w > jw) {
			h = (jw * h) / w;
			w = jw;
			if(h > jh) {
				w = (jh * w) / h;
				h = jh;
			}
		} else if(h > jh) {
			w = (jh * w) / h;
			h = jh;
			if(w > jw) {
				h = (jw * h) / w;
				w = jw;
			}
		}

		// Salvo le dimensioni dell'imamgine attuale
		LightShow._sizes = [ow, oh, w, h];

		// A seconda che l'immagine sia stata ridimensionata o meno mostro o nascondo il bottone FULL
		I('fx_lightshow_full')[((w != ow || h != oh) ? 'show' : 'hide')]();

		// Imposto le nuove dimensioni all'imamgine
		is.width = w + 'px';
		is.height = h + 'px';

		// Controllo le coordinate finali del box con un minimo di 0x0
		var p = Env.viewCenter((w + dp), (h + dp)), l = p[0], t = p[1];
		if(l < 0)
			l = 0;
		if(t < 0)
			t = 0;

		// Pulisco il titolo
		it = (it || '').trim();

		// Inserisco la nuova immagine e la mostro, il nuovo titolo e lo mostro o no, nascondo il loading
		// e ottengo gli oggetti degli stili dei tre
		var ls = I('fx_lightshow_loading').hide().style,
			is = I('fx_lightshow_image').replaceChilds(i).show().style,
			ts = I('fx_lightshow_title').replaceChilds(it)[(it ? 'show' : 'hide')]().style;

		// Animazione
		I('fx_lightshow').morph({
			styles: {
				width: ['px', ACTUAL, w],
				height: ['px', ACTUAL, h],
				left: ['px', ACTUAL, l],
				top: ['px', ACTUAL, t]
			},
			time: 0.3,
			onchange: function(s) {
				var fw = s.width, fh = s.height;
				if(fw)
					ls.width = is.width = ts.width = fw;
				if(fh)
					ls.height = is.height = ts.top = fh;
			},
			onfinish: function() {
				ViewPort.setSizes();
				I('fx_lightshow_image').morph({
					styles: {
						opacity: [0, 1]
					},
					time: 0.3,
					onchange: function(s){
						I('fx_lightshow_title').setOpacity(s.opacity);
					}
				});
			},
			stop: true
		});
	},
	switchSize: function(){
		var f = LightShow._full, s = LightShow._sizes,
		w = (f) ? s[2] : s[0],
		h = (f) ? s[3] : s[1];

		LightShow._full = !f;

		// Controllo la pozizione finale del box
		var c = LightShow._config, dp = (c.padding || 10) * 2,
		p = Env.viewCenter((w + dp), (h + dp)), l = p[0], t = p[1];
		if (l < 0)
			l = 0;
		if (t < 0)
			t = 0;

		var ls = I('fx_lightshow_loading').style,
			is = I('fx_lightshow_image').style,
			ts = I('fx_lightshow_title').style,
			im = (T('img', 'fx_lightshow_image')[0] || {style:{}}).style;

		// Animazione
		I('fx_lightshow').morph({
			styles: {
				width: ['px', ACTUAL, w],
				height: ['px', ACTUAL, h],
				left: ['px', ACTUAL, l],
				top: ['px', ACTUAL, t]
			},
			time: 0.3,
			onchange: function(s){
				var fw = s.width, fh = s.height;
				if (fw)
					ls.width = is.width = ts.width = im.width = fw;
				if (fh)
					ls.height = is.height = ts.top = im.height = fh;
			},
			onfinish: function(){
				ViewPort.setSizes();
			}
		});
	}
};