window.addEvent('domready', function(){
var timer;
var szNormal = 160, szSmall  = 50, szFull   = 600;

var myFunction = function() {       document.getElementById('kwick0').style.display = 'none';
                                    document.getElementById('kwick1').style.display = 'none';
                                    document.getElementById('kwick2').style.display = 'none';
                                    document.getElementById('kwick3').style.display = 'none';
                                    document.getElementById('kwick4').style.display = 'block';
                                    document.getElementById('kwick4').fade('hide');
                                    document.getElementById('kwick4').set('tween', {duration: 1000}).fade('in');
                                    
};

var myFunction1 = function() {      document.getElementById('kwick4').style.display = 'none';
                                    document.getElementById('kwick1').style.display = 'none';
                                    document.getElementById('kwick2').style.display = 'none';
                                    document.getElementById('kwick3').style.display = 'none';
                                    document.getElementById('kwick0').style.display = 'block';
                                    document.getElementById('kwick0').fade('hide');
                                    document.getElementById('kwick0').set('tween', {duration: 1000}).fade('in');
                                    
};

var myFunction2 = function() {      document.getElementById('kwick0').style.display = 'none';
                                    document.getElementById('kwick4').style.display = 'none';
                                    document.getElementById('kwick2').style.display = 'none';
                                    document.getElementById('kwick3').style.display = 'none';
                                    document.getElementById('kwick1').style.display = 'block';
                                    document.getElementById('kwick1').fade('hide');
                                    document.getElementById('kwick1').set('tween', {duration: 1000}).fade('in');
                                    
};

var myFunction3 = function() {      document.getElementById('kwick0').style.display = 'none';
                                    document.getElementById('kwick1').style.display = 'none';
                                    document.getElementById('kwick4').style.display = 'none';
                                    document.getElementById('kwick3').style.display = 'none';
                                    document.getElementById('kwick2').style.display = 'block';
                                    document.getElementById('kwick2').fade('hide');
                                    document.getElementById('kwick2').set('tween', {duration: 1000}).fade('in');
                                    
};

var myFunction4 = function() {      document.getElementById('kwick0').style.display = 'none';
                                    document.getElementById('kwick1').style.display = 'none';
                                    document.getElementById('kwick2').style.display = 'none';
                                    document.getElementById('kwick4').style.display = 'none';
                                    document.getElementById('kwick3').style.display = 'block';
                                    document.getElementById('kwick3').fade('hide');
                                    document.getElementById('kwick3').set('tween', {duration: 1000}).fade('in');
                                    
};

var kwicks = $$("#kwicks .kwick");
var fx = new Fx.Elements(kwicks, {wait: false, duration: 300, transition: Fx.Transitions.linear.easeOut});
kwicks.each(function(kwick, i) {
	kwick.addEvent("mouseenter", function(event) {
		var o = {};
                clearTimeout(timer);
                document.getElementById('kwick0').style.display = 'none';
           document.getElementById('kwick1').style.display = 'none';
           document.getElementById('kwick2').style.display = 'none';
           document.getElementById('kwick3').style.display = 'none';
           document.getElementById('kwick4').style.display = 'none';
		o[i] = {width: [kwick.getStyle("width").toInt(), szFull]}
		kwicks.each(function(other, j) {
			if(i != j) {
				var w = other.getStyle("width").toInt();
				
                                if (i==0)
                                {
                                    clearTimeout(timer);
                                    timer = myFunction.delay(300);
                                }
                                else if(i==1)
                                {
                                    clearTimeout(timer);
                                    timer = myFunction1.delay(300);
                                }
                                else if(i==2)
                                {
                                    clearTimeout(timer);
                                    timer = myFunction2.delay(300);
                                }
                                else if(i==3)
                                {
                                    clearTimeout(timer);
                                    timer = myFunction3.delay(300);
                                }
                                else if(i==4)
                                {
                                    clearTimeout(timer);
                                    timer = myFunction4.delay(300);
                                }
                                if(w != szSmall) o[j] = {width: [w, szSmall]};

			}
		});
		fx.start(o);
	});
});

$("kwicks").addEvent("mouseleave", function(event) {
    clearTimeout(timer);
           document.getElementById('kwick0').style.display = 'none';
           document.getElementById('kwick1').style.display = 'none';
           document.getElementById('kwick2').style.display = 'none';
           document.getElementById('kwick3').style.display = 'none';
           document.getElementById('kwick4').style.display = 'none';
	var o = {};
        var fx = new Fx.Elements(kwicks, {wait: false, duration: 300, transition: Fx.Transitions.linear.easeOut});
	kwicks.each(function(kwick, i) {
		o[i] = {width: [kwick.getStyle("width").toInt(), szNormal]
            }
           document.getElementById('kwick0').style.display = 'none';
           document.getElementById('kwick1').style.display = 'none';
           document.getElementById('kwick2').style.display = 'none';
           document.getElementById('kwick3').style.display = 'none';
           document.getElementById('kwick4').style.display = 'none';
	});
	fx.start(o);
})

});