var clinicalCaseObject = Class.create();
clinicalCaseObject.prototype = {

	id: null,
	state: null,
	HTMLul: null,
	images: null,
	lang: null,
	text: null,

	initialize: function(id) {
		this.id = id;
		this.state = 0;
		this.HTMLul = $(id);
		
		if(this.HTMLul.hasClassName('de')) {
			this.lang = 'de';
		} else if (this.HTMLul.hasClassName('it')) {
			this.lang = 'it';
		} else {
			this.lang = 'en';
		}
		
		this.text = new Object();
		this.text["de"] = new Array();
		this.text["de"][0] = "Vorher";
		this.text["de"][1] = "Nachher";
		this.text["en"] = new Array();
		this.text["en"][0] = "Before";
		this.text["en"][1] = "After";
		this.text["it"] = new Array();
		this.text["it"][0] = "Prima";
		this.text["it"][1] = "Dopo";

		this.buildNav();
		this.setupImages();
	},
	
	buildNav: function() {
		var before = 
		this.HTMLul.insert({
			after: '<a id="clincalCaseBefore_'+this.id+'" class="clinicalCaseBefore active"><img src="'+window.urlBase+'img/arrow.png" alt=">" />'+this.text[this.lang][0]+'</a><a id="clincalCaseAfter_'+this.id+'" class="clinicalCaseAfter"><img src="'+window.urlBase+'img/arrow.png" alt=">" style="visibility: hidden;" />'+this.text[this.lang][1]+'</a>'
		});
		$('clincalCaseAfter_'+this.id).observe("mouseover", this.change.bind(this));
	},
	
	change: function() {
		var before = $('clincalCaseBefore_'+this.id);
		var after = $('clincalCaseAfter_'+this.id);
		
		if(this.state == 1) {
			before.stopObserving();
			after.observe("mouseover", this.change.bind(this));
			
			before.addClassName('active');
			before.down().setStyle({ visibility: 'visible' });			
			after.removeClassName('active');
			after.down().setStyle({ visibility: 'hidden' });

		
			this.secondImage.show();
			this.state = 0;
			
		} else {
			after.stopObserving();
			before.observe("mouseover", this.change.bind(this));
			
			after.addClassName('active');
			after.down().setStyle({ visibility: 'visible' });
			before.removeClassName('active');
			before.down().setStyle({ visibility: 'hidden' });

			this.secondImage.hide();
			this.state = 1;
		}

	},
	
	setupImages: function() {
		this.secondImage = this.HTMLul.childElements()[1].down();
	}
	
}