/*************************************************************************
*                                                                        *
*             File: image_show.js                                        *
*          version: 1.2.0																								 *
*        Copyright: (C) 2008 Juan Carlos Cambronero Barrientos           *
*            Email: jccambar@gmail.com                                   *
*              Web: http://www.insectariumvirtual.com                    *
*                                                                        *
**************************************************************************
* Subversion (SVN):: Biodiversidad Virtual                               *
*        $Revision:: 24                                                  $
*            $Date:: 2009-03-05 11:25:53 +0100 (jue 05 de mar de 2009)   $
*          $Author:: jccambar                                            $
*************************************************************************/

// This Script requires MooTools

function fadeImage(){
	var myImage = $('image-media');
	if(myImage){
		var myEffect = new Fx.Tween(myImage,{
			property: 'opacity',
			duration: 1000,
			transition: Fx.Transitions.Sine.easeInOut
		}).start(0, 1);
		/*
		var width = myImage.getProperty('width');
		var w = width/8;
		var height = myImage.getProperty('height');
		var h = height/8;
		var y = (height/2)-(h/2);
		
		myImageContainer = $('image-container').setStyles({
			'min-height': height
		});
		
		myImage.setStyles({
			'position': 'relative'
		});
		var myEffect = new Fx.Morph($('image-media'),{
			duration: 1500,
			transition: Fx.Transitions.Sine.easeInOut
		});
		myEffect.start({
			width: [w, width],
			height: [h, height],
			top: [ y, 0],
			opacity: [0, 1]
		});
		*/
	}
}

// Image Protector Class
var imgProtector = new Class({

	//implements
	Implements: [Options],

	//options
	options: {
		image: 'blank.gif',
		elements: 'img',
		zIndex: 10
	},

	//initialization
	initialize: function(options) {
		//set options
		this.setOptions(options);
		this.options.elements = $$(this.options.elements);
		//make it happen
		this.protect();
	},

	//a method that does whatever you want
	protect: function() {
		//for each image that needs be protected...
		this.options.elements.each(function(el) {
			//get the element's position, width, and height
			var size = el.getCoordinates();
			//create the protector
			var p = new Element('img', {
				src: this.options.image,
				width: size.width,
				height: size.height,
				styles: {
					'z-index': this.options.zIndex,
					'left': size.left + 'px',
					'top': size.top + 'px',
					'position': 'absolute'
				}
			}).inject($(document.body),'top');
		},this);

	}
});

// Ejectuar JavaScript en dos fases, dom preparado y fin carga página

window.addEvents({
	'domready': function(){
		// visualizar contenedor de la imagen
		myImageContainer = $('image-container');
		if(myImageContainer){
			myImageContainer = $('image-container').setStyle('visibility', 'visible');
		}
		// protecion descarga imagen
		var protector = new imgProtector({
			image: './templates/default/images/blank.gif',
			elements: $$('img.protected-image')
		});
	},
	'load': function(){
		// fade image
		fadeImage();
	}
});

// EoF