// JavaScript Document
/*
Nome Plug-in: Sfondo.jQuery

Data creazione: 1 febbraio 2011
By: Mauro Langiu
Versione: 0.1;

Descrizione: Il plugin consente di impostare un'immagine di sfondo nella pagina HTML in cui viene inizializzato;

L'immagine viene adattata automaticamente alle dimensioni della finestra in cui si trova ed allineata verticalmente secondo il valore dell'opzione "v_align" impostato su 'middle' di default = 'centrato verticalmente';

Uso: Includere i files di jQuery ed il presente (plugin) nella pagina HTML;
Inserire un'immagine nella pagina ed inizializzare il controllo selezionando l'immagine con il "selettore CSS", il resto viene impostato da codice;

L'immagine viene avvolta in un div con lo stile impostato nel modo seguente:
	- position : fixed;
	- top : 0;
	- left : 0;
	- z-index : -2;
*/

(function($){
	
	var rpx = 0;//rapporto tra le dimensioni (width & height)
	
	$.fn.sfondo = function(options){
		
		//cambio il nome all'oggetto (x comodità)
		var $this = this;//this è già un oggetto jQuery
		
		var h_flag = true;//orientamento dell'immagine(orizzontale - default)
		
		//configurazione del plugin
		var config = {v_align : 'middle'}//allineamento verticale
			
		
		if (options) $.extend(config,options);//eventuali opzioni modificate nell'inizializzazione
		
			//rilevo il rapporto tra le dimensioni (width & height) & l'orienatmento dell'immagine
			if ($this.width() >= $this.height()){//immagine orizzontale (più larga che alta)
				rpx = $this.width() / $this.height();
				h_flag = true;//orizzontale
			}else{//verticale
				rpx = $this.height() / $this.width();
				h_flag = false;//verticale
			}//fine if
		
		$.extend({
			eventi : function(){//eventi del controllo
				$(window).resize(function(){//ridimensionamento della finestra
					$.adatta_image()//adatta l'immagine
				})//fine resize
			},//fine eventi
			adatta_image : function(){//adatta l'immagine alla finestra
				var w = $(window).width();//width della finestra
				var h = $(window).height();//height della finestra
				var wi, hi;//width & height dell'immagine
				var left,top;//posizione dell'immagine nella finestra
				
				//se non è già stato calcolato elabora il rapporto tra le dimensioni
				if (rpx == 0) rpx = $this.width() / $this.height();
				
				//se l'immagine è verticale inverte i segni
					if (w >= h){//finestra + larga che alta - orizzontale
						wi = w;
						
						if (h_flag){
							hi = w / rpx ;
						}else{
							hi = w * rpx;
						}//fine if
						
							//se l'altezza dell'immagine è minore della finestra inverte il punto di riferimento
							if (hi <= h){
								hi = h;//prende l'altezza...
								wi = h_flag ? h * rpx : h / rpx;//proporziona la larghezza
							}//fine if
					}else if (w <= h){//finestra + alta che larga - verticale
					//se l'immagine è verticale inverte i segni
						hi = h;
						
						if (!h_flag){
							wi = h / rpx;
						}else{
							wi = h * rpx;
						}//fine if
						
							if (wi <= w){
								wi = w;
								hi = !h_flag ? w * rpx : w / rpx;
							}//fine if
					}//fine if
				
				//assegna i nuovi valori (width & height) all'immagine
				$this.width(wi).height(hi);
				
				//ri-calcola la posizione
				left = (w / 2) - (wi / 2);
					switch (config.v_align){
						case 'middle'://centrato verticalmente
							top = h / 2 - hi / 2;
							break;
						case 'top'://allineato in alto
							top = 0;
							break;
						case 'bottom'://allinato in basso
							top = h - hi;
							break;
					}//fine switch
				
					if (!$.support.cssFloat && !$.support.boxModel){//se il browser è IE 6 o 7
						if (w < wi) {
							wi -= 20;
						}else if (h < hi)	{
							hi -= 20;
						}//fine if
						
						//assegna i nuovi valori (width & height) all'immagine
						$this.width(wi).height(hi);
					}// fine id
					
					//posiziona l'immagine
					$this.css({'margin-left':Math.round(left),'margin-top':Math.round(top)});

			},//fine adatta immagine
			build_ctrl : function(){
			
				//avvolgo l'immagine in un div
				$this.wrap('<div>');
				
				var container = $this.parent();//creo la variabile del contenitore
				
				container.attr('id','sfondo-pagina');//impostao l'id del contenitore
				
				//imposto lo stile del contenitore
				container.css({'position':'absolute',//assoluto
											'top':0,//in alto
											'left':0,//a sinistra
											'z-index':-2//sotto-tutto
											});
			}//fine build control
		});//fine extend
		
		$.build_ctrl();//costruisce il controllo
		$.adatta_image();//adatta l'immagine
		$.eventi();;//richiama gli eventi del controllo
		
	}//fine sfondo
	
})(jQuery);//fine function ricorsiva
