/* toogleinfos beim Overview */
	$$('.toggle').addEvent('click', function(e){
		e.stop(); //don't follow the link
		var el = this.getParent();
		$(el).getElements('.info').each(function(el){
			el.toggle();
			});
		});


	function ajaxsend(urls){
		var req = new Request.HTML({
			method: 'get',
			url: urls
		}).send();
	}
	function ajaxHTML(el,urls,title){
		var upel = el.get('id');
		var req = new Request.HTML({
			method: 'get',
			url: urls,
			onRequest: function() { el.fade('in').empty().addClass('ajax-loading'); },
			update: upel,
			onComplete: function(response) { 
				el.removeClass('ajax-loading');
				slider(el,'in');
				$$("title").set('text','CHILLi Media > '+title);
			}
		}).send();
	}
	function ajaxupdate(el,url){
		el.empty().addClass('ajax-loading');
		el.set('load', {
			onFailure: function(e) { el.set('html', '<b>FEHLER!</b>');},
			onComplete: function(response) { 
			el.removeClass('ajax-loading');
			el.set('html', response);
		}});
		el.load(url);
		slider(el,'in');
		//$('ajaxloader').hide();
	}


	function slider(el,action) {
		var mySlide = new Fx.Slide(el,{mode: 'horizontal',duration: 1500,transition: Fx.Transitions.Back.easeOut}).hide();		
		if (action = 'in') { 
				mySlide.slideIn();
				}
		if (action = 'out') { 
				mySlide.slideOut();
		}
	}

	




	function ajaxRequest(el,url) {
	el.addClass('ajax-loading');
	var myFx = new Fx.Tween(el);
	myFx.start('fade',{duration:1000, fps:50, onComplete:updateContainer(el,url)});
	
}

function updateContainer(el,urls) {
	//new Ajax(url, {update:el, onComplete:fadeInContainer(el,url)}).request();
	var req = new Request.HTML({
			method: 'get',
			url: urls,
			onRequest: function() { alert('GO 2!'); },
			onComplete: function(response) { 
			}
		}).send();
		
}

function fadeInContainer(el,url) {
	el.effect('opacity',{duration:1000, fps:50}).start(0,1);
}


	function fastajax(el,url){
		el.empty().addClass('ajax-loading');
		el.load(url);
		el.removeClass('ajax-loading');
	}
	function senddata(el, urls){
		$('ajaxloader').show();
		var myRequest = new Request({ url: urls });
		myRequest.send();
		var myFx = new Fx.Slide($(el), {
		wait: false,
		duration: 1000,
		offset: {'x': 0, 'y': 0},
		transition: Fx.Transitions.Expo.easeOut
	});
		myFx.slideOut();
		$('ajaxloader').hide();
	}


	function showroom(albumID) {
			
				/**
				* when hovering each one of the images, 
				* we show the button to navigate through them
				*/
			var ps_container = $('ps_container');
			$('psloader').show();
			ps_container.addEvent('mouseenter',function(){
				$('ps_next_photo').show();
			}).addEvent('mouseleave',function(){
				$('ps_next_photo').hide();
			});
			var loadedImages = [];
			ps_container.getChildren('img').dispose();
			
			var jsonRequest = new Request.JSON({url: "../js/getalbum.php?album="+albumID, onSuccess: function(data){
				new Asset.images(data, {
					onProgress: function(i) {
					this.setStyles({
						'position': 'absolute',
						'left': (ps_container.getStyle('width').toInt() / 2) - (this.width.toInt() / 2),
						'top': (ps_container.getStyle('height').toInt() / 2) - (this.height.toInt() / 2)
						});
					loadedImages[i] = this;
					$('psloader').innerHTML = '<h2>Lade Bild Nr. ' +i+'</h2>';
					},
					onComplete: function() {
						ps_container.show().setStyle('visibility','visible').tween('opacity', '1');
						$('ps_close').show();
						//$('ps_overlay').$('srtitle').innerHTML = 'Hier das Beispiel';
						$('ps_overlay').show().setStyle('visibility','visible').tween('opacity', '0.3');
						$('psloader').hide();
						loadedImages.each(function(image, i) {
						image.inject(ps_container,'top');
						var r		= Math.floor(Math.random()*16)-8;
									image.style.WebkitTransform = 'rotate('+r+'deg)';
									image.style.MozTransform = 'rotate('+r+'deg)';
									image.style.OTransform = 'rotate('+r+'deg)';
									image.style.Transform = 'rotate('+r+'deg)';
						});
					}
				});
				}
			}).get();		
		}

//on dom ready...
window.addEvent('domready', function() {


Element.implement({
		fancyShow: function() {
			this.fade('in');
		},
		fancyHide: function() {
			this.fade('out');
		},
		showX: function() {
			this.setStyle('display','');
		},
		hideX: function() {
			this.setStyle('display','none');
		},
		'hover': function(fn1,fn2) {
		this.addEvents({
			'mouseenter': function() {
				this.fade('in');
			},
			'mouseleave': function() {
				this.fade('out');
			}
		})
		},
fadeAndDestroy: function(duration) {
	duration = duration || 600;
	var el = this;
	this.set('tween', {
		duration: duration, height:0
	}).fade('out').get('tween').chain(function() {
		el.dispose();
	});
}});

	$$('div.linktoright a').each(function(el){
		el.addEvents({
			'click': function(e) {
				e.stop();
				this.highlight('#f00');
				var elm = $('inner');
				var tit = this.get('text');
				var url = this.get('href') + '.php?ajax=1';
				ajaxHTML(elm,url,tit);
			}
		});
	});
	
	$$('div.linktoright a img').each(function(img){
		img.set('opacity',0.5).addEvents({
			'mouseover':function(){ this.fade(1); },
			'mouseout':function(){ this.fade(0.5); }
		});
	});



	/* NAVIGATION */
	$$('#navcol li').each(function(el) {
		
	if (el.get('id')!=null) {
		el.setStyle('background','transparent url(/elem/'+el.get('id')+'zahl.png) no-repeat 0px -56px');
		
		var elpf = el.getElement('.pf');
		var elbl = el.getElement('.block');
		var elfr = el.getElement('.fr');
		
		elpf.setStyle('background','transparent url(/elem/navpfeil.png) no-repeat 18px 12px');
		elbl.setStyle('left','0px');
		
		//fx
		var fx = new Fx.Tween(el,{
			duration: 500,
			transition: 'back:in:out',
			link: 'cancel'
		});
		var pf = new Fx.Tween(elpf,{
			duration: 500,
			transition: 'back:in:out',
			offset: {'x': 18, 'y': 12},
			link: 'cancel'
		});
		var bl = new Fx.Tween(elbl,{
			duration: 500,
			transition: 'back:in:out',
			offset: {'x': 0, 'y': 0},
			link: 'cancel'
		});
		
		
		//css & events
		el.addEvents({
			'mouseenter': function(e) {
				e.stop();
				fx.start('background-position','0px 0px');
				pf.start('background-position','6px 12px');
				bl.start('left','12px');
			},
			'mouseleave': function(e) {
				e.stop();
				fx.start('background-position','0px -56px');
				pf.start('background-position','18px 12px');
				bl.start('left','0px');
			}
		});
	}
	});

	
});

window.addEvent('load', function() {
	$('rightcol').setStyle('visibility','visible');
	slider('inner',"in");

	$$('h3.showroom').addEvent('click', function(e){
		e.stop(); //don't follow the link
		//e.highlight('#ff0000');
		var albumID = this.get('id');
		$('ps_screen').show();
		showroom(albumID);
		$(document.body).setStyle('overflow-y','hidden');
	});


				/**
				* close the images view, and go back to albums
				*/
	$('ps_close').addEvent('click',function(){
		$('ps_container').setStyle('visibility','hidden').setStyle('opacity','0').hide();
		$('ps_close').hide();
		$('ps_screen').hide();
		$('ps_overlay').setStyle('visibility','hidden').setStyle('opacity','0').hide();
		$(document.body).setStyle('overflow-y','');
	});
				
				/**
				* navigate through the images: 
				* the last one (the visible one) becomes the first one.
				* we also rotate 0 degrees the new visible picture 
				*/			 
	$('ps_next_photo').addEvent('click',function(){
		var ps_container = $('ps_container');
		var bilder 	= ps_container.getChildren('img');
		var r			= Math.floor(Math.random()*41)-20;
		var current = bilder.getLast();
		var pos = current.getPosition();
		var mover = new Fx.Move(current,{
    		relativeTo: $('ps_container'),
			position: 'upperLeft',
    		edge: 'bottomLeft',
    		offset: {x:-150,y:-150}
			});
		mover.start().chain(function(){
		//Nach hinten setzen
			current.inject(ps_container.getFirst('img'),'before');
		// Wieder auf Null setzen
			mover.start({
    			relativeTo: $('ps_container'),
				position: 'center',
    			edge: 'center',
    			offset: {x:0,y:0}
			});
		}.bind(mover));
	});

});