var Planete = new Class({

	options : {
		overlayDelay : 100,
		tipShowDelay : 0,
		tipHideDelay : 100,
		showOverlay : false,
		overlayDelay : 0
	},
	
    initialize: function(){

		this.mimage = {'currentSize' : false};
		
		this.initFields();
		this.initTabs();
		this.initTips();
		this.initCadres();
		this.initImageActions();
		this.initImageToolbox();
		
    },
    
    
    initImageToolbox : function() {
		this.activateOverlay();
    },
    
    activateOverlay : function() {
    	this.options.showOverlay = true;
    },
    
    desactivateOverlay : function() {
    	this.options.showOverlay = false;
    },
    
    
    initImageActions : function () {  	
    	
    	var mthis = this;
				
		if($defined($('photo-image'))) {
						
			/* Actions Localiser Cadre */
			$$('.action-localiser').addEvents({
				'mouseover' : function() {
					var cadreId = this.id;
					mthis.highlightCadre(cadreId);
					//mthis.options.overlayDelay = mthis.highlightCadre.delay(100, mthis, cadreId); 
				},
				
				'mouseout' : function() {
					var cadreId = this.id;
					mthis.lowlightCadre(cadreId);
					//mthis.options.overlayDelay = $clear(mthis.options.overlayDelay);
				}
			});
			
			$('photo-image').addEvents({
				'mouseover' : function() {
					/* faire la meme chose avec Fx & Elements pour pouvoir chainer avec l'effet overlay */
				},
				
				'mouseout' : function() {
				}
			});
			
		}    	
    },
	
	objOnImageLoad : function() {
		//console.log(this);
			this.mimage.currentSize = $('photo-image').getSize();
	},

	initCadres : function () {
    	//console.log('Initializing Cadres');
    	var mthis = this;
    	
    	if($defined($('photo-image'))) {
    		
    		/* il faut avant tout s'assurer que l'image a bien ete chargee sinon rien ne marche */
    		var myImage = new Asset.image($('photo-image').getProperty('src'), {
    			onload: function() {
    				//console.log('complete');
    				//mthis.objOnImageLoad();
    				mthis.mimage.currentSize = $('photo-image').getSize();
    				
    				
					/* Initialisation des cadres */
								
					var imageUrl = $('photo-image').getProperty('src');
					
					$$('.action-localiser').each(function(el) {
						var indi = el.getParent().getParent();
						var cadreId = el.getProperty('id');
						
						
						var cadreEl = $('cadre-'+cadreId);
						
						//if(mthis.options.showOverlay === true) {
						if(1 === 1) {
							cadreEl.setStyle('background-image', 'url("'+imageUrl+'")');
							cadreEl.setStyle('background-repeat', 'no-repeat');
							cadreEl.setStyle('background-position', "3010px 3000px");
						} else {
							cadreEl.setStyle('background-image', 'none');
						}
					});
					
					mthis.initShowOverlay();
    				
				}
			});			
    	}
	},
	
    
    initFields : function () {
		/* Champs par defaut */
		/*new Dfv("contact-auteur-nom", "Nom & Prénom");
		new Dfv("contact-auteur-email", "Adresse Email");
		new Dfv("contact-auteur-message", "Entrez votre message ici");
		new Dfv("search", "Tapez ici le nom d'un individu");*/
	
    },

    initTabs : function () {
    	    	
		/* Panneau Individus : Liste / Grille / Inconnus */
		new Tabs(
			[
				['', 'pan-liste'],
				['', 'pan-grille'],
				['', 'pan-inconnus']
			], 'tabs-inject');
    },
    
    
    initTips : function () {
		/* Tips au survol des individus */
		var myExtentips = new Tips('.tt', {
			'showDelay': this.options.tipShowDelay,
			'hideDelay': this.options.tipHideDelay,
			'className': 'moretip'
		});
    },
	

	highlightCadre : function (cadreId) {
			cadreId = cadreId.replace(/cadre-/, '');
			this.showOverlay();
			
			var imageUrl = $('photo-image').getProperty('src');
			var cadreEl = $('cadre-'+cadreId);
			var cadrePosition = {
				x : (eval(cadreEl.getStyle('left').replace(/px/,'')) + 0),
				y : (eval(cadreEl.getStyle('top').replace(/px/,'')))
			}

			
			cadreEl.setStyle('background-position', "-"+cadrePosition.x+"px -"+cadrePosition.y+'px');
	},
	
	
	lowlightCadre : function (cadreId) {
			cadreId = cadreId.replace(/cadre-/, '');
			this.hideOverlay();
			
			var imageUrl = $('photo-image').getProperty('src');
			var cadreEl = $('cadre-'+cadreId);
			
			cadreEl.setStyle('background-position', "3000px 3000px");
			
	},
	
	initShowOverlay : function() {
			var imageSize = this.mimage.currentSize;
			
			var overlay_w = (imageSize.x - 0);
			var overlay_h = (imageSize.y - 0);

			$('photo-overlay').setStyle('width', overlay_w+"px");
			$('photo-overlay').setStyle('height', overlay_h+"px");
			
			$('photo-overlay').setStyle('opacity', 0);
			this.overlayFx = new Fx.Tween('photo-overlay', {
				duration : this.options.overlayDelay,
				'link': 'chain'
			});
			
	},
	
	showOverlay : function () {
			if(this.options.showOverlay === true) {
				this.overlayFx.cancel();
				this.overlayFx.start('opacity', 0, 0.5);
			}
	},
	
	hideOverlay : function () {
			if(this.options.showOverlay === true) {
				this.overlayFx.start('opacity', 0.5, 0);
			}
			
	}

});

window.addEvent('domready', function() {

	new Planete();

});