var scrollGallery = new Class({
	
	Implements: [Events, Options],
  
	options: {
		start: 0,
		area: 250,
		speed: 0.1,
		position: null,
		n_photos : 0,
		width_photo: 640,
		margin_photo: 15,
		width_photo_thumb: 79,
		margin_photo_thumb: 5,
		thumbarea: 'flicker_gallery_photos_scroll_thumb_area',
		imagearea: 'flicker_gallery_photos_scroll_area',
		imageareaContent: 'flicker_gallery_photos_scroll_area_content',
		thumbareaContent: 'flicker_gallery_photos_scroll_thumb_area_content',
		scrollimageareaFxObj: null,
		imageObj:  new Array(),
		scrollthumbareaFx: null
	},
  
	initialize: function(element,options){
		this.setOptions(options);		
		Scroller.implement(new Events, new Options);
		this.tumbObjs=null;
		this.imgObjs=null;
		// FX
		this.options.scrollimageareaFxObj = new Fx.Scroll(this.options.imagearea, {
			offset: {
				x: 0,
				y: 0
			} 
		});
		// Init Thumb-Images
		if($(this.options.thumbarea)){
			this.options.scrollthumbareaFx = new Scroller($(this.options.thumbarea), {area: this.options.area, velocity: this.options.speed, direction: "x"});
			$(this.options.thumbarea).setStyle('overflow-x', 'hidden')
			// Thumb Events
			$(this.options.thumbarea).addEvent('mouseenter', this.options.scrollthumbareaFx.start.bind(this.options.scrollthumbareaFx));
			$(this.options.thumbarea).addEvent('mouseleave', this.options.scrollthumbareaFx.stop.bind(this.options.scrollthumbareaFx));
			// Init tumbObjs
			this.tumbObjs = $(this.options.thumbarea).getElements('img');
			this.options.n_photos=this.tumbObjs.length;
			$(this.options.imageareaContent).setStyle('width',this.options.n_photos*(this.options.width_photo + this.options.margin_photo));
			$(this.options.thumbareaContent).setStyle('width',this.options.n_photos*(this.options.width_photo_thumb + this.options.margin_photo_thumb));
			Array.each(this.tumbObjs, function(imgObjekt, index){
				this.options.imageObj[index]=imgObjekt;
				imgObjekt.addEvent('click', function(index){
					this.options.position=index;
					$('flicker_gallery_photos_counter').set('html',(index+1)+'/'+this.options.n_photos);
					this.options.scrollimageareaFxObj.toElement(this.imgObjs[index]);
				}.bind(this).pass(index));
				if(index==this.options.start){
					// Delay for safari
					imgObjekt.fireEvent('click',this,10);
				}
			}.bind(this));
		}else{
			alert('Missing thumbarea');
		}
		// Init Images
		if($(this.options.imagearea)){
			$(this.options.imagearea).setStyle('overflow', 'hidden');
			$(this.options.imagearea).setStyle('overflow-x', 'hidden');
			// Init imgObjs
			this.imgObjs=$(this.options.imagearea).getElements('img');
		}else{
			alert('Missing imagearea');
		}
		// Check
		if(this.imgObjs.length!=this.tumbObjs.length){
			alert("Error: The number of images do not match!");
		}
		$('flicker_gallery_photos_button_left').addEvent('click', function(event){ 
			if (this.options.position>=1) {
				this.options.imageObj[this.options.position-1].fireEvent('click');
			} else {
				this.options.imageObj[this.options.n_photos-1].fireEvent('click');
			}
		 }.bind(this));
		 $('flicker_gallery_photos_button_right').addEvent('click', function(event){ 
			 if (this.options.position<(this.options.n_photos-1)) {
				this.options.imageObj[this.options.position+1].fireEvent('click');
			 } else {
				this.options.imageObj[0].fireEvent('click');
			 }
		 }.bind(this));
	}
	
});
		

// Manager
var FlickrManager = {
	
	api_key: "44df4b12a47ed13c312510fe2d1effe1",
	box_photo_number: 9,
	box_photo_per_line: 3,
	box_photoset_id: '72157628104163278',
	
	init: function(){
		// Local Variable
		var host = window.location.host;
		var rand = Math.floor(10000 * Math.random());
		// Box
		if($$('.pictures_gallery_box_content') && $$('.pictures_gallery_box_content').length > 0){
			var link_php_flickr_box ='http://'+host+'/fileadmin/corvatsch/php/flickr/flickr_cntr.php?type=flickr_box&photoset_id='+FlickrManager.box_photoset_id+'&photo_number='+FlickrManager.box_photo_number+'&photo_per_line='+FlickrManager.box_photo_per_line+'&rand='+rand;
			var req_flickr = new Request({   
				url: link_php_flickr_box,     
				method: 'get',    
				onComplete: function(response) { 
					$$('.pictures_gallery_box_content').each(function(box){
						$(box).set('html',response);	
						Mediabox.scanPage();	
					});
				}
			}).send();
		}
		
		// Scroll Gallery
		if($('flickr_photoset_ids')){
			var flickrSetListId = null;
			if($('flickr_photoset_ids')){
				flickrSetListId = $('flickr_photoset_ids').get('value').split(",");
			}
			var flickrSetListText = null;
			if($('flickr_photoset_decriptions')){
				flickrSetListText = $('flickr_photoset_decriptions').get('html').split("###SEPARATOR###");
			}
			var slide_set = new noobSlide({
				box: $('flicker_gallery_album_set_mask'),
				items: $$('#flicker_gallery_album_set_mask .flicker_gallery_album_set_item'),
				size: 464,
				interval: 1000,
				startItem: 0,
				addButtons: {
					previous: $('flicker_gallery_album_button_left'),
					next: $('flicker_gallery_album_button_right')
				},
				onWalk: function(currentItem,currentHandle){
					if ($('flicker_gallery_photos_scroll')) {
						$('flicker_gallery_photos_scroll').empty();
						var link_php_flickr_gallery = 'http://'+host+'/fileadmin/corvatsch/php/flickr/flickr_cntr.php?type=flickr_gallery&photoset_id='+flickrSetListId[this.currentIndex]+'&rand='+rand;
						var req_flickr = new Request({   
							url: link_php_flickr_gallery,     
							method: 'get',    
							onComplete: function(response){  		
								$('flicker_gallery_photos_scroll').set('html',response);
								$('flicker_gallery_photos_button_left').removeEvents('click');
								var scrollGalleryObj = new scrollGallery();
								Mediabox.scanPage();		
							}
						}).send();	
					}
				}
			});	
		}
	}
	
};


// Mootools DOM ready
window.addEvent('domready', function(){
		FlickrManager.init();
	}
);