"use strict";

Tauri.ScreenShots = Class.create({
	
	screens : null,
	current : null,
	busy    : true,
	
	initialize : function (current, screens) {
		this.screens = $A(screens);
		this.current = current;
		var t = this;
		this.screens.each(function (item) {
			var name = item[0], uri = item[1];
			$('link-' + name).observe('click', function (event) {
				Event.stop(event);
				t.changeImage(name, uri);
				return false;
			});
		});
		this.busy = false;
	},
	
	changeImage : function (name, uri) {
		if (this.busy || this.current === name) {
			return false;
		}
		var img;
		this.busy = true;
		if (this.current && (img = $('image-' + this.current))) {
			(new Effect.Fade(img, {afterFinish: this.loadImage.bind(this, name, uri)}));
		} else {
			this.laadImage(name, uri);
		}
	}, 
	
	loadImage : function (name, uri) {
		var img;
		$('desc-' + this.current).hide();
		this.current = name;
		$('desc-' + this.current).show();
		if ((img = $('image-' + name))) {
			this.showImage();
		} else {
			img = (new Element('img', {src: uri, id: 'image-' + this.current})).observe('load', this.showImage.bind(this)).setOpacity(0);
			$('image-display').insert(img);
		}
	},
	
	showImage : function () {
		var t = this;
		(new Effect.Appear('image-' + this.current, {
			afterFinish : function () {
				t.busy = false;
			}
		}));
	}
	
});