window.addEvent('domready', function() {
	initRollovers();
	initScrollic();
	loadAvatars();
	
});

window.addEvent('load', function() {
	initMap();
});

function initMap() {

	var mapAddresses = $$('.mapAddress');
	mapAddresses.each(function(addressTag){
		var messageDiv = addressTag.getParent();
		var address = addressTag.get('text');
		

		var geocoder = new GClientGeocoder();
		geocoder.getLatLng(
			address,
			function(point) {
			  if (!point) {
				
			  } else {

					
					langClose = messageDiv.getElement('.lang_close').get('text');
					langClose = langClose +' '+ 'Google Map';
					langGM = 'Google Map';
					
					
					var map_wrapper = new Element('div',{
						'styles': {
							'position':'absolute',
							'z-index': 100,
							'height':'200px',
							'top':'0',
							'right':'0',
							'width':'300px',
							'border':'1px solid black',
							'display':'none'
						}
					}).inject(messageDiv);
				  
					var mapLink = new Element('a',{
						'href':'#',
						'html': langGM,
						'styles': {
							
						},
						'events': {
							'click': function(event){
								event.preventDefault();
								mapReveal.toggle();	
							}	
						}
					}).inject(messageDiv);
				  
					var mapReveal = new Fx.Reveal(
						map_wrapper, 
							{
								duration: 500, 
								mode: 'vertical',
								onShow: function() {
									var map = new GMap2(map_wrapper);
									map.setCenter(point, 12);
									map.setUIToDefault();	
									var marker = new GMarker(point);
									map.addOverlay(marker);
									map.panTo(point);
									mapLink.set('html', langClose);
								},
								onHide: function() {
									mapLink.set('html', langGM);
								}
							}
					);
			  
			  
			  }
			}
		  );

		
		
		
	});
}


function initRollovers() {
	
	var buttons = $$('.hi');
	buttons.each(function(button){
		var nImg = button.getElement('img');
		
		var nSrc = nImg.get('src');
		var slashPos = nSrc.lastIndexOf('/');
		var dotPos = nSrc.lastIndexOf('.');
		var path = nSrc.substring(0,slashPos);
		var hiName = nSrc.substring(slashPos,dotPos) + '_hi';
		var hiExt = nSrc.substring(dotPos);	
		var hiSrc = path + hiName + hiExt;
		
		pDiv = nImg.getParent('div');
		if (pDiv.hasClass('tab')) {
			var cat = $('onglets').get('class');
			if (pDiv.hasClass(cat)) {
				nSrc = hiSrc;
				nImg.src = hiSrc;
			}
		}

		nImg.set('nSrc', nSrc);
		nImg.set('hiSrc', hiSrc);
		
		
		button.addEvents({
		    'mouseenter': function(){
				
				$('onglets').getElements('.tab .hi').each(function(img) {
					nSrc = img.get('nSrc');
					img.set('src',nSrc);
				});
				
		        var hiSrc = nImg.get('hiSrc');
				nImg.set('src', hiSrc);
				
		    },
		    'mouseleave': function(){
		        var nSrc = nImg.get('nSrc');
				nImg.set('src', nSrc);
		    }
		});
		
		
		var tmpImage = new Element('img', {
			'src': hiSrc
		});
	
		
	});
	
	
	
}

function initScrollic() {

	var scrollicDivs = $$('.scrollic');
	if (scrollicDivs.length>0) {

		$$('.scrollic').each(function(scrl){
			
			scrl.setProperty('id','scrlDiv');
			var scrlFit = new Fx.Tween(scrl);
			
			scrlFit.set('height','300px');
			scrlFit.set('overflow','hidden');
			scrlFit.set('padding','2px 20px 2px 20px');
			
			
			var scrlBox = new Element('div',{
					'styles':{
						'position':'relative',
						'height':'300px',
						'border':'1px solid black',
						'z-index':'100'
					}
			}).wraps(scrl);
			
			
			var scrlArea = new Element('div',{
					'styles':{
						'position':'absolute',
						'height':'300px',
						'top':'0',
						'right':'0',
						'width':'5px',
						'border':'1px solid black'
					}
			}).inject(scrlBox);
			
			var scrlKnob = new Element('div',{
					'id':'scrlKnob',
					'styles':{
						'position':'relative',
						'height':'5px',
						'width':'5px',
						'top':'0',
						'left':'0',
						'cursor':'pointer',
						'background-color':'#000',
						'z-index':'100'
					}
				}).inject(scrlArea);
			
			

		});

		new MooScroller($('scrlDiv'), $('scrlKnob'));


	}
}

function loadAvatars() {
	if ($defined($('avatars'))) {
		

		var pathToIcons = "assets/images/icons/50x50/";
		var pathToAvatar = "assets/images/icons/150x150/";
		var avatarImage = '';
		var avatarColor = '';
		
		var iconImgs = new Array('appareil_photo.gif','arosoir.gif','cable.gif','cadre.gif','chaise.gif','chapeau.gif','chaussure.gif','chips.gif','ciseaux.gif','disc.gif','foot.gif','fourchettes.gif','gant.gif','jeux.gif','koons.gif','luge.gif','lunettes.gif','machinealaver.gif','masque.gif','mixer.gif','ordi.gif','ours.gif','ours2.gif','patin.gif','playboys.gif','plume.gif','ringo.gif','robinet.gif','singe.gif','table.gif','tasse.gif','telephone.gif','telephone2.gif','tennis.gif','tondeuse.gif','tv.gif','typewriter.gif','velo.gif','ventilateur.gif');
		var colors = new Array('ffffff','fff600','ff9400','ff0000');
		
		
		
		new Element('div',{
				'id':'icons'
		}).inject($('avatars'),'top');
		new Element('div',{
				'id':'final'
		}).inject($('avatars'),'top');
		new Element('div',{
				'id':'colors'
		}).inject($('avatars'),'top');
		
		
		var finalImage = new Element('img',{
				'src':'',
				'alt':''
		}).inject($('final'));
		
		
		
		iconImgs.each(function(icon){
			var iconSrc = pathToIcons+icon;
			new Element('img',{
				'icon':icon,
				'src':iconSrc,
				'alt':'',
				'styles':{
					'border':'2px solid black',
					'margin':'1px'
				},
				'events': {
			        'click': function(){
							$$('#icons img').each(function(imgEl){
							
								var iconOffFx = new Fx.Morph(imgEl).set({
									'border':'2px solid #000',
									'margin':'1px'
								});
							
							});
						
							var iconOnFx = new Fx.Morph(this).set({
								'border':'3px solid #ff0000',
								'margin':'0'
							});
							avatarImage = this.get('icon');
							getFinalImage();
	   
			        }
			    }		

			}).inject($('icons'));
		});

		
		
		colors.each(function(color){
			var bgColor = '#'+color;
			new Element('div',{
				'color':color,
				'styles':{
					'background-color':bgColor,
					'height':'50px',
					'width':'50px',
					'border':'2px solid #ff0000',
					'clear':'none',
					'float':'right',
					'margin':'1px'
				},
				'events': {
			        'click': function(){
							$$('#colors div').each(function(colorDiv){
								var colorOffFx = new Fx.Morph(colorDiv).set({
									'border':'2px solid #ff0000',
									'margin':'1px'
								});
							
							});
							
							var colorOnFx = new Fx.Morph(this).set({
								'border':'3px solid #00ff00',
								'margin':'0'
							});
							avatarColor = this.get('color');
							getFinalImage();
	  
			        }
			    }
			}).inject($('colors'));
		});
		
				
		function getFinalImage() {
			if (avatarImage!='' && avatarColor!='') {
				var finalImageSrc = pathToAvatar+avatarColor+'/'+avatarImage;
				color = "#"+avatarColor;
				$('final').setStyle('background-color',color);
				finalImage.setProperty('src',finalImageSrc);
				$('avatar').setProperty('value',finalImageSrc);
				
			}
		
		}

		
		
		var imgSrc = $('avatar').getProperty('value');
		if ($defined(imgSrc)) {
			
			var pathBits = imgSrc.split('/');
			pbLength = pathBits.length;
			var avaFile = pathBits[pbLength-1];
			var avaColor = pathBits[pbLength-2];
			
			var search = 'div[color='+avaColor+']';	
			var clrDiv = $('colors').getElement(search);
			clrDiv.fireEvent('click');
			
			var search = 'img[icon='+avaFile+']';	
			var iconDiv = $('icons').getElement(search);
			iconDiv.fireEvent('click');	
		}
		
	}

}