var SolutionBoxes={
	Init:function () {
		this.AssignEvents($("solutionBox1"));
		this.AssignEvents($("solutionBox2"));
		this.AssignEvents($("solutionBox3"),true);

		this.MoveBoxesUp([$("solutionBox1"),$("solutionBox2"),$("solutionBox3")]);
	},

	cancelEffects:function (effects) {
		effects.each(function (effect) { effect.cancel(); });
		effects.length=0;
	},

	MoveBoxesUp:function (boxes) {
		boxes.each(function (box,i) {
			new Effect.Move(box,{ y:-box.offsetHeight,delay:i*.1+.05,duration:.6 });
		});
	},

	AssignEvents:function (solutionBox,lastBox) {
		var normal=solutionBox.getElementsByClassName("normal")[0],
			active=solutionBox.getElementsByClassName("active")[0],
			textActive=active.getElementsByClassName("content")[0];

		solutionBox.originalWidth=parseFloat(solutionBox.getStyle('width') || '0');
		solutionBox.originalHeight=parseFloat(solutionBox.getStyle('height') || '0');

		var id=solutionBox.id;

		textActive.setOpacity(0);

		solutionBox.observe("mouseover",function (e) {
			var src=Event.element(e),
				related=Event.relatedElement(e,false);
			if (solutionBox.contains(related)) return;

			var queueOver=Effect.Queues.get(id+"_over"),
				queueOut=Effect.Queues.get(id+"_out");

			if (queueOut.effects.length) SolutionBoxes.cancelEffects(queueOut.effects);

			//textActive.style.left="10px";

			new Effect.Fade(normal,{ duration:0.25,queue:{ position:"end",scope:id+"_over" } });
			new Effect.Appear(active,{ duration:0.15,queue:{ position:"with-last",scope:id+"_over" } });
			new Effect.OpenSolutionBox(solutionBox,{
				lastBox:lastBox,
				duration:0.7,width:solutionBox.originalWidth+72,height:solutionBox.originalHeight+172,
				queue:{ position:"end",scope:id+"_over" }
			});
			new Effect.Parallel(
				[
					//new Effect.Move(textActive,{ x:-10,sync:true }),
					new Effect.Appear(textActive,{ sync:true } )
				],
				{ duration:0.45,queue:{ position:"end",scope:id+"_over" } }
			);
		});
		solutionBox.observe("mouseout",function (e) {
			var src=Event.element(e),
				related=Event.relatedElement(e,true);
			if (solutionBox.contains(related)) return;

			var queueOver=Effect.Queues.get(id+"_over"),
				queueOut=Effect.Queues.get(id+"_out");

			if (queueOver.effects.length) SolutionBoxes.cancelEffects(queueOver.effects);

			new Effect.Parallel(
				[
					new Effect.OpenSolutionBox(solutionBox,{
						lastBox:lastBox,
						width:solutionBox.originalWidth,height:solutionBox.originalHeight,sync:true
					}),
					new Effect.Fade(textActive,{ sync:true } )
				],
				{ duration:0.45,queue:{ position:"end",scope:id+"_out" } }
			);

			new Effect.Fade(active,{ duration:0.20,queue:{ position:"end",scope:id+"_out" } });
			new Effect.Appear(normal,{ duration:0.20,queue:{ position:"with-last",scope:id+"_out" } });
		});
	}
};

Event.observe(window,"load",function () { SolutionBoxes.Init(); });

Effect.OpenSolutionBox = Class.create();
Object.extend(Object.extend(Effect.OpenSolutionBox.prototype, Effect.Base.prototype), {
  initialize: function(element) {
    this.element = $(element);
    if(!this.element) throw(Effect._elementDoesNotExistError);
    var options = Object.extend({
      x:    0,
      y:    0
    }, arguments[1] || {});
    this.start(options);
  },
  setup: function() {
	this.originalWidth = parseFloat(this.element.getStyle('width') || '0');
	this.originalHeight  = parseFloat(this.element.getStyle('height')  || '0');
	this.originalTop  = parseFloat(this.element.getStyle('top')  || '0');

	this.originalBoxesLeft=parseFloat($("solution-boxes").getStyle('left')  || '0');

	this.options.width = this.options.width - this.originalWidth;
	this.options.height = this.options.height - this.originalHeight;
  },
  update: function(position) {
	  var h=Math.round(this.options.height  * position + this.originalHeight),
		w=Math.round(this.options.width  * position + this.originalWidth);
    this.element.setStyle({
      width: Math.round(this.options.width  * position + this.originalWidth) + 'px',
      height:  h + 'px',
      top: (this.originalTop-(h-this.originalHeight))+'px'
    });

	if (this.options.lastBox) $("solution-boxes").setStyle({left:(this.originalBoxesLeft-(w-this.originalWidth))+"px"});
  }
});


Object.extend(Event,{
	relatedElement:function (e,out) {
		return e.relatedTarget || (out ? e.toElement : e.fromElement);
	},
	findElementByCreteria:function(event,creteria) {
		var element=Event.element(event);
		while (element.parentNode && !creteria(element)) element=element.parentNode;
		return element;
	}
});

Element.Methods.contains=function (el,child) {
	return child==el || (child && Element.Methods.contains(el,child.parentNode));
};

Element.addMethods();

Effect.Transitions.cubic=function (pos) { pos/=0.5; return pos<1 ? 0.5*pos*pos*pos : 0.5*((pos-2)*(pos-2)*(pos-2)+2); };

try { document.execCommand("BackgroundImageCache",false,true); } catch (ex) {}