function imageBlockExtention(elementId){
	this.rootElement = $(elementId);
	var self = this;
	
	this.elementsList = this.rootElement.select("td[style]");
		this.elementsList.each(function(item, index) {
			item.observe('mouseover', function(){ self.start(this);});
	});
}

imageBlockExtention.prototype = {
	rootElement: null,
	elementsList: null,
	currentElement: null,  
    currentTimer: null,
    pauseTime: 0.5,
    effectDuration: 0.5,
    effectFlag: false,
    currentEffect: null,
    
    start: function(element){
    	this.currentElement = element;
    	if (this.currentTimer){
    		this.cancelTimer();
    	}
    	this.startTimer(this.pauseTime*1000);
    },
    startTimer: function(timeout) {
    	var self = this;
		this.currentTimer = setTimeout(function() { self.resize(); }, timeout);
	},
	cancelTimer: function (){
		if (this.currentTimer) clearTimeout(this.currentTimer);
		this.currentTimer = null;
	},
	beforeExtention: function(){
		imageBlockExtention.prototype.effectFlag = true;
	},
	afterExtention: function(){
		imageBlockExtention.prototype.effectFlag = false;
	},
	extention: function(){
		if (this.currentElement){
			if (this.effectFlag == true){
				this.currentEffect.cancel();
			}
			this.currentEffect = new Effect.Morph(this.currentElement, {style: 'width: 52%', duration: 0.5, beforeStart: this.beforeExtention, afterFinish: this.afterExtention});
			
		}
	},
	contraction: function(){
		var self = this;
		this.elementsList.each(function(item, index) {
			if (item.id != self.currentElement.id){
				new Effect.Morph(item, {style: 'width: 24%', duration: self.effectDuration});
			}					
		});
		this.extention();
	},
	resize: function(){
		this.contraction();
	}
}