var onTheSet = new Class({

	// ====== Image Assets ======
	// Videos Images
	videosOnImg: new Asset.image('/dach/on_the_set/images/videos_out.png', {
		id: 'videosOnImg'
	}),

	videosOverImg: new Asset.image('/dach/on_the_set/images/videos_over.png', {
		id: 'videosOverImg'
	}),

	// ====== Photos Images ======
	photosOnImg: new Asset.image('/dach/on_the_set/images/photos_out.png', {
		id: 'photosOnImg'
	}),

	photosOverImg: new Asset.image('/dach/on_the_set/images/photos_over.png', {
		id: 'photosOverImg'
	}),

	// ====== Initial\Constructor Method ======
	init: function()
	{
		// Videos Over
		$E('div#videos h3.link img').addEvent('mouseenter', function(event)
		{
			event.stopPropagation();
            if($E('div.info', 'photos').getStyle('visibility') == 'visible' ){
                $E('div.info', 'photos').setStyle('visibility', 'hidden');
                $E('h3.link img', 'photos').setStyle('background-color', 'transparent');
			    $E('h3.link a', 'photos').setStyle('background-color', 'transparent');
                new ImageSwap($E('h3.link img', 'photos'), this.photosOnImg.src);
            }
			$E('div.info', 'videos').setStyle('visibility', 'visible');
			$E('h3.link img', 'videos').setStyle('background-color', '#FFF');
			$E('h3.link a', 'videos').setStyle('background-color', '#FFF');
			// $E('h3.link img', 'videos').setAttribute('src', this.videosOverImg.src);
			new ImageSwap($E('h3.link img', 'videos'), this.videosOverImg.src);
		}.bind(this));

		// Videos Out
		$E('div#videos').addEvent('mouseleave', function(event)
		{
			event.stopPropagation();
			if (window.ie)
			{
				if (event.client.x > $('videos').getLeft() && event.client.x < $('videos').getLeft() + $('videos').getSize().size.x)
				{
					if (event.client.y > $('videos').getTop() && event.client.y < $('videos').getTop() + $('videos').getSize().size.y)
					{
						//alert("Client: " + event.client.x + " x " + event.client.y + "\n" + "Block: " + $('videos').getLeft() + " x " + $('videos').getTop());
						return;
					}
				}

			}

			$E('div.info', 'videos').setStyle('visibility', 'hidden');
			$E('h3.link img', 'videos').setStyle('background-color', 'transparent');
			$E('h3.link a', 'videos').setStyle('background-color', 'transparent');
			// $E('h3.link img', 'videos').setAttribute('src', this.videosOnImg.src);
			new ImageSwap($E('h3.link img', 'videos'), this.videosOnImg.src);
		}.bind(this));

		// Photos Over
		$E('div#photos h3.link img').addEvent('mouseenter', function(event)
		{
			event.stopPropagation();
            if($E('div.info', 'videos').getStyle('visibility') == 'visible' ){
                $E('div.info', 'videos').setStyle('visibility', 'hidden');
                $E('h3.link img', 'videos').setStyle('background-color', 'transparent');
			    $E('h3.link a', 'videos').setStyle('background-color', 'transparent');
                new ImageSwap($E('h3.link img', 'videos'), this.videosOnImg.src);
            }

			$E('div.info', 'photos').setStyle('visibility', 'visible');
			$E('h3.link img', 'photos').setStyle('background-color', '#FFF');
			$E('h3.link a', 'photos').setStyle('background-color', '#FFF');
			// $E('h3.link img', 'photos').setAttribute('src', this.photosOverImg.src);
			new ImageSwap($E('h3.link img', 'photos'), this.photosOverImg.src);
		}.bind(this));

		// Photos Out
		$E('div#photos').addEvent('mouseleave', function(event)
		{
			event.stopPropagation();
			if (window.ie)
			{
				if (event.client.x > $E('h3.link img', 'photos').getLeft() && event.client.x < $E('h3.link img', 'photos').getLeft() + $E('h3.link img', 'photos').getSize().size.x)
				{
					if (event.client.y > $('photos').getTop() && event.client.y < $('photos').getTop() + $('photos').getSize().size.y)
					{
						//alert("Client: " + event.client.x + " x " + event.client.y + "\n" + "Block: " + $('videos').getLeft() + " x " + $('videos').getTop());
						return;
					}
				}

			}
            
			$E('div.info', 'photos').setStyle('visibility', 'hidden');
			$E('h3.link img', 'photos').setStyle('background-color', 'transparent');
			$E('h3.link a', 'photos').setStyle('background-color', 'transparent');
			// $E('h3.link img', 'photos').setAttribute('src', this.photosOnImg.src);
			new ImageSwap($E('h3.link img', 'photos'), this.photosOnImg.src);
		}.bind(this));

	},

	// ====== Create RollOver/Out Events for Image Replace ======
	addRollOver: function(target, onImage, overImage)
	{
		// MouseOver - Replace Image with 'over' Image
		target.addEvent('mouseover',
			function(event)
			{
				this.setAttribute('src', overImage);
			}
		);

		// MouseOut - Replace Image with Initial 'on' Image
		target.addEvent('mouseout',
			function(ever)
			{
				this.setAttribute('src', onImage);
			}
		);
	}

});

var ots = new onTheSet();

window.addEvent('domready',
	function()
	{
		ots.init();
	}
);