// JavaScript Document
window.addEvent('domready', function(){

	var g = new Gallery();		
	
	if($chk($('pcats'))){
		var plist = $$("#pcats li");
		plist.each(function(el, i){
			var request = new Request.JSON({
				url: build_action_url('ajax_get_cat_imgs'),
				data: {
					cid: el.get("id").replace("scat", "")
				},
				onComplete: function(rJSON, response) {					
					var json = $H(JSON.decode(response, true));
					if(json["images"].length>0){											
						
						(function(){
							el.getElement('img').fade('out').retrieve('tween').chain(function(){
								new Element('span', {'class': 'img'}).replaces(el.getElement('img'));	
								var sid = el.get("id").replace("sct", "");
								var showFor = $random(2, 4) * 2500;
								var transitionFor = $random(1, 3) * 375;
								window.slides = Slides.start(el.getElement('span[class=img]'), json["images"], {showFor: showFor, transitionFor: 750, rel:el.get("id"), init_mb:false, link:false});
							});
						}).delay(1500);
					}
				}
			}).post();												
		});
	}
	
	function build_action_url(action){
		var url = window.location.href.toURI();
		var data = url.getData();
		data["action"] = action;
		url.setData(data, true);
		return url.toString();
	}
	
});

var Gallery = new Class({

	Implements: [Events, Options],
	
	options:{},

	initialize: function(){
	// init containers, elements
		this.overlay = new Element('div', {'id':'gallery_overlay'}).inject('site_wrapper', 'after');
		this.container = new Element('div', {'id':'gallery_container'}).inject(this.overlay);
		this.close_g = new Element('div', {'id':'gallery_close'}).addEvent('click', function(){this.close_gallery()}.bind(this)).inject(this.container);
		this.loader = new Element('div', {'id':'gallery_loader'}).inject(this.container);
		this.header = new Element('div', {'id':'gallery_header'}).addClass('clearfix').inject(this.container);
		this.images = new Element('div', {'id':'gallery_images'}).inject(this.container);
		this.img_list = new Element('ul').inject(this.images);
		this.current_cat_id = 0;
		this.current_folder_id = 0;
		this.resize_overlay();
		window.addEvent('resize', function(){this.resize_overlay();}.bind(this));
	// init events
		this.cats = [];
		var plist = $$("#pcats li");
		plist.each(function(el, i){
			var cid = el.get("id").replace("scat", "");							
			this.cats.push(cid);
			el.getElement('a').addEvent('click', function(e){
				e.stop();
				this.show_gallery(cid);
			}.bind(this));
		}.bind(this));
	},
	
	resize_overlay: function(){
		var scrollSize = $(window).getScrollSize().y;
		var scrollTop = $(window).getScroll().y;
		this.overlay.setStyles({ 'height':scrollSize+scrollTop,'top':-scrollTop });
	},
	
	show_gallery: function(cid){
		this.overlay.setStyles({'opacity': 0, 'visibility': 'visible'}).fade('in').retrieve('tween').chain(function(){this.loader.fade('in'); this.current_cat_id = cid; this.get_folders();}.bind(this));		
	},
	
	close_gallery: function(){		
		this.overlay.fade('out').retrieve('tween').chain(function(){
			this.header.set('html', '');
			this.img_list.getElements('li').each(function(el){
				el.dispose();											  
			});
			this.current_cat_id = 0;
			this.current_folder_id = 0;
			this.img_list.setStyle('width', 0);
		}.bind(this));	
	},
	
	get_folders: function(){
		var request = new Request.JSON({
			url: this.build_action_url('ajax_get_folders'),
			data: {
				cid: this.current_cat_id
			},
			onComplete: function(rJSON, response) {					
				var json = $H(JSON.decode(response, true));				
				if(json["status"]==1){
					this.header.set('text', '');
					this.header.grab(new Element('h1').set('html', json["cat"]));
					var folders = new Element('ul').addClass('folders');
					json["folders"].each(function(el){
						folders.grab(new Element('li', {'id':'folder' + el["id"]}).grab(new Element('a', {'href':'javascript:void(0);', 'title':el["label"]}).addEvent('click', function(){this.get_images(el["id"]);}.bind(this)).set('html', el["label"])));							  
					}.bind(this));
					this.header.grab(folders);
					if(this.current_folder_id == 0){
						this.current_folder_id = json["folders"][0]["id"];
						this.get_images(this.current_folder_id);
					}
				} else if(json["status"] == 2) {
					this.header.grab(new Element('h1').set('html', json["cat"]));
					this.header.grab(new Element('span', {'class':'notification'}).set('html', json["msg"]));	
					this.loader.fade('out');					
				} else {
					this.header.grab(new Element('span', {'class':'notification'}).set('html', json["msg"]));	
					this.loader.fade('out');					
				}
			}.bind(this)
		}).post();			
	},
	
	get_images: function(folder_id){
		if(this.current_folder_id != 0 && this.current_folder_id != folder_id){
			$('folder'+this.current_folder_id).getElement('a').removeClass('sel');			
		}
		$('folder'+folder_id).getElement('a').addClass('sel');
		this.current_folder_id = folder_id;

		var request = new Request.JSON({
			url: this.build_action_url('ajax_get_imgs'),
			data: {
				fid: folder_id
			},
			onComplete: function(rJSON, response) {					
				var json = $H(JSON.decode(response, true));
				this.img_list.set('html', '');
				this.img_list.setStyle('width', 0);				
				if(this.header.getElement('span')){this.header.getElement('span').dispose();}
				if(json["status"] == 1){
				// images										
					json["images"].each(function(el, k){
						var li = new Element('li', {'id': 'img_' + k}).inject(this.img_list);
						var lbl = el["label"].length == 0 ? " " : el["label"];
						new Asset.image(el["img"], {'alt': lbl, onload: function(i){this.show_img(i, k);}.bind(this)});						
					}.bind(this));
				} else if(json["status"] == 2) {
					this.header.grab(new Element('span', {'class':'notification'}).set('html', json["msg"]));										
				} else {
					this.header.grab(new Element('span', {'class':'notification'}).set('html', json["msg"]));										
				}
				this.loader.fade('out');	
			}.bind(this)
		}).post();			
		
	},
	
	show_img: function(img, k){		
		var li = $('img_' + k).adopt(
										 img,
										 new Element('span').set('html', img.getProperty('alt'))).setStyle('opacity',0);
		li.fade('in');
		var w = this.img_list.getStyle('width').toInt();
		this.img_list.setStyle('width', w+img.getProperty('width').toInt());																			
	},
	
	build_action_url: function(action){
		var url = window.location.href.toURI();
		var data = url.getData();
		data["action"] = action;
		url.setData(data, true);
		return url.toString();
	}

});