/*
	Moo Slide

	Copyright Magic Web Solutions Ltd. 1999-2008.

	This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.

	This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU General Public License for more details.

	You should have received a copy of the GNU General Public License along with this program.  If not, see <http://www.gnu.org/licenses/>.
	
*/
var mooslide = new Class({
	initialize: function(options) {
		this.containerDiv=options.containerDiv; // HTML element to filling slide-image
		options = $merge({
			'slideDuration': 0,
			'duration': 1500,
			'sizer':options.containerDiv,
			'margin':0,
			'tbSetting':{}
			}, options);
		this.slideDuration=options.slideDuration;
		this.duration = options.duration;
		this.sizer=options.sizer; // HTML element for getting size for slide-image
		options.tbSetting = $merge({
			'mouseenterCSS': 'mouseenterCSS',
			'mouseliveCSS': 'mouseliveCSS'
			}, options.tbSetting);
		this.tbSetting=options.tbSetting; //thumbnail options( HTML element to filling tb-image and css class for each tb ){'container':'image_large_tb','sccClassItem':'sccClassItemX', 'sccClass':'tbDiv','sccClassLabel':'sccClassLabelX','mouseenterCSS':'mouseenterCSS', 'mouseliveCSS':'mouseliveCSS'}
		this.margin=options.margin;
		if($defined(options.preLoadImg))
			this.preLoadImg=new Asset.image(options.preLoadImg);
		this.placeholder=new Asset.image(options.placeholder);			
		this.containerSize=null;
		this.imageUrls=new Array();
		this.imageSrc=new Array();
		this.imageIndex=-1;
		this.loadCount=0;
		this.baseWidth=0;
		this.baseHeight=0;
		this.discSetting={'marginLeft':'10','marginBottom':'20','sccClass':'mooDescDiv','sccClassBG':'mooDescDivBG','duration':2000,'zIndex':1000};
		this.stepComplited = true;
		this.currentModification = {'from':0,'to':0,'fromFX':null,'toFX':null};
	},
	
	setUrlList: function(urlList){
		this.imageUrls=urlList;
	},
	
	onload: function(i){
		this.loadCount++;
		if($defined(this.tbSetting.container)){

			this.putTbOnDiv(i);
		}
		if(this.loadCount==this.imageSrc.length)
			this.loadComplite();
	},
	
	/* Pre load image*/
	isPreloadEmpty: function(){
		if($defined(this.preLoadImg)){
			if(this.imageSrc.length>0){
				if(this.preLoadImg.src==this.imageSrc[0].src)
					return true;
				else
					return false;
			}
		}
		return true;
	},
	
	startPreloadImg: function(){
		if(!$defined(this.preLoadImg)){
			if(this.imageSrc.length>0){
				this.preLoadImg=new Asset.image(this.imageSrc[0].src, { onload: this.preloadImgLoad.bind(this)});
			}
		}else{
			this.preloadImgLoad();
		}
		
	},
	
	preloadImgLoad: function(){
		if($defined(this.preLoadImg)){
			if(this.preLoadImg.width >this.containerSize.width || this.preLoadImg.heigh>this.containerSize.height){
					var size=Zoom(this.preLoadImg,this.containerSize.width,this.containerSize.height);			
					this.preLoadImg.setStyles({position: 'absolute'
					,'width':  parseInt(size.width-this.margin*2) 
					, 'height': parseInt(size.height-this.margin*2)
					,'left': parseInt((this.containerSize.width / 2) - ((size.width-this.margin*2) / 2))
					,'top': parseInt((this.containerSize.height / 2) - ((size.height-this.margin*2) / 2))
					});
					
			}else{
				this.preLoadImg.setStyles({
					'position': 'absolute',
					'left': parseInt((this.containerSize.width / 2) - (this.preLoadImg.width / 2)),
					'top': parseInt((this.containerSize.height / 2) - (this.preLoadImg.height / 2))
				});
			}
			var containerDiv=$(this.containerDiv);							
			this.preLoadImg.inject(containerDiv);
		}
	},
	
	
	stopPreloadImg: function(){
		if($defined(this.preLoadImg)){
			this.preLoadImg.setStyle('visibility','hidden');
		}
	},
	/* END Pre load image*/
	fullContainerSize: function(){
			this.containerSize=$(this.sizer).getCoordinates();
			this.containerSize.width=this.containerSize.width-$(this.sizer).getStyle("border-left-width").toInt()-$(this.sizer).getStyle("border-right-width").toInt()
			this.containerSize.height=this.containerSize.height-$(this.sizer).getStyle("border-top-width").toInt()-$(this.sizer).getStyle("border-bottom-width").toInt()
			
	},

	startPreLoad: function(){
		if(!$defined($(this.sizer))||$(this.sizer)===false)
			return;
		this.fullContainerSize();
		if(this.imageUrls.length==0){
			this.putPlaceHolder();
		}else{
			this.initTb();
			var i=0;
			for(i=0;i<this.imageUrls.length;i++){
				if(!$defined(this.imageUrls[i].url)){
					this.imageSrc[this.imageSrc.length]=new Asset.image(this.imageUrls[i].bigImage, { onload: this.onload.pass([i],this),onabort: this.onload.pass([i],this),onerror: this.onload.pass([i],this)});
					if($defined(this.tbSetting.container))
						this.imageSrc[i].tbDiv = this.getTbDiv();
				}else{
					this.imageSrc[this.imageSrc.length]=new Asset.image(this.imageUrls[i].url, { onload: this.onload.bind(this),onabort: this.onload.bind(this),onerror: this.onload.bind(this)});				
					this.imageSrc[i].descDiv = this.getDescDiv(this.imageUrls[i].desc);
				}
			}
			this.startPreloadImg();			
		}
		this.initSlideBG();
	},
	
	initTb: function(){
		var i=0;
		for(i=0;i<this.imageUrls.length;i++){
			if($defined(this.imageUrls[i].url))
			 return;
			if($defined(this.imageUrls[i].bigImage)) {
				if(!$defined(this.imageUrls[i].tbImage)) {
					this.imageUrls[i].tbImage = this.imageUrls[i].bigImage;
				}
			}else{
				this.imageUrls[i] = {'bigImage':this.imageUrls[i],'tbImage':this.imageUrls[i],'label':'121 131'};
			}
		}
	},
	getTbDiv: function(){
		var div =  new Element('div', {
			'class':this.tbSetting.sccClassItem,
		    'styles': {
			'display': 'none'					
		    }
		});
		var tbDiv =  new Element('div', {
			'class':this.tbSetting.sccClass
		});
		tbDiv.addClass(this.tbSetting.mouseliveCSS);
		tbDiv.inject(div);		
		var span =  new Element('span', {
			'class':this.tbSetting.sccClassLabel
		});
	
		span.injectAfter(tbDiv);
		div.tbDiv =  tbDiv;
		div.label =  span; 
		div.inject(this.tbSetting.container);
		return div;
	},

	putTbOnDiv: function(i){
		var image  = this.imageSrc[i];
		if($defined(image.tbImg))
		 return;
		
		image.tbDiv.setStyle("display","block");
		var divSize = image.tbDiv.tbDiv.getCoordinates();
	
		var size=Zoom(image,divSize.width,divSize.height);
		image.tbImg =  new Element('img', {
			'src':this.imageUrls[i].tbImage
		});
		image.tbImg.setStyles({
					'width': size.width
					, 'height': size.height
					,'left': parseInt((divSize.width / 2) - ((size.width) / 2))
					,'top': parseInt((divSize.height / 2) - ((size.height) / 2))
					,'position': 'absolute'
					});
		image.tbImg.inject(image.tbDiv.tbDiv);
		image.tbDiv.label.appendText(this.imageUrls[i].label);
		image.tbImg.bigImg = image;
		image.tbImg.tbDiv = image.tbDiv.tbDiv;
		image.tbImg.mouseenterCSS = this.tbSetting.mouseenterCSS;
		image.tbImg.mouseliveCSS = this.tbSetting.mouseliveCSS;		
		image.tbImg.addEvent('mouseenter', this.tbMouseenter);
		image.tbImg.addEvent('mouseleave', this.tbMouseleave);
		image.tbImg.addEvent('click', this.stepTo.pass([i],this));
		
	},
	
	tbMouseenter: function(ignore){
		if(!$defined(ignore) && this.bigImg.msselect === true) return;
		if($defined(this.mouseliveCSS)){
			this.tbDiv.removeClass(this.mouseliveCSS);
		}
		if($defined(this.mouseenterCSS)){
			this.tbDiv.addClass(this.mouseenterCSS);
		}else{
			this.tbDiv.setStyle('opacity', 1)
		}
	},
	
	tbMouseleave: function(){
		if(this.bigImg.msselect ==true) return;
		if($defined(this.mouseliveCSS)){
			this.tbDiv.addClass(this.mouseliveCSS);
		}
		if($defined(this.mouseenterCSS)){
			this.tbDiv.removeClass(this.mouseenterCSS);
		}else{
			this.tbDiv.setStyle('opacity', 0.7)
		}
	},
	
	initSlideBG: function(){
		if(this.slideDuration>0){
			var div =  new Element('div', {
				'class':this.discSetting.sccClassBG,
			    'styles': {
				'position': 'absolute'					
				,'width':  this.containerSize.width
				, 'height': this.containerSize.height
				,'left': 0
				,'top': this.containerSize.width
				,'z-index': this.discSetting.zIndex-1
			    }
			});
			this.divBG=div;
			this.divBG.myEffects = div.effect('top', {wait:true, duration: this.discSetting.duration})
		}
	},
	
	putPlaceHolder: function(){
		if($defined(this.placeholder)){
			var size=null;
			size=Zoom(this.placeholder,this.containerSize.width,this.containerSize.height);
			this.placeholder.setStyles({
									'position': 'absolute'
					,'width':  parseInt(size.width-this.margin*2) 
					, 'height': parseInt(size.height-this.margin*2)
					,'left': parseInt((this.containerSize.width / 2) - ((size.width-this.margin*2) / 2))
					,'top': parseInt((this.containerSize.height / 2) - ((size.height-this.margin*2) / 2))
								});
			var containerDiv=$(this.containerDiv);							
			this.placeholder.inject(containerDiv);
		}
	},
	
	getDescDiv: function(desc){
		var div =  new Element('div', {
			'class':this.discSetting.sccClass,
		    'styles': {
			'position': 'absolute'					
			,'width':  parseInt(this.containerSize.width-this.discSetting.marginLeft) 
//			, 'height': parseInt(this.containerSize.height-this.containerSize.height*this.discSetting.margin*2)
			,'left': parseInt(this.containerSize.width)
			,'bottom': parseInt(this.discSetting.marginBottom)
			,'z-index': this.discSetting.zIndex
		    }
		});
		if($defined(desc))
			div.appendText(desc);
		return div;
	},
	loadComplite: function(){
		if(this.loadCompliteFire === true)
			return;
		this.loadCompliteFire = true;
		var containerDiv=$(this.containerDiv);
		var size=null;
		var desc=null;
		for(i=0;i<this.imageSrc.length;i++){
			size=Zoom(this.imageSrc[i],this.containerSize.width,this.containerSize.height);
			this.imageSrc[i].setStyles({'opacity': 0,position: 'absolute'
					,'width':  parseInt(size.width-this.margin*2) 
					, 'height': parseInt(size.height-this.margin*2)
					,'left': parseInt((this.containerSize.width / 2) - ((size.width-this.margin*2) / 2))
					,'top': parseInt((this.containerSize.height / 2) - ((size.height-this.margin*2) / 2))
					});
			this.imageSrc[i].inject(containerDiv);
			if($defined(this.imageSrc[i].descDiv))
				this.imageSrc[i].descDiv.inject(containerDiv);
		}
		if($defined(this.divBG)){
			this.divBG.inject(containerDiv)
		}
		if(this.isPreloadEmpty()){
			this.next(true);
			this.stopPreloadImg();
		}else{
			this.stopPreloadImg();
			this.next();
		}
			
	},
	showDescDiv: function(){
		if(this.imageIndex>-1){
			if($defined(this.imageSrc[this.imageIndex].descDiv)){
				if(!$defined(this.imageSrc[this.imageIndex].descDiv.myEffects))
					this.imageSrc[this.imageIndex].descDiv.myEffects = this.imageSrc[this.imageIndex].descDiv.effects({wait:true, duration: this.discSetting.duration, transition:Fx.Transitions.Back.easeInOut});

					var dc = this.imageSrc[this.imageIndex].descDiv.getCoordinates();
					this.divBG.myEffects.start(this.containerSize.height - dc.height-this.discSetting.marginBottom)					
				;//.chain(function()
				{
					this.imageSrc[this.imageIndex].descDiv.myEffects.start({'left': [this.containerSize.width, this.discSetting.marginLeft]});
				
				}
				//.bind(this));
			}
		}
	},
	hideDescDiv: function(){
		if(this.imageIndex>-1 &&($defined(this.imageSrc[this.imageIndex].descDiv))){
//			var myEffects = this.imageSrc[this.imageIndex].descDiv.effects({wait:true, duration: this.discSetting.duration, transition:Fx.Transitions.Back.easeInOut});
			var dc = this.imageSrc[this.imageIndex].descDiv.getCoordinates();
			this.imageSrc[this.imageIndex].descDiv.myEffects.start({'left': -this.containerSize.width})
			.chain(function() {
									//this.divBG.myEffects.start(this.containerSize.height).chain(function(){
									this.step(1);
									//}.bind(this));
								}.bind(this));
			
			this.divBG.myEffects.start(this.containerSize.height);
								
		}else{
			this.step(1);
		}
	},
	next: function(set){
		if(this.slideDuration>0){
			this.hideDescDiv();	
			return
		}
		this.step(1,set);
	},
	
	pref: function(){
		this.step(-1);
	},
	
	step:function(dx,set){
		if(this.imageSrc.length==1&&this.imageIndex==0)
		 return;
		if(this.imageSrc.length>0){
			var from = 0;
			var to =0;
			if(this.imageIndex>=0)
				from = this.imageIndex;
			to = (this.imageIndex+dx) % this.imageSrc.length;
			if(to<0){
				to=this.imageSrc.length+to;
			}
			this.stepFromTo(from,to,set);
		}
	},
	
	stepFromTo:function(from,to,set){
		set = set||false;
		this.stopPrev();
		this.imageIndex = to;
		if(set)
			this.stepComplited = false;
		this.currentModification.from = from;
		this.currentModification.to = to;
		if(from!=to){
			this.currentModification.fromFx = this.imageSrc[from].effect('opacity', {duration: this.duration});
			this.imageSrc[from].msselect=false;
			if($defined(this.imageSrc[from].tbImg)){
				this.tbMouseleave.bind(this.imageSrc[from].tbImg)();
			}
			this.currentModification.fromFx.start(0);
		}
		this.currentModification.toFx =  this.imageSrc[to].effect('opacity', {wait:true, duration: this.duration});
		this.imageSrc[to].msselect=true;
		if($defined(this.imageSrc[to].tbImg)){
			this.tbMouseenter.pass([true],this.imageSrc[to].tbImg)();
		}
		if(set){
			this.currentModification.toFx.set(1);
		}else{
			this.currentModification.toFx.start(1).chain(function() {
								if(this.slideDuration>0){
									this.showDescDiv();
									this.CLtimerID = setTimeout(this.next.bind(this), this.slideDuration);								
								}
								this.stepComplited = true;								
							}.bind(this));;		
		}
	},
	stepTo:function(to){
		var from = this.currentModification.to;
		var to =to;
		this.stepFromTo(from,to);
	},	
	stopPrev:function(){
		if (this.stepComplited == false){
			if(this.currentModification.from != this.currentModification.to && $defined(this.currentModification.fromFx)){
				this.currentModification.fromFx.stop();
				this.currentModification.fromFx.set(0);
			}
			if($defined(this.currentModification.toFx)){
				this.currentModification.toFx.stop();
			}
		}
	}	
});


function Zoom(fb,w,h,fit){
		fit = fit===true?fit:false;
		var fbw = fb.width==0?w:fb.width;
		var fbh = fb.height==0?h:fb.height;
		var fbp=1.0*fbh/fbw;
		
		var whp=1.0*h/w;
		if ((fit&&whp<fbp)||(!fit&&whp>fbp)){
			//sprain on width
			var dw=1.0*fbw/w;
			 h=(fbh/dw);			
		}else{
			//sprain on heght
			var dh=1.0*fbh/h;
			w = (fbw/dh);
		}
		return {width:w,height:h};
}


function fixPNG(element)
{
  if (/MSIE (5\.5|6).+Win/.test(navigator.userAgent))
  {
    var src;
	
    if (element.tagName=='IMG') 
    {
      if (/\.png$/.test(element.src)) 
      {
        src = element.src;
        element.src = "/blank.gif"; 
      }
    }
    else 
    {
	  
      src = element.currentStyle.backgroundImage.match(/url\("(.+\.png)"\)/i);
      if (src)
      {
        src = src[1];
        element.runtimeStyle.backgroundImage="none"; 
      }
    }
    if (src) element.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "',sizingMethod='scale')";
  }
}
