var ZT_demo = new Class({
	initialize: function(params){
		this.items = params.items;
		this.controlbar = params.control;
		this.buttonbar = params.buttonctr;
		this.ztIframe = params.zt_iframe;
		this.buttonhide = params.buttonhide;
		this.ctrbutton = params.mainctrbutton;
		this.mode = params.mode || 'horizontal';
		this.modes = {horizontal:['left','width']};
		this.size = params.size || 240;
		this.box = params.box.setStyle(this.modes[this.mode][1],(this.size*this.items.length)+'px');
		this.button_event = params.button_event || 'click';
		this.handle_event = params.handle_event || 'click';
		this.onWalk = params.onWalk || null;
		this.currentIndex = null;
		this.previousIndex = null;
		this.tempUrl = params.tempUrl;
		this.header=document.id("zt_warrp");
        this.containerId = '#zt_demo';
		this.tempItem = $$(this.containerId + ' ' + '#zt-demo-display'+' '+'.zt-preview');		
		this.slideBar = $$(this.containerId + ' ' + '.zt-control'+' '+'li.theme'); 
		this.showList();
		this.tempselect=$("zt-select");
		this.listdemo=$("zt_demo");
        this.iframe=$("iframe");
		this.overlay=$("overlay");
		this.loading=$("loading");
		this.temps=document.getElements(".theme");
		this.nextIndex = null;
		this.interval = params.interval || 5000;
		this.autoPlay = params.autoPlay || false;
		this.controlbar.setStyle('top', 0);
		this.ztIframe.setStyle('top', 68);
        this.ctrbutton.setStyle('top', -28);
		this._play = null;
		this.handles = params.handles || null;
		if(this.handles){
			this.addHandleButtons(this.handles);
		}
		this.buttons = {
			previous: [],
			next: []
		};
		if(params.addButtons){
			for(var action in params.addButtons){
				this.pagenav(action, $type(params.addButtons[action])=='array' ? params.addButtons[action] : [params.addButtons[action]]);
			}
		}
		window.addEvent("resize",ztResize=function(){
			this.loading.setStyles({left:window.getSize().x/2.2-this.loading.getSize().x/6,top:window.getSize().y/2.3-this.loading.getSize().y/2});
			boxLeft=this.tempselect.getCoordinates();
			mainsize={left:0,width:window.getSize().x,height:window.getSize().y-this.header.getSize().y};
			this.iframe.setStyles(mainsize);
			this.listdemo.setStyles({top:this.header.getSize().y+10,left:boxLeft.left-270})
		}.bind(this));
		ztResize();
		this.tempselect.addEvents({
			click:function(){
				this.displayList();
			}.bind(this)
		});
		this.buttonbar.addEvents({
			click:function(){
				this.showcontrol(true);
			}.bind(this)
		}); 
		this.buttonhide.addEvents({
			click:function(){
				this.showcontrol(false);
			}.bind(this)	
		});
		this.temps.addEvents({ 
			click:function(event){
				var theme_data=event.target.getProperty('theme-name'),data_temp=event.target.getProperty("temp-name");
				this.slideBar.each(function(item,i){
					var listselect = item.getProperty('theme-name'); 
					if(listselect==theme_data){ 
						var numbcurrent = i;
						this.tempItem.each(function(item1,j){  
							if(numbcurrent==j){
								this.slideBar.each(function(element){element.removeClass('current');});
								this.tempItem.each(function(element){element.removeClass('current');});
								item.addClass("current");
								item1.addClass("current");
							}
						}.bind(this));
					}
				}.bind(this));
				this.ztSelected(theme_data,data_temp);
			}.bind(this)
		});
		this.iframe.addEvent("load",function(){
			this.overlay.setStyle('display', 'none');this.loading.setStyle('visibility', 'hidden');
		}.bind(this));

		this.fx = new Fx.Tween(this.box,$extend((params.fxOptions||{duration:500,wait:false}),{property:this.modes[this.mode][0]}));
		this.ztControlbars((params.startItem||0),true,true);
	},

	addHandleButtons: function(handles){
		for(var i=0;i<handles.length;i++){
			handles[i].addEvent(this.handle_event,this.walk.pass([i,true],this));
		}
	},

	pagenav: function(action,buttons){
		for(var i=0; i<buttons.length; i++){
			switch(action){
				case 'previous': buttons[i].addEvent(this.button_event,this.previous.pass([true],this)); break;
				case 'next': buttons[i].addEvent(this.button_event,this.next.pass([true],this)); break;
			}
			this.buttons[action].push(buttons[i]);
		}
	},

	previous: function(manual){
		this.ztControlbars((this.currentIndex>0 ? this.currentIndex-1 : this.items.length-1),manual);
	},

	next: function(manual){
		this.ztControlbars((this.currentIndex<this.items.length-1 ? this.currentIndex+1 : 0),manual);
	},
	
	ztSelected:function(theme_data,data_temp){  
		var selectTemp = this.tempUrl+''+theme_data
		this.getTempselected(theme_data);
		this.tempselect.set("html",data_temp);
		this.linkUrl(selectTemp); 
	}, 
	displayList:function(){
		if(this.listdemo.getStyle('display')=='block'){
			this.listdemo.setStyle('display', 'none');
			this.overlay.setStyle('display', 'none').removeClass('zt-delay');
		}else{
			this.listdemo.setStyle('display', 'block');
			this.overlay.setStyle('display', 'block').addClass('zt-delay');
			this.overlay.addEvents({
				click:function(){
					this.listdemo.setStyle('display', 'none');
					this.overlay.setStyle('display', 'none');
				}.bind(this)
			});
		} 
	},
	ztControlbars: function(item,manual,noFx){
		if(item!=this.currentIndex){
			this.currentIndex=item;
			this.previousIndex = this.currentIndex + (this.currentIndex>0 ? -1 : this.items.length-1);
			this.nextIndex = this.currentIndex + (this.currentIndex<this.items.length-1 ? 1 : 1-this.items.length);
			
			if(noFx){
				this.fx.cancel().set((this.size*-this.currentIndex)+'px');
			}else{
				this.fx.start(this.size*-this.currentIndex);
			}
			if(manual && this.autoPlay){
				this.play(this.interval,'next',true);
			}
			if(this.onWalk){
				this.onWalk((this.items[this.currentIndex] || null), (this.handles && this.handles[this.currentIndex] ? this.handles[this.currentIndex] : null));
			}
		}
	},
    showList:function(){
		this.slideBar.each(function(item,i){ 
			item.addEvent('mouseenter',function(){
				this.tempItem.each(function(item1,j){ 
					if(i!=j){ 
						this.slideBar[j].removeClass("selected");
						item1.addClass("block").removeClass("active");
					} else {
						item.addClass("selected");
						item1.removeClass("block").addClass("active");
					}
				}.bind(this));
			}.bind(this));
			item.addEvent('mouseleave',function(){
				this.tempItem.each(function(item1,j){  
					this.slideBar[j].removeClass("selected");
					item1.addClass("block").removeClass("active");
					$$('.current').each(function(element){
						if(element.hasClass('zt-preview')){
							element.removeClass('block').addClass('active');
						}else{
							element.addClass('selected');
						} 
					});
				}.bind(this));
			}.bind(this));
		}.bind(this));
	},
	linkUrl:function(zturl){ 
		this.iframe.set("src",zturl);
		this.overlay.setStyle('display', 'block'); 
		this.loading.setStyle("visibility","visible")
		this.listdemo.setStyle('display', 'none');
	},
	getTempselected: function(itemSelect){ 
		this.slideBar.each(function(item,i){
			var listselect = item.getProperty('theme-name'); 
			if(listselect==itemSelect){ 
				var numbcurrent = i;
			} 
			this.tempItem.each(function(item1,j){  
				if(numbcurrent==j){
					item.addClass("selected").addClass("current");
					item1.removeClass("block").addClass("active").addClass("current");
				}
			}.bind(this)); 
		}.bind(this));
		$$('.zt-column').each(function(item){
			$$('li.current').each(function(element){
				currentActive = element.getParent().getParent();
				if(currentActive == item){ 
					getCl = currentActive.getProperty('colum-numb');
					//console.log((this.size*-getCl)+this.size);
					this.fx.start((this.size*-getCl));
				} 
			}.bind(this));
		}.bind(this));
	},
	showcontrol:function(wait){
		if(wait){ 
			this.ctrbutton.set('morph', {duration: '500', transition: Fx.Transitions.Sine.easeOut, onComplete: function(event){}});
			this.ctrbutton.morph({top: -28});
			var timeshow = setTimeout(function(){
				this.controlbar.set('morph', {duration: '500', transition: Fx.Transitions.Sine.easeOut, onComplete: function(event){}});
				this.controlbar.morph({top: 0, display: 'block'});
			}.bind(this),500);
			var timshow = setTimeout(function(){
				this.iframe.set('morph', {duration: '500', transition: Fx.Transitions.Sine.easeOut, onComplete: function(event){}});
				this.iframe.morph({top: this.header.getSize().y, height: window.getSize().y-this.header.getSize().y});
			}.bind(this),1000); 
		}else{
			var timshow = setTimeout(function(){
				this.ctrbutton.set('morph', {duration: '500', transition: Fx.Transitions.Sine.easeOut, onComplete: function(event){}});
				this.ctrbutton.morph({top: 0});
			}.bind(this),1200); 
			var ctrtime = setTimeout(function(){
                this.controlbar.set('morph', {duration: '500', transition: Fx.Transitions.Sine.easeOut, onComplete: function(event){}});
                this.controlbar.morph({top: -this.header.getSize().y}); 
            }.bind(this), 400);
            this.iframe.set('morph', {duration: '500', transition: Fx.Transitions.Sine.easeOut, onComplete: function(event){}});
			this.iframe.morph({top: 0, height: window.getSize().y});
			this.listdemo.setStyle('display', 'none');
			this.overlay.setStyle('display', 'none');
		}
	}
});