/* ©2011 Didier Berck */

/* MouseEnterLeave.js v1.0.0 by Ken Snyder: http://kendsnyder.com/sandbox/enterleave/ */
(function() {
  var events = Prototype.Browser.IE ? 
    {"bindAsMouseEnter":"fromElement", "bindAsMouseLeave":"toElement"} :
    {"bindAsMouseEnter":"relatedTarget", "bindAsMouseLeave":"relatedTarget"};
  for (var eventName in events) {
    (function(relTargetProperty) {
      Function.prototype[eventName] = function() {
        var __method = this, args = $A(arguments), object = args.shift();
        return function(event) {
          event = event || window.event;
          try { 
            var relatedTarget = $(event[relTargetProperty]);
            if (relatedTarget && relatedTarget != this && !relatedTarget.descendantOf(this)) {
              __method.apply(object, [Event.extend(event)].concat(args));
            }
          } catch(e) {}
        };
      };
    })(events[eventName]);
  }
})();

var Blocks = Class.create({
	initialize: function(elts) {
		this.blocks = arguments;
		this.widths = new Array(298, 148, 598);
		this.heights = new Array(131, 131, 336);
		this.positions = new Array(
			new Array(14, 328, 642), 
			new Array(14, 628, 792), 
			new Array(14, 178, 792), 
			new Array(14, 178, 342)
		);
		this.queue = new Array();
		this.stack = new Array();
		this.currOver = '';
		this.lastOver = '';
		this.dur = 0;
		for(var i=0; i<arguments.length; i++) {
			//Event.observe($(arguments[i]), 'mouseover', this.onRollOver.bind(this));
			//Event.observe($(arguments[i]), 'mouseout', this.onRollOut.bind(this));
			Event.observe($(arguments[i]), 'mouseover', this.onRollOver.bindAsMouseEnter(this, arguments[i]));
			Event.observe($(arguments[i]), 'mouseout', this.onRollOut.bindAsMouseLeave(this, arguments[i]));
		}
	}
});
Blocks.addMethods({
	fade: function(elts) {
		if(typeof elts == 'string') {
			elts = new Array(elts);
		}
		this.dur = (this.dur > 0) ? 0.4 - this.dur : 0.4;
		//this.dur = 0.4;
		var op = 1;
		var fades = new Array();
		for(var i=0; i<elts.length; i++) {
			op = Element.getOpacity(elts[i]);
			fades.push(new Effect.Fade($(elts[i]), { sync: true, from: op }));
		}
		this.parallel(fades, this.dur);
	},
	
	morph: function(idElt) {
		this.dur = (this.dur > 0) ? 0.6 - this.dur : 0.6;
		//this.dur = 0.6;
		var morphs = new Array();
		var k = 0;
		for(var i=0; i<this.blocks.length; i++) {
			if(idElt > 0) {
				if($(this.blocks[i]) == $('b' + idElt)) k = 2;
				else k = 1;
			}
			l = this.positions[idElt][$(this.blocks[i]).readAttribute('id').sub(/b/, '') - 1];
			morphs.push(new Effect.Morph($(this.blocks[i]), { sync: true, style: 'width: ' + this.widths[k] + 'px; height: ' + this.heights[k] + 'px; left: ' + l + 'px' }));
		}
		this.parallel(morphs, this.dur);
	},
	
	appear: function(elts) {
		if(typeof elts == 'string') {
			elts = new Array(elts);
		}
		this.dur = (this.dur > 0) ? 0.4 - this.dur : 0.4;
		//this.dur = 0.4;
		var op = 0;
		var appears = new Array();
		for(var i=0; i<elts.length; i++) {
			op = Element.getOpacity(elts[i]);
			appears.push(new Effect.Appear($(elts[i]), { sync: true, from: op, to: 1 }));
		}
		this.parallel(appears, this.dur);
	},
	
	multiple: function(elts) {
		this.dur = (this.dur > 0) ? 0.4 - this.dur : 0.4;
		//this.dur = 0.4;
		var op = 0;
		var effects = new Array();
		for(var i=0; i<elts.length; i++) {
			if(typeof elts[i]['elts'] == 'string') {
				elts[i]['elts'] = new Array(elts[i]['elts']);
			}
			switch(elts[i]['type']) {
			case 'appear':
				for(var j=0; j<elts[i]['elts'].length; j++) {
					op = Element.getOpacity(elts[i]['elts'][j]);
					effects.push(new Effect.Appear($(elts[i]['elts'][j]), { sync: true, from: op }));
				}
				break;
			case 'fade':
				for(var j=0; j<elts[i]['elts'].length; j++) {
					op = Element.getOpacity(elts[i]['elts'][j]);
					effects.push(new Effect.Fade($(elts[i]['elts'][j]), { sync: true, from: op }));
				}
				break;
			}
			
		}
		this.parallel(effects, this.dur);
	},
	
	parallel: function(effects, dur) {
		new PeriodicalExecuter(this.timeCheck.bind(this), 0.1);
		new Effect.Parallel(effects, { 
			duration: dur,
			queue: { position: 'end', scope: 'q' },
			afterFinish: function(eff) {
				for(var i=0; i<eff.effects.length; i++) {
					if(eff.effects[i].options.to == 0) {
						$(eff.effects[i].element).setOpacity(0);
					}
				}
				this.runEffectsQueue();
				if(this.queue.length == 0) {
					for(var i=0; i<this.blocks.length; i++) {
						if(this.currOver != '' && this.blocks[i] != this.currOver) {
							$(this.blocks[i]).down('div.cnt').setOpacity(0);
						}
					}	
				}
			}.bind(this)
		});
	},
	
	timeCheck: function(pe) {
		this.dur -= 0.1;
		if(this.dur <= 0) {
			this.dur = 0;
			pe.stop();
		}
	},
	
	runEffectsQueue: function() {
		//console.warn('runEffectsQueue');
		//console.info('q:' + this.queue.length + ' s:' + this.stack.length);
		if(this.queue.length > 0) {
			var effect = this.queue.shift();
			switch(effect['type']) {
				case 'fade':
					this.fade(effect['elts']);
					//this.stack.push({'type': 'appear', 'elts': effect['elts']});
				break;
				case 'morph':
					this.morph(effect['idElt']);
					//this.stack.push({'type': 'morph', 'idElt': 0});
				break;
				case 'appear':
					this.appear(effect['elts']);
					//this.stack.push({'type': 'fade', 'elts': effect['elts']});
				break;
				case 'multiple':
					this.multiple(effect['elts']);
					//this.stack.push({'type': 'multiple', 'elts': effect['elts']});
				break;
			}
		}
	},
	
	onRollOver: function(evt, block) {
		//console.warn('onRollOver qL:' + this.queue.length);
		this.clearQueue('q');
		this.stack = new Array();
		this.lastOver = this.currOver;
		this.currOver = block;
		var qL = 0;
		var oL = this.queue.length;
		this.queue = new Array();
		if(oL == 0) {
			var fades = new Array($(block).down('div.left'), $(block).down('div.right'));
			for(var i=0; i<this.blocks.length; i++) {
				if(this.blocks[i] != block) {
					fades.push($(this.blocks[i]).down('div.right'));
				}
			}
		}
		else if((oL == 2 && $(this.lastOver).down('div.cnt').getOpacity() > 0) || (oL == 1 && this.currOver != this.lastOver)) {
			var fades = new Array($(this.lastOver).down('div.cnt'));
			fades.push($(block).down('div.left'));
		}
		if((oL == 0) || (oL == 2 && $(this.lastOver).down('div.cnt').getOpacity() > 0) || (oL == 1 && this.currOver != this.lastOver)) {
			this.queue[qL] = new Array();
			this.queue[qL]['type'] = 'fade';
			this.queue[qL]['elts'] = fades;
			qL++;
			this.queue[qL] = new Array();
			this.queue[qL]['type'] = 'morph';
			this.queue[qL]['idElt'] = block.sub(/b/, '');
			qL++;
		} else {
			if(oL == 1) {
				this.queue[qL] = new Array();
				this.queue[qL]['type'] = 'morph';
				this.queue[qL]['idElt'] = block.sub(/b/, '');
				qL++;
			}

		}
		if(oL != 0) {
			for(var i=0; i<this.blocks.length; i++) {
				$(this.blocks[i]).down('div.right').hide();
			}
		}
		$(block).down('div.cnt').setOpacity(0.01);
		var appears = new Array($(block).down('div.cnt'));
		for(var i=0; i<this.blocks.length; i++) {
			if(this.blocks[i] != block) {
				appears.push($(this.blocks[i]).down('div.left'));
			}
		}
		this.queue[qL] = new Array();
		this.queue[qL]['type'] = 'appear';
		this.queue[qL]['elts'] = appears;
		this.runEffectsQueue();	
	},
	
	onRollOut: function(evt, block) {
		//console.warn('onRollOut qL:' + this.queue.length);
		this.clearQueue('q');
		/*this.queue = this.stack.reverse();
		this.stack = new Array();*/
		var qL = 0;
		var oL = this.queue.length;
		this.queue = new Array();
		if(oL == 0) {
			var fades = new Array($(block).down('div.cnt'));
			this.queue[qL] = new Array();
			this.queue[qL]['type'] = 'fade';
			this.queue[qL]['elts'] = fades;
			qL++;
		}
		if(oL <= 1) {
			this.queue[qL] = new Array();
			this.queue[qL]['type'] = 'morph';
			this.queue[qL]['idElt'] = 0;
			qL++;
		}
		if(oL == 2) {
			if(this.lastOver != '' && $(this.lastOver).down('div.cnt').getOpacity() > 0) {
				this.queue[qL] = new Array();
				this.queue[qL]['type'] = 'multiple';
				this.queue[qL]['elts'] = new Array();
				this.queue[qL]['elts'][0] = new Array();
				this.queue[qL]['type'][0]['type'] = 'appear';
				this.queue[qL]['elts'][0]['elts'] = $(block).down('div.left');
				this.queue[qL]['elts'][1] = new Array();
				this.queue[qL]['type'][1]['type'] = 'fade';
				this.queue[qL]['elts'][1]['elts'] = $(this.lastOver).down('div.cnt');
				this.queue[qL] = new Array();
				this.queue[qL]['type'] = 'morph';
				this.queue[qL]['idElt'] = 0;
				qL++;
				
			}
		
		}
		var appears = new Array();
		for(var i=0; i<this.blocks.length; i++) {
			appears.push($(this.blocks[i]).down('div.left'));
			appears.push($(this.blocks[i]).down('div.right'));
		}
		this.queue[qL] = new Array();
		this.queue[qL]['type'] = 'appear';
		this.queue[qL]['elts'] = appears;
		
		this.runEffectsQueue();
	},
	
	clearQueue: function(queueName) {
		var queue = Effect.Queues.get(queueName);
		queue.each(function(effect) {
			effect.cancel();
		});
	}
});

//Event.observe(window, 'load', function(evt) {
Event.observe(document, 'dom:loaded', function(evt) {
	$$('.cnt').each(function(elt) {
		elt.setOpacity(0);
		elt.hide();
		var t = elt.up('div.block').down('div.left').innerHTML.stripTags().strip();
		if(t.include('Nohėllef-')) {
			t = t.substring(0, 8) + t.substring(9).strip();
		}
		elt.innerHTML = '<h3>' + t + '<\/h3>' + elt.innerHTML;
	});
	var blocks = new Blocks('b1', 'b2', 'b3');
});