var celciusSuperSlideShow = new Class({
	options: {
		siteContainer	: '',
		superContainer	: '',
		showDuration	: '',
		counterTotal	: '',
		counterCurrent 	: '',
		header		: '',
		footer		: '',
		footerContent	: '',
		arrowWidth	: '',
		arrowHeight	: '',
		arrows		: '',
		close		: '',
		start		: '',
		ico_download	: '',
		ico_twitter	: '',
		ico_facebook	: '',
		fubar		: '',
		fubarLink	: '',
		fubarPaging	: ''
	},

	Implements: [Options,Events],

	initialize: function( container, elements, options ){
		this.container 			= $(container);
		this.elements 			= $$(elements);
		this.currentIndex 		= 0;
		this.interval 			= '';
		this.options.showDuration 	= options.showDuration;
		this.options.siteContainer 	= $(options.siteContainer);
		this.options.superContainer 	= $(options.superContainer);
		this.options.counterTotal 	= $(options.counterTotal);
		this.options.counterCurrent	= $(options.counterCurrent);
		this.options.header 		= $(options.header);
		this.options.footer 		= $(options.footer);
		this.options.footerContent	= $(options.footerContent);
		this.options.arrows 		= $$(options.arrows);
		this.options.arrowWidth 	= options.arrowWidth;
		this.options.arrowHeight 	= options.arrowHeight;
		this.options.close		= $(options.close);
		this.options.start 		= options.start;
		this.options.fubar 		= options.fubar;
		this.options.fubarLink		= options.fubarLink;
		this.options.fubarPaging	= options.fubarPaging;
		this.options.ico_download	= $(options.ico_download);
		this.options.ico_twitter	= $(options.ico_twitter);
		this.options.ico_facebook	= $(options.ico_facebook);
		this.theKeyBoard		= '';

		if( this.options.start != "" ){
			newIndex = this.findIndexByKeyValue( this.elements, 'id', this.options.start );
			this.currentIndex = ( $defined(newIndex) ? newIndex : 0 );
			this.options.counterCurrent.set( 'html', ( this.currentIndex + 1 ) );
		}
		this.preload();	

		this.elements.each( function( el, i ){ if( i !== this.currentIndex ){ el.set( 'opacity', 0 ); } }, this );

		this.options.siteContainer.setStyle( 'display', 'none' );
		this.options.counterTotal.set( 'html', this.elements.length );
		this.options.close.addEvent( 'click', function(){ this.close(); }.bind( this ) );

		this.browserwidth 		= $(window).getSize().x;
		this.browserheight 		= $(window).getSize().y;

		$$([this.options.header,this.options.footer]).setStyles({ 'width': this.browserwidth });
		
		this.options.superContainer.setStyles({
			'display'	:'block',
			'width'		: this.browserwidth,
			'height'	: this.browserheight
		});

		this.container.setStyles({
			'width'		: this.browserwidth - ( 2 * this.options.arrowWidth ),
			'height'	: this.browserheight - ( this.options.header.getSize().y + this.options.footer.getSize().y )
		});

		this.options.arrows.setStyle( 'padding-top', Math.ceil( ( ( this.container.getSize().y - this.options.arrowHeight ) / 2 ) ) );
		this.options.footerContent.setStyle( 'margin-left', Math.ceil( ( ( this.browserwidth - this.options.footerContent.getSize().x ) / 2 ) ) );
		
		if( this.options.start != "" ){ this.prepareImage(); }

		this.options.arrows.each( function( el ){
			el.addEvent( 'click', function(){
				this.stop();
				( el.id == "sss_prev" ) ? this.prev() : this.next();
			}.bind( this ) );
		}.bind( this ) );

		this.theKeyBoard = new Keyboard({
		    defaultEventType: 'keydown',
		    events: {
			'esc': function(){ this.stop(); this.close(); }.bind(this),
			'q': function(){ this.stop(); this.close(); }.bind(this),			
			'left': function(){ this.stop(); this.prev(); }.bind(this),
			'down': function(){ this.stop(); this.prev(); }.bind(this),
			'right': function(){ this.stop(); this.next(); }.bind(this),
			'up': function(){ this.stop(); this.next(); }.bind(this)
		    }
		} ).activate();
	},

	show: function(to){
		this.elements[this.currentIndex].fade('out');
		this.currentIndex = ( $defined(to) ? to : ( this.currentIndex < this.elements.length - 1 ? this.currentIndex + 1 : 0 ) );	
		this.prepareImage();
		this.elements[this.currentIndex].fade('in');
		this.options.counterCurrent.set( 'html', ( this.currentIndex + 1 ) );
		
		this.options.ico_download.setProperty( 'href', (this.options.ico_download.getProperty( 'href' ).split("="))[0] + "=" + this.elements[this.currentIndex].getProperty('id') );
		this.options.ico_twitter.setProperty( 'href', this.options.ico_twitter.getProperty( 'href' ).replace( (this.options.ico_twitter.getProperty( 'href' ).split("/")).getLast(), this.elements[this.currentIndex].getProperty('id') ) );
		this.options.ico_facebook.setProperty( 'href', this.options.ico_facebook.getProperty( 'href' ).replace( (this.options.ico_facebook.getProperty( 'href' ).split("/")).getLast(), this.elements[this.currentIndex].getProperty('id') ) );
		
		this.preload();	
	},

	start: function(){
		this.interval = this.show.bind(this).periodical( this.options.showDuration );
	},

	stop: function(){
		$clear(this.interval);
	},

	next: function(){
		nextIndex = ( this.currentIndex < this.elements.length - 1 ? this.currentIndex + 1 : 0 );		
		if( this.elements[nextIndex].hasClass('sss_loaded') ){	
			this.stop();
			this.show();
		}
	},

	prev: function(){
		prevIndex = ( this.currentIndex != 0 ? this.currentIndex - 1 : this.elements.length - 1 );
		if( this.elements[prevIndex].hasClass('sss_loaded') ){	
			this.stop();
			this.show( this.currentIndex != 0 ? this.currentIndex - 1 : this.elements.length - 1 );
		}
	},

	close: function(){
		if( this.options.fubar == "yes" ){
			page 	= 1;
			check 	= ( this.currentIndex + 1 ).toInt();
			if( check > (this.options.fubarPaging).toInt() ){ page = Math.ceil( check/(this.options.fubarPaging).toInt() ); }		
			myURI = new URI( this.options.fubarLink + page + "/" + this.elements[this.currentIndex].id ).go();
		}else{
			this.theKeyBoard.deactivate();		
			this.elements.setStyles({ 'width' : 'auto', 'height' : 'auto', 'padding-left' : '0px', 'padding-top' : '0px', 'opacity' : 1 }).removeClass('sss_ready');
			this.options.arrows.setStyle( 'padding-top', '0px' );
			this.options.counterTotal.set( 'html', '' );
			this.options.counterCurrent.set( 'html', '1' );
			this.options.superContainer.setStyle('display', 'none');
			this.options.siteContainer.setStyle( 'display', 'block' );
			this.currentIndex = 0;
		}			
	},

	findIndexByKeyValue: function( obj, key, value ){
		for( var i = 0; i < obj.length; i++ ){ if( obj[i][key] == value ){ return i; } }
		return null;
	},
	
	preload: function(){
		nextIndex = ( this.currentIndex < this.elements.length - 1 ? this.currentIndex + 1 : 0 );
		prevIndex = ( this.currentIndex != 0 ? this.currentIndex - 1 : this.elements.length - 1 );
		if( this.elements[nextIndex].getProperty('rel') != this.elements[nextIndex].getProperty('src') ){
			this.elements[nextIndex].addEvent( 'load', function(){ this.elements[nextIndex].addClass('sss_loaded'); }.bind(this) );
			this.elements[nextIndex].setProperty( 'src', this.elements[nextIndex].getProperty('rel') );
		}
		if( this.elements[prevIndex].getProperty('rel') != this.elements[prevIndex].getProperty('src') ){
			this.elements[prevIndex].addEvent( 'load', function(){ this.elements[prevIndex].addClass('sss_loaded'); }.bind(this) );
			this.elements[prevIndex].setProperty( 'src', this.elements[prevIndex].getProperty('rel') );
		}		
	},
	
	prepareImage: function(){
		if( ! this.elements[this.currentIndex].hasClass('sss_ready') ){		
			dim_x  = this.elements[this.currentIndex].getSize().x;
			dim_y  = this.elements[this.currentIndex].getSize().y;

			dest_x = this.container.getSize().x;
			dest_y = this.container.getSize().y;
			ratio1 = dim_x / dest_x;
			ratio2 = dim_y / dest_y;
			result1= Math.floor( dim_y / ratio1 );
			result2= Math.floor( dim_x / ratio2 );
			width  = "";
			height = "";

			if( dim_x > dim_y ){
				if( result1 <= dest_y ){ height = result1; }else{ width = result2; }
			}else{
				if( result2 <= dest_x ){ width = result2; }else{ height = result1; }
			}

			if( width != "" ){ this.elements[this.currentIndex].setStyle( 'width', width ); }
			if( height != "" ){ this.elements[this.currentIndex].setStyle( 'height', height ); }

			dim_x  = this.elements[this.currentIndex].getSize().x;
			dim_y  = this.elements[this.currentIndex].getSize().y;

			if( ( dest_x > dim_x ) && ( this.elements[this.currentIndex].getStyle('padding-left') == "0px" ) && ( dim_x > 0 ) ){ 
				this.elements[this.currentIndex].setStyle( 'padding-left', Math.ceil( ( dest_x - dim_x ) / 2 ) ); 
			}

			if( ( dest_y > dim_y ) && ( this.elements[this.currentIndex].getStyle('padding-top') == "0px" ) && ( dim_y > 0 ) ){ 
				this.elements[this.currentIndex].setStyle( 'padding-top', Math.ceil( ( dest_y - dim_y ) / 2 ) ); 
			}

			this.elements[this.currentIndex].addClass('sss_ready');
		}
	}
});