var GalItem = Class.create();
GalItem.prototype = {
	initialize: function(elm) {

		this.w_thumb=70;
		this.h_thumb=70;

		var elm_nr=parseInt(elm.id);
		this.elmImg=$(elm_nr+'_dynGalImg');
		this.elmItem=$(elm_nr+'_dynGalItem');

		this.dim_org={width:parseInt(this.elmImg.style.width), height:parseInt(this.elmImg.style.height)};

		this.dim_thumb=this.thumb(this.w_thumb, this.h_thumb, this.dim_org.width, this.dim_org.height);

		var img_margin=((this.h_thumb-this.dim_thumb.h)/2);
		this.elmImg.setStyle ({
			width:this.dim_thumb.w+'px',
			height:this.dim_thumb.h+'px',
			'margin-top':img_margin+'px'
		});


		this.mover = this.zoomout.bindAsEventListener(this);
		Event.observe(this.elmImg, "mouseover", this.mover);

		this.mout = this.zoomin.bindAsEventListener(this);
		Event.observe(this.elmImg, "mouseout", this.mout);

		this.elmItem.show();
	},

	thumb: function (wMax, hMax, w, h) {
		if (w==0 || h==0) return {w:0, h:0};

		if (w>wMax || h>hMax) {
			if (w>=h) {
				imgRatio=w/h;
				imgThumbW=wMax;
				imgThumbH=imgThumbW/imgRatio;
			} else {
				imgRatio=h/w;
				imgThumbH=hMax;
				imgThumbW=imgThumbH/imgRatio;
			}
		} else {
			imgThumbW=w;
			imgThumbH=h;
		}

		return {w:imgThumbW, h:imgThumbH};
	},




	zoomout: function(e) {
		var pos=Position.cumulativeOffset(this.elmItem)
		var dim={w:this.elmItem.getWidth(), h:this.elmItem.getHeight()};
		var cpos={x:pos[0]+(dim.w/2),y:pos[1]+(dim.h/2)};
		var alt_txt=this.elmImg.alt;

		var dim_new=this.thumb(118, 118, this.dim_org.width, this.dim_org.height)

		this.elmItem.setStyle({
			position:'absolute',
			width:'120px',
			height:'120px',
			top:(cpos.y-(120/2))+'px',
			left:(cpos.x-(120/2))+'px',
			'z-Index':'1000',
			'background-color':'#ffffff'
		});
		var img_margin=((120-dim_new.h)/2);
		this.elmImg.setStyle({
			width:dim_new.w+'px',
			height:dim_new.h+'px',
			'z-Index':'1001',
			'margin-top':img_margin+'px'
		});


		$('dynGalAlt').update(alt_txt);
		$('dynGalAlt').setStyle({
			width:'120px',
			height:'auto',
			top:(cpos.y-(120/2)+120)+'px',
			left:(cpos.x-(120/2))+'px',
			'z-Index':'1000'
		});
		$('dynGalAlt').show();
		Event.stop(e);
		return false;
	},

	zoomin: function(e) {
		var obj = Event.element(e);

		$('dynGalAlt').hide();
		var img_margin=((70-this.dim_thumb.h)/2);

		this.elmItem.setStyle({
			position:'static',
			width:this.w_thumb+'px',
			height:this.h_thumb+'px',
			top:'0px',
			left:'0px',
			'z-Index':'1',
			'background-color':'#D3D4E2'
		});

		var img_margin=((this.h_thumb-this.dim_thumb.h)/2);
		this.elmImg.setStyle({
			width:this.dim_thumb.w+'px',
			height:this.dim_thumb.h+'px',
			'z-Index':'1',
			'margin-top':img_margin+'px'
		});

		Event.stop(e);
		return false;
	}

}




function initGallery() {
	$$('div#dynGal div.itemZ').each(function(obj){
		galItems[galItems.length]= new GalItem(obj)
	});
}

galItems=new Array()
Event.observe(window, 'load', initGallery);