///2 dimensional homebrew Cosine function
///raises minimum to 0.3 and scales back to 1 max
function getRaisedCosineScalarFrom2d(x, y, Nx, Ny)  {

	var x = (Math.cos(((Math.PI * x) / (Nx - 1)) - (Math.PI / 2)) + 0.6) / 1.6;
	var y = (Math.cos(((Math.PI * y) / (Ny - 1)) - (Math.PI / 2)) + 0.6) / 1.6;
	return (x + y) / 2;
}

var tiles = $$("div.content_item");

var tile_states = [];
var animating_tiles = [];

for (var x = 0; x < tiles.length; x++) {

	var tile = tiles[x];

	tile_states[tile] = 0;

	tile.setOpacity(0);
	tile.style.visibility = "visible";

	///continue inside a closure so we maintain the correct tile reference
	(function(tile) {

		setTimeout(function() {

			new Animator()
				.addSubject(new NumericalStyleSubject(tile, 'opacity', 0, 1))
				.play();

		}, x * 50);

		tile.observe('mouseover', mover = function(event) {

			if (tile_states[tile] == 1) return;
			tile_states[tile] = 1;

			if (!tile.mouseAnimation)
				tile.mouseAnimation = new Animator()
				.addSubject(new ColorStyleSubject(tile, 'background-color', '#eee', "#ccc"))

			tile.mouseAnimation.play();

			tile.animation = setTimeout(function() {

				var cn = tile.cloneNode(true);

				var lorium = $("lorium").cloneNode(true);
				lorium.style.display = "block";

				cn.appendChild(lorium);

				cn.stopObserving('mouseover', mover);
				cn.stopObserving('mouseout', mout);

				tile.parentNode.appendChild(cn);
				cn.setOpacity(0);
				cn.absolutize();
				cn.className += " content_item_enlarged";

				tile.cn = cn;

				var params = {
					duration: 1000,
					transition: Animator.makeElastic(3),
					onComplete: function(e) {
						cn.observe('mouseout', function(event) {

							/// ensure we have actually moused OUT and not further IN, gotta love DOM events...
							if (IsDescendant(cn, event.relatedTarget)) return;

							setTimeout(function() {

								var params = { onComplete: function() {
									cn.style.display = "none";
									cn.parentNode.removeChild(cn);
								}
								};

								new Animator(params)
								.addSubject(new NumericalStyleSubject(cn, 'opacity', parseFloat(cn.style.opacity), 0))
								.play();

							}, 50);
						});



					}
				};

				animating_tiles[tile] = new Animator(params)
					.addSubject(new NumericalStyleSubject(cn, 'left', tile.offsetLeft, 33))
					.addSubject(new NumericalStyleSubject(cn, 'top', tile.offsetTop, 164))
					.addSubject(new NumericalStyleSubject(cn, 'width', 100, 785))
					.addSubject(new NumericalStyleSubject(cn, 'height', 100, 575))
					.addSubject(new NumericalStyleSubject(cn, 'opacity', 0, 0.95))
					.addSubject(new ColorStyleSubject(cn, 'background-color', '#ccc', "#eee"))
					.play();

			}, 500);

		});

		tile.observe('mouseout', mout = function(event) {

			/// they might be mousing a descendant i.e. not actually leaving the tile!
			if (IsDescendant(tile, event.relatedTarget)) return;

			clearTimeout(tile.animation);

			tile_states[tile] = 0;

			tile.mouseAnimation.reverse();
		});

	})(tile);

}

function IsDescendant(of, what) {

	var el = what;

	while (el.parentNode != null ) {
		if (el == of) return true;
		el = el.parentNode;
	}
	
	return false;
}