/*
	tinyGallery v1.1 - Mootools 1.11 Tiny and Full Ajax gallery.
	by Emmanuel Pire - License: please use it as you like !
*/


var TinyGallery = {};

TinyGallery.Main = new Class({
	
	options: {
		adapterURL : "/typo3conf/ext/ds_estate/res/ajax/tinyGallery.php",
		lang : {
			btn_prev : '<',
			btn_next : '>',
			btn_enlarge: 'Zoom',
			clikToClose:'Click to close'
		},
		size:{
			large_x:300,
			large_y:160
		},
		loaderUrl: '/typo3conf/ext/ds_estate/res/images/tinyGallery_loader.gif'
	},
	
	initialize: function(divObj,options){
		//alert('init');
		this.setOptions(options);
		this.divObj = divObj;
		this.imageObj = divObj.getElement('img');
		this.currentImage = 0;
		this.ajax = {};
		this.fx = {};
		this.allImages = [];
		
		//build toolBar
		this.build();
		
		//get allImages from ajax
		this.divObj.addEvent('mouseover',this.getAllImages.bind(this));
		
	},
	
	getAllImages: function(){
		if(this.ajax.getAllImages==undefined){
			this.ajax.getAllImages = new Ajax(
				this.options.ajax.getAllImages.url,
				{
					method:'post',
					data:this.options.ajax.getAllImages.data,
					onComplete:this.getAllImages_onComplete.bind(this)
				}).request();		
		}
	},
	
	getAllImages_onComplete: function(responseText){
		this.storeImages(responseText);
		
		if(this.allImages.length==1){
			this.btn_next.setStyle('display','none');
			this.btn_prev.setStyle('display','none');
		}
		
		this.fireEvent('onGetAllImagesComplete',this);
		
		this.preload = new Image();
		this.preload.onload = this.setReady.bind(this);
		this.preload.src = this.allImages[1];
		
	},
	
	setReady: function(){
		this.ready = true;
	},
	
	storeImages: function(imgString){
		var t = imgString.split(',');
		if(this.options.imagesBaseUrl){
			for(var i=0;i<t.length;i++){
				this.allImages.push(this.options.imagesBaseUrl+t[i]);
			}		
		}else{
			this.allImages = t;
		}
	},
	
	build: function(){
		var self = this;
		//build
		this.wrapper = new Element('div',{'class':'tinyGallery-wrapper'}).addEvent('mouseover',this.showToolBar.bind(this))
																		 .addEvent('mouseout',this.hideToolBar.bind(this));
		this.toolBar = new Element('div',{'class':'tinyGallery-toolBar',
										  'styles':{'opacity':0}});
		this.btn_next = new Element('div',{'class':'tinyGallery-btn_next'}).setText(this.options.lang.btn_next)
																		   .addEvent('click',this.goNext.bind(this));
		this.btn_prev = new Element('div',{'class':'tinyGallery-btn_prev'}).setText(this.options.lang.btn_prev)
																		   .addEvent('click',this.goPrev.bind(this));
		this.btn_enlarge = new Element('div',{'class':'tinyGallery-btn_enlarge'}).setText(this.options.lang.btn_enlarge)
																				 .addEvent('click',this.enlarge.bind(this));
		
		if(this.options.mainLink || this.divObj.getProperty("link")){
			this.imageObj.addEvent('click',function(){
				window.location = self.divObj.getProperty("link")!=undefined ? self.divObj.getProperty("link") : self.options.mainLink;
			}).setStyle('cursor','pointer');
		}
		
		this.toolBar.adopt([this.btn_prev,this.btn_next,this.btn_enlarge]);		
		this.wrapper.adopt([this.imageObj,this.toolBar]);
		
		this.applyHTML();
	},
	
	applyHTML: function(){
		this.divObj.setHTML('');
		this.divObj.adopt(this.wrapper);
	},
	
	goNext: function(){
		return this.changeImage(this.currentImage+1);
	},
	
	goPrev: function(){
		return this.changeImage(this.currentImage-1);
	},
	
	changeImage: function(index){
		if(index < 0 || !this.ready || index >= this.allImages.length) return false;
		
		//preload
		if(index<this.allImages.length){
			this.preload.src = this.allImages[index+1];
		}
		
		
		this.imageObj.src = this.allImages[index];
		
		this.currentImage = index;
		
		return true;
	},
	
	showToolBar: function(){
		/*
		if(!this.fx.showToolBar){
			this.fx.ToolBarVisibility = new Fx.Style(this.toolBar,'opacity',{duration:200});
		}
		this.fx.ToolBarVisibility.start(1);
		*/
		this.toolBar.setStyle('opacity',1);
	},
	
	hideToolBar: function(){
		/*
		if(!this.fx.hideToolBar){
			this.fx.ToolBarVisibility = new Fx.Style(this.toolBar,'opacity',{duration:200});
		}
		this.fx.ToolBarVisibility.start(0);
		*/
		this.toolBar.setStyle('opacity',0);
	},
	
	enlarge: function(){
		//create loader
		var zoomer = new Element('div',{'class':'tinyGallery-zoomer',
										'styles':this.imageObj.getCoordinates(),
										'title':this.options.lang.clikToClose}).addEvent('click',this.compact.bind(this));
		zoomer.setStyles({
			'position':'absolute',
			'text-align':'center'
		});
		var loader = new Element('img',{'src':this.options.loaderUrl,
										'styles':{'vertical-align':'middle'},
										'class':'tinyGallery-enlargeLoad'});
		zoomer.adopt(loader);
		this.zoomer = zoomer;
		zoomer.injectInside(document.body);
		
		
		//show loader
		this.fx.zoomer = new Fx.Styles(this.zoomer,{duration:500});
		this.fx.zoomer.start({
			'opacity':1
		});
		
		this.loader = new Image();
		this.loader.onload = this.enlarge_2.bind(this);
		this.loader.src = this.allImages[this.currentImage];
		
	},
	
	enlarge_2: function(){
		var e2 = new Fx.Styles(this.zoomer,{duration:500,onComplete:this.enlarge_3.bind(this)});
		var stylesObj = {
			'width':this.loader.width,
			'height':this.loader.height		
		}
		if(this.zoomer.getCoordinates().left.toInt()>(window.getWidth().toInt()/2)){
			stylesObj.left = (this.zoomer.getCoordinates().left.toInt()) - (this.zoomer.getCoordinates().left.toInt() - (window.getWidth().toInt()/2));
		}
		e2.start(stylesObj);
	},
	
	enlarge_3: function(){
		var img = new Element('img',{'src':this.allImages[this.currentImage],
									 'styles':{'opacity':0,
											   'cursor':'pointer'}});
		this.zoomer.getElement('img').remove();
		this.zoomer.adopt(img);
		
		if(this.isOutOfView(this.zoomer)){
			var sw = new Fx.Scroll(window,{offset:{y:-100}});
			sw.toElement(this.zoomer);		
		}
		var t = new Fx.Style(img,'opacity',{duration:400}).start(1);
		this.fireEvent('onEnlargeComplete',this);
	},
	
	compact: function(){
		var t = new Fx.Style(this.zoomer,'opacity',{onComplete:this.unsetZoomer.bind(this)}).start(0);
	},
	
	unsetZoomer: function(){
		this.zoomer.remove();
		this.zoomer = undefined;
	},
	
	isOutOfView: function(el){
		pos = el.getCoordinates();
		if((pos.top.toInt()-this.getScrollTopFix()) + pos.height.toInt() > window.getHeight()){
			return true;
		}
	},

	getScrollTopFix: function(){
		var top = 0;

		if (self.pageYOffset) // all except Explorer
			top = self.pageYOffset;
		else if (document.documentElement && document.documentElement.scrollTop)  // Explorer 6 Strict
			top = document.documentElement.scrollTop;
		else if (document.body)  // all other Explorers
			top = document.body.scrollTop;

		return top;
	}
	
});
TinyGallery.Main.implement(new Events);
TinyGallery.Main.implement(new Options);



window.addEvent("domready",function(){

	var tinyGalleryEls = $$('.tinyGallery');
	if(tinyGalleryEls){
		var DSE_tinyGallery_imagesBaseUrl_local,DSE_tinyGallery_lid_local,DSE_tinyGallery_site_code_local;
		try{
			DSE_tinyGallery_imagesBaseUrl_local = DSE_tinyGallery_imagesBaseUrl;
			DSE_tinyGallery_lid_local = DSE_tinyGallery_lid;
			DSE_tinyGallery_site_code_local = DSE_tinyGallery_site_code;
		}catch(er){}
	
		//get all images with class="tinyGallery"
		$$('.tinyGallery').each(function(item,index){
			var t = new TinyGallery.Main(item,{
				imagesBaseUrl:DSE_tinyGallery_imagesBaseUrl_local,
				mainLink:'/singleview/activimmo/'+item.getProperty('rel')+'/',
				ajax : {
					getAllImages:{
						url : 'typo3conf/ext/ds_estate/res/ajax/tinyGallery.getAllImages.php',
						data:{
							language_id:DSE_tinyGallery_lid_local,
							site_code:DSE_tinyGallery_site_code_local,
							object_uid:item.getProperty('rel')
						}
					}
				}
			});
			t.addEvent('onEnlargeComplete',function(tg){
				tg.zoomer.setStyle('border','none');
			});
		});	
	}

	
});