/*
 * mooSwitch 1.2 - Javascript Image Switcher with mootools 1.2
 * By Mario Zambon (http://www.urbangap.com)
 * Copyright (c) 2008 cody urbangap
 * Licensed under the MIT License: http://www.opensource.org/licenses/mit-license.php
*/

function mooswitch() {
	//Setting
	var dida 		= true 
	var insertMask 	= true
	var mask 		= 'i/t/mask-th_prod.png'
	var maskImgBig 	= 'i/t/mask_prod.png'
	var loaderImage	= 'i/t/loader.gif'
	
	var imgBig		= $('imgBig')
	var th 			= $('imgTh')
	var a	 		= $$('#imgTh a')
	var li	 		= $$('#imgTh li') 
	var img			= null
	var txt 		= new Element('div', {'id': 'txTitle'}).inject(imgBig)
	var maskBig 	= new Element('div', {'id': 'imgMask'}).inject(imgBig)
	
	txt.set('opacity', 0)
	th.addClass('dimensioneTh')
	th.removeClass('alt')
	imgBig.addClass('dimensione')
	imgBig.set('styles', {'background': '#000 url('+loaderImage+') center no-repeat'})

	if (insertMask) { 		
		maskBig.set('styles', {
			'background': 'url('+maskImgBig+') 0 0 no-repeat', 
			'behavior': 'url(iepngfix.htc)'
		})
	}

	a.addEvent('click', $lambda(false))
	a.addEvent('click', function(event){
		var cl	= this.hasClass('imgSelect')
		tthis	= this
		href	= this.getProperty('href')
		title	= this.getProperty('title')
		a.removeClass('imgSelect')
		this.addClass('imgSelect')
		

		if(!cl){
			img.destroy()				
			imgBig.set('styles', {'background': '#000 url('+loaderImage+') center no-repeat'})
			a.set('opacity', 1)
			this.set('opacity', 0.5)
			rollover()
			preloadImage()
		}
	})

	a.each(function(item, index){
		i = index

		if (insertMask) { 
			var ida = 'ida'+(i)
			item.setProperty('id', ida)
			new Element('img', {
				'src': mask, 
				'alt': '', 
				'class': 'maskTh', 
				'styles': {'behavior': 'url(iepngfix.htc)'}
			}).inject(ida, 'top')
		}

		if (i==0) {
			tthis 	= a[i]
			href 	= a[i].getProperty('href')
			title	= a[i].getProperty('title')
			a[i].addClass('imgSelect')
			a[i].set('opacity', 0.5)
			rollover()
			preloadImage()			
		}
	})

	function preloadImage() {
		new Asset.image(href, {onload: loadImg})
	}

	function loadImg() {
		imgBig.set('styles', {'background-image': 'none'})
		
		img = new Element('img', {'id':'image', 'alt': '', 'src': href}).set('opacity', 0).inject(imgBig)
		fx(img, 500)
		img.tween('opacity', 0, 1)
		
		txt.destroy()
		txt	= new Element('div', {'id': 'txTitle', 'class': 'bgTxt'}).set('opacity', 0).inject(imgBig)
		txt.set('html', title)
	}		
	
	function fx(el, tmp) {
		el.set('tween', {duration: tmp, transition: Fx.Transitions.Expo.easeInOut})
	}
	
	function rollover() {
		a.addEvents({
			'mouseover': function(){if(tthis!=this) this.tween('opacity', 1, 0.5)},
			'mouseleave': function(){if(tthis!=this) this.tween('opacity', 1)}
		})
	}

	function boxDida() {
			imgBig.addEvents({
				'mouseover': function(){
					if(tthis.title) {
						fx(txt, 700)
						txt.tween('opacity', 0.7)
					}
				},
				'mouseleave': function(){
					if(tthis.title) {
						fx(txt, 1500)
						txt.tween('opacity', 0)
					}
				}
			})
	}
		
	if (dida) boxDida()
	if (!i) th.destroy()
}

window.addEvent('domready', mooswitch)