/***************************************************************/
/* ATTIVARE SE NON GIA' DEFINITO			       */
/***************************************************************/
/*
Fx.mzStyle = Fx.Style.extend({

	increase: function(){
		if(this.element.setStyle) this.element.setStyle(this.property, this.css.getValue(this.now, this.options.unit, this.property));
	}
});
*/

var mzGallery = new Class({

	options: {
		usethumbGallery:true,
		usetxtGallery:true,
		usecmdGallery:true,
		imageidPrefix:"IM_",
		imagecontainerClass:"imageContainer",
		imagewrapperClass:"imageWrapper",
		imageClass:"imageElement",
		imageTransition:Fx.Transitions.Quad.easeOut,
		imageSpeed:500,
		imageAnimation:"scrolling",
		imageStart:null,
		automatic:false,
		cycling:false,
		timeout:3000,
		onStartShow: Class.empty,
		onStopShow: Class.empty,
		onStart: Class.empty,
		onComplete: Class.empty
	}, 

	initialize: function(element, options) {

		this.setOptions(options);
		
		this.element=element;
		this.container = this.element.getElement("div[class="+this.options.imagecontainerClass+"]");
		this.wrapper = this.container.getElement("div[class="+this.options.imagewrapperClass+"]");
		this.images = this.wrapper.getElements("div[class="+this.options.imageClass+"]")
		if(this.images[0] && this.options.imageAnimation=='scrolling') this.wrapper.setStyle('width',(this.images[0].getSize().size.x*this.images.length)+'px')
		this.imagenumber = this.images.map(function(item, index){return item.id});
		this.imagenumber = this.imagenumber.map(function(item, index){return index+1}).associate(this.imagenumber);
		this.selected = null;

		switch(this.options.imageAnimation){
		    case "news":
		        this.imagesfxopen = this.images.map(function(item, index) { return new Fx.mzStyle($(item.id), 'opacity', { duration: this.options.imageSpeed, transition: this.options.imageTransition, onStart: this.options.onStart }) } .bind(this)).associate(this.images.map(function(item, index) { return item.id }));
		        this.imagesfxclose = this.images.map(function(item, index) { return new Fx.mzStyle($(item.id), 'opacity', { duration: this.options.imageSpeed, transition: this.options.imageTransition, onComplete: this.options.onComplete }) } .bind(this)).associate(this.images.map(function(item, index) { return item.id }));
		        break;
		    case "fading":
				this.imagesfxopen=this.images.map(function(item, index){return new Fx.mzStyle($(item.id).getElement('img'), 'opacity',{duration:this.options.imageSpeed,transition:this.options.imageTransition,onStart:this.options.onStart})}.bind(this)).associate(this.images.map(function(item, index){return item.id}));
				this.imagesfxclose=this.images.map(function(item, index){return new Fx.mzStyle($(item.id).getElement('img'), 'opacity',{duration:this.options.imageSpeed,transition:this.options.imageTransition,onComplete:this.options.onComplete})}.bind(this)).associate(this.images.map(function(item, index){return item.id}));
			break;
			case "scrolling":
				this.scroller = new Fx.Scroll(this.container, {
					duration: this.options.imageSpeed,
					transition: this.options.imageTransition,
					onStart:this.options.onStart,
					onComplete:this.options.onComplete
				});
			break;
		}
		
		if(this.options.usethumbGallery) this.thumbGallery = new mzThumbGallery(this,this.options);
		if(this.options.usetxtGallery) this.txtGallery = new mzTxtGallery(this,this.options);
		if(this.options.usecmdGallery) this.cmdGallery = new mzCmdGallery(this,this.options);
		
		var imageStart = (this.options.imageStart) ? ((this.options.imageStart=='nothing') ? null : this.options.imageStart) : ((this.images[0]) ? this.images[0].id.substr(this.options.imageidPrefix.length) : null)
		if(imageStart) this.goto(imageStart);
		if(imageStart && this.options.usethumbGallery) this.thumbGallery.scrollto.delay(500,this.thumbGallery,imageStart);
		if(this.options.automatic) this.start();

	},
	
	goto: function(id) {
	
		switch(this.options.imageAnimation){
			case "fading":
			case "news":
				if(this.selected) this.imagesfxclose[this.options.imageidPrefix+this.selected].start(1,0);
				this.selected=id;
				this.imagesfxopen[this.options.imageidPrefix+this.selected].start(0,1);
			break;
			case "scrolling":
				this.selected=id;
				this.scroller.toElement($(this.options.imageidPrefix+this.selected));
			break;
		}
		if(this.options.usetxtGallery) this.txtGallery.select(id);
		if(this.options.usethumbGallery) this.thumbGallery.select(id);			
		if(this.options.usecmdGallery) this.cmdGallery.select(id);			

	},
	
	back: function() {

		if($(this.options.imageidPrefix+this.selected).getPrevious()){
			this.goto($(this.options.imageidPrefix+this.selected).getPrevious().id.substr(this.options.imageidPrefix.length));
			if(this.options.usethumbGallery) this.thumbGallery.scrollto.delay(500,this.thumbGallery,this.selected);	
		}

	},
	
	next: function() {

		if($(this.options.imageidPrefix+this.selected).getNext()){
			this.goto($(this.options.imageidPrefix+this.selected).getNext().id.substr(this.options.imageidPrefix.length));
			if(this.options.usethumbGallery) this.thumbGallery.scrollto.delay(500,this.thumbGallery,this.selected);	
		}
		
	},
	
	first: function() {

		if(this.wrapper){
			this.goto(this.wrapper.getFirst().id.substr(this.options.imageidPrefix.length));
			if(this.options.usethumbGallery) this.thumbGallery.scrollto.delay(500,this.thumbGallery,this.selected);	
		}
		
	},

	start: function() {
		
		this.fireEvent('onStartShow',this);	

		if(!this.selected) this.first();
		this.automatic=this.timerhit.periodical(this.options.timeout,this);
		
	},

	stop: function() {
		
		$clear(this.automatic);

		this.fireEvent('onStopShow',this);	
		
	},

	timerhit: function() {
		
		if($(this.options.imageidPrefix+this.selected)){
			if($(this.options.imageidPrefix+this.selected).getNext()){
				this.next();
			}else if(this.options.cycling && this.element){
				this.first();
			}
		}else{
			this.stop();
		}
	}

});

mzGallery.implement(new Events, new Options);

var mzThumbGallery = new Class({

    options: {
        externalthumbGallery: false,
        thumbidPrefix: "TD_",
        thumbwrapperClass: "thumbWrapper",
        thumbcontainerClass: "thumbContainer",
        thumbgalleryClass: "thumbGallery",
        thumbgalleryMaxH: 170,
        thumbgalleryMinH: 17,
        thumbgalleryDim: "height",
        thumbgalleryObj: "thumbgallery",
        thumbTransition: Fx.Transitions.linear,
        thumbSpeed: 500,
        thumbSliderSpeed: 500,
        thumblowOpacity: 0.4,
        thumbonClass: null,
        thumbWidth: 100,
        thumbSpacing: 17,
        thumbstartOpened: false,
        thumbsautoscroll: true
    },

    initialize: function(element, options) {

        this.setOptions(options);

        this.gallery = element;
        this.thumbgallery = (this.options.externalthumbGallery) ? this.options.externalthumbGallery : this.gallery.element.getElement("div[class=" + this.options.thumbgalleryClass + "]");
        this.container = this.thumbgallery.getElement("div[class=" + this.options.thumbcontainerClass + "]");
        this.wrapper = this.container.getElement("div[class=" + this.options.thumbwrapperClass + "]");
        this.layermenu = (this[this.options.thumbgalleryObj]) ? this[this.options.thumbgalleryObj] : this.gallery.element.getElement("div[class=" + this.options.thumbgalleryObj + "]");
        this.thumbs = this.container.getElements("div[id^=" + this.options.thumbidPrefix + "]")
        this.thumb_fx = {};
        this.selected = null;

        this.wrapper.style.width = ((this.thumbs.length * (this.options.thumbWidth + this.options.thumbSpacing)) + this.options.thumbSpacing) + "px";
        this.navscroller = new Fx.Scroll(this.container, { duration: 500 });
        this.slider = new Fx.Style(this.layermenu, this.options.thumbgalleryDim, { duration: this.options.thumbSliderSpeed });

        if (this.options.thumbsautoscroll) {

            this.scroller = new Scroller(this.container, { area: 140, velocity: 0.2 });

            this.container.addEvent('mouseenter', function(e) {
                this.scroller.start();
            } .bind(this));

            this.container.addEvent('mouseleave', function(e) {
                this.scroller.stop();
            } .bind(this));
        }

        this.thumbs.each(function(el) {

            this.thumb_fx[el.id] = new Fx.Style(el, 'opacity', { duration: this.options.thumbSpeed, transition: this.options.thumbTransition });

            el.addEvent('mouseenter', function(e) {
                this.thumb_fx[this.options.thumbidPrefix + e.target.id.substr(this.options.thumbidPrefix.length)].stop();
                this.thumb_fx[this.options.thumbidPrefix + e.target.id.substr(this.options.thumbidPrefix.length)].start(1);
                if (this.options.thumbonClass) e.target.addClass(this.options.thumbonClass);
            } .bind(this));

            el.addEvent('mouseleave', function(e) {
                if (e.target.id.substr(this.options.thumbidPrefix.length) != this.selected) {
                    this.thumb_fx[this.options.thumbidPrefix + e.target.id.substr(this.options.thumbidPrefix.length)].stop();
                    this.thumb_fx[this.options.thumbidPrefix + e.target.id.substr(this.options.thumbidPrefix.length)].start(this.options.thumblowOpacity);
                    if (this.options.thumbonClass) e.target.removeClass(this.options.thumbonClass);
                }
            } .bind(this));

            el.addEvent('click', function(e) {
                e = new Event(e).stop();
                if (e.target.id.substr(this.options.thumbidPrefix.length) != this.selected) {
                    this.gallery.goto(e.target.id.substr(this.options.thumbidPrefix.length));
                }
            } .bind(this));

        } .bind(this))

        if (this.options.thumbstartOpened) this.slider.start(this.options.thumbgalleryMaxH);

    },

    toggle: function() {

        (this.layermenu.getStyle(this.options.thumbgalleryDim).toInt() == this.options.thumbgalleryMinH) ? this.slider.start(this.options.thumbgalleryMaxH) : this.slider.start(this.options.thumbgalleryMinH)

    },

    select: function(id) {
        if (this.selected) {
            this.thumb_fx[this.options.thumbidPrefix + this.selected].start(this.options.thumblowOpacity);
            if (this.options.thumbonClass) this.wrapper.getElement("div[id=" + this.options.thumbidPrefix + this.selected + "]").removeClass(this.options.thumbonClass);
        }
        this.selected = id;
        this.thumb_fx[this.options.thumbidPrefix + this.selected].start(1);
        if (this.options.thumbonClass) this.wrapper.getElement("div[id=" + this.options.thumbidPrefix + this.selected + "]").addClass(this.options.thumbonClass);
    },

    scrollto: function(id) {
        this.navscroller.scrollTo(this.wrapper.getElement("div[id=" + this.options.thumbidPrefix + id + "]").getLeft() - this.container.getLeft() - this.options.thumbSpacing, 0);
    }

});

mzThumbGallery.implement(new Options);


var mzTxtGallery = new Class({

	options: {
		txtidPrefix:"DE_",
		externaltxtGallery:false,
		txtcontainerClass:"txtGallery"
	}, 

	initialize: function(element, options) {

		this.setOptions(options);

		this.gallery = element;
		this.container = (this.options.externaltxtGallery) ? this.options.externaltxtGallery : this.gallery.element.getElement("div[class="+this.options.txtcontainerClass+"]");
		this.selected = null;

	},

	over: function(id) {

		if(this.selected) this.container.getElement("div[id="+this.options.txtidPrefix+this.selected+"]").setStyle("visibility","hidden");
		this.container.getElement("div[id="+this.options.txtidPrefix+id+"]").setStyle("visibility","visible");

	},

	out: function(id) {

		this.container.getElement("div[id="+this.options.txtidPrefix+id+"]").setStyle("visibility","hidden");	
		if(this.selected) this.container.getElement("div[id="+this.options.txtidPrefix+this.selected+"]").setStyle("visibility","visible");

	},

	select: function(id) {

		if(this.selected) this.container.getElement("div[id="+this.options.txtidPrefix+this.selected+"]").setStyle("visibility","hidden");
		this.container.getElement("div[id="+this.options.txtidPrefix+id+"]").setStyle("visibility","visible");
		this.selected=id;		

	}

});

mzTxtGallery.implement(new Options);

var mzCmdGallery = new Class({

	options: {
		externalcmdLeft:false,
		externalcmdRight:false,
		externalcmdThumb:false,
		externalcmdNumber:false,
		cmdidLeft:"thumbLeft",
		cmdidRight:"thumbRight",
		cmdidThumb:"thumbButton",
		cmdidNumber:"thumbNumber",
		cmdhtmlThumbOn:"[ x ]",
		cmdhtmlThumbOff:"Open"
	}, 

	initialize: function(element, options) {

		this.setOptions(options);

		this.gallery = element;
		this.left = (this.options.externalcmdLeft) ? this.options.externalcmdLeft : this.gallery.element.getElement("div[class="+this.options.cmdidLeft+"]");
		this.right = (this.options.externalcmdRight) ? this.options.externalcmdRight : this.gallery.element.getElement("div[class="+this.options.cmdidRight+"]");
		this.thumb = (this.options.externalcmdThumb) ? this.options.externalcmdThumb : this.gallery.element.getElement("div[class="+this.options.cmdidThumb+"]");
		this.thumbopened = this.gallery.options.thumbstartOpened;
		this.numb = (this.options.externalcmdNumber) ? this.options.externalcmdNumber : this.gallery.element.getElement("div[class="+this.options.cmdidNumber+"]");

		if(this.options.cmdidLeft) this.left.addEvent('click', function(e){
				e = new Event(e).stop();
				this.gallery.back();
		}.bind(this));
		
		if(this.options.cmdidRight) this.right.addEvent('click', function(e){
				e = new Event(e).stop();
				this.gallery.next();
		}.bind(this));

		if(this.options.cmdidThumb) this.thumb.addEvent('click', function(e){
				e = new Event(e).stop();
				if(this.options.usethumbGallery) this.gallery.thumbGallery.toggle();
				this.thumbbuttonToggle();
		}.bind(this));

	},
	
	thumbbuttonToggle: function() {
	
		(this.thumbopened) ? this.thumb.getElement("a").setHTML(this.options.cmdhtmlThumbOff) : this.thumb.getElement("a").setHTML(this.options.cmdhtmlThumbOn);
		this.thumbopened=!this.thumbopened;
		
	},

	select: function(id) {

		if(this.numb) this.numb.setHTML(this.gallery.imagenumber[this.options.imageidPrefix+id]+"/"+this.gallery.images.length)
		
	}
	

});

mzCmdGallery.implement(new Options);