﻿/****
GESTION DU ZOOM SUR LES IMAGES
***/
var zoom = {
	//PROP
	transition : false,
	modal :false,
	BlackBoxPosition : 'up',
	duration : 350,
	ratio : 0.35,
	
	//DATA
	jsonImg : null,
	currentId : null,
	
	//TAGZ
	isModal : false,
	inProcess : false,
	sens : null,
	tagGO : false,
	overImage : false,
	current : null,
	tooltip : false,
	
	start :	function(options){
		
		jsonImg = new Array();
		zoom.initOptions(options);
		zoom.initData(zoom.initListener);
		
	},
	
	initOptions : function(options){
		if(options){
			if(options.transition){
				zoom.transition = options.transition;
			}
			if(options.modal){
				zoom.modal = options.modal;
			}
			if(options.tooltipPos){
				zoom.BlackBoxPosition = options.tooltipPos;
			}
			if(options.tooltip){
				zoom.tooltip = options.tooltip;
			}
			if(options.duration){
				zoom.duration = options.duration;
			}
			if(options.ratio){
				zoom.ratio = options.ratio;
			}
		}
	},
	
	initData : function(callback){
		//recuperation des données des images de la page
		$('.zoom img').each(function(){
			id = $(this).attr('id');
			
			if(jsonImg[id] == undefined){
				jsonImg[id] = {};
			}
			
			jsonImg[id].tooltip = $(this).attr('alt');
			jsonImg[id].height = $(this).attr('height');
			jsonImg[id].width = $(this).attr('width');
			jsonImg[id].left = $.getCssPosValue($("#"+id+"Container").css('left'));
			jsonImg[id].top = $.getCssPosValue($("#"+id+"Container").css('top'));
			
			zoom.delAlt(id);
		});
		if(callback){
			callback.call();
		}
	},
	
	initListener : function(){
		$('a[@rel]').bind('click', function(e){
			e.preventDefault();
			window.location = $(this).attr('href');
		});
		
		//rollover
		$('.zoom img').bind('mouseover', function(e){

			//if(!zoom.isModal && !zoom.inProcess){
				//if(!$.browser.msie){
					zoom.showModalScreen(zoom.transition, function(){
						
					});
					zoom.inProcess = true;
					zoom.isModal = true;
					zoom.current = 1;
					zoom.animateZoom(e, 'in');
					if(zoom.tooltip){
						zoom.createBox(e);
					}else {
						zoom.increaseTextSize();
					}
					
				//}
				
				
			//}
		});
		
		//rollout
		$('.zoom img').bind('mouseout', function(e){
			//if(zoom.isModal){
			//if(!$.browser.msie){
				zoom.hideModalScreen(zoom.transition);
			//}
				if(zoom.tooltip){
					$('.tooltip').remove();
				}else{
					zoom.decreaseTextSize();
				}
				zoom.current = null;
				zoom.update();
				zoom.inProcess = true;
				zoom.animateZoom(e,'out');
			//}
		});
		
		
	},
	
	showModalScreen : function(transition, callback) {
		
		if(zoom.modal){
			
			var h = document.documentElement.scrollHeight;
			var w = $.getWindowWidth();
			var l = 0;
			
			$('.blackScreen').css({
				width:	w+"px", 
				height:	h+"px",
				display : "block",
				opacity : 0,
				zindex : 50,
				left : 0
			});

			if(transition){
				$('.blackScreen').animate({
					opacity:0.5
					},
					100,
					function(){
						if(callback) callback.call();
					}
				);
				
			}else{
				$('.blackScreen').css({opacity:0.5});
				if(callback) callback.call();
			}

		}
	},
	
	hideModalScreen : function(transition){
		if(zoom.modal){
			if(transition){
				$('.blackScreen').animate({
					opacity:0
					},
					150,
					function(){
						zoom.MSHide();
					}
				);
			}else{
				zoom.MSHide();
			}
		}
	},
	
	MSHide : function(){
		$('.blackScreen').css({
			width:	0, 
			height:	0,
			display : "none"
		});
	},
	
	animateZoom : function (e, sens, callback) {

		//sens du zoom
		zoom.sens = sens;
		
		var end_height;
		var end_width;
		var end_left;
		var end_top;
		var duration;
		
		var id = e.target.id;
		zoom.currentId = id;
		var image = $("#"+id); 
		var div_parent = $("#"+id+"Container"); 
		 
		if(jsonImg[id] == undefined){
			jsonImg[id] = {};
		}
		
		//calcul des nouvelles positions pour un point d'attache au centre
		if(sens == 'in'){		
			duration = zoom.duration;
			
			end_height = parseInt(jsonImg[id].height * (1.00 + zoom.ratio));
			end_width = parseInt(jsonImg[id].width * (1.00 + zoom.ratio));
			end_left = parseInt(jsonImg[id].left - (jsonImg[id].width * zoom.ratio) / 2 );
			end_top =  parseInt(jsonImg[id].top - (image.attr('height') * zoom.ratio ) / 2 );
			
			div_parent.css('z-index', 160);

			div_parent.addClass('current');
			
		}else if(sens == 'out'){
			duration = zoom.duration-100;
			
			end_height = jsonImg[id].height;
			end_width = jsonImg[id].width;
			end_left = jsonImg[id].left;
			end_top = jsonImg[id].top;
			
			div_parent.removeClass('current');
		}
			
		$(e.target).animate({
				height:end_height,
				width:end_width
			},
			duration
			);
		
		$(div_parent).animate({
			left:end_left,
			top:end_top
			},
			duration,
			function(){
				if(zoom.sens == 'out'){
					zoom.isModal = false;	
					
				}else{
					
				}
				zoom.inProcess = false;
				
				$('.zoom').each(function(){
						if(!$(this).hasClass('current')){
							$(this).css('z-index', 10);
						}
					});
				
				if(callback){
					callback.call();
				}
				
			});
	},
	
	createBox : function(e, callback){
		
		$(document.body).append('<div id="tooltip" class="tooltip">'+jsonImg[zoom.currentId].tooltip+'</div>');
		
		$(document.body).bind('mousemove', zoom.update);

		zoom.update();	
		
		if(callback){
			callback.call();
		}
	},
	
	update : function(e){
		
		if( zoom.current == null ) {
			$(document.body).unbind('mousemove', zoom.update);
			return;	
		}
		if(e){
			zoom.moveBox(e);
		}
		
	},
	
	moveBox : function(e){
		$('#tooltip').css('display', 'block');
		var t, l;
		if(zoom.BlackBoxPosition == 'up'){
			t =  e.pageY - $('#tooltip').height();
		}else if(zoom.BlackBoxPosition == 'down'){
			t =  e.pageY +25;
		}
		
		l = e.pageX +25;
		
		$('#tooltip').css({
			top : t,
			left :  l
		})
	},
	
	delAlt : function(id){
		var img = $("#"+id);
		img.removeAttr('alt');
	},
	
	increaseTextSize : function(){
		var fontSize = $.getCssPosValue($("#"+zoom.currentId+"Container > p").css('font-size'));
		var nfontSize = parseInt(fontSize + 4);

		$("#"+zoom.currentId+"Container > p").animate({
			fontSize : nfontSize +"px"
			},
			zoom.duration
			);
	},
	
	decreaseTextSize : function(){
		var fontSize = $.getCssPosValue($("#"+zoom.currentId+"Container > p").css('font-size'));
		var nfontSize = parseInt(fontSize - 4);

		$("#"+zoom.currentId+"Container > p").animate({
			fontSize : nfontSize +"px"
			},
			zoom.duration
			);
	}
}


