var holding = Class.create( klydo, {

	title: '',
	contents: Array(),
	
	initialize: function() {	
	
		document.observe( 'dom:loaded', function() {
			
			Event.observe( 'LINKS-about', 'click', function( i ) {
			
				Klydo.holding.show();
			
			});
			
			$( 'popup-close' ).style.cursor = 'pointer';
			
			Event.observe( 'popup-close', 'click', function( i ) {
				
				Klydo.holding.destroy();
			
			});
			
			var element			= document.createElement( 'script' );
				element.src		= 'http://twitter.com/statuses/user_timeline/klydo.json?callback=Klydo.holding.updateTwitter&count=1';
				element.type	= 'text/javascript';
				
			document.getElementsByTagName( 'head' )[0].appendChild( element );
		
		});

	},
	
	relativeTime: function( time ) {
	
		var values		= time.split( ' ' );
		time_value		= values[ 1 ] + ' ' + values[ 2 ] + ', ' + values[ 5 ] + ' ' + values[ 3 ];
		
		var parsed_date	= Date.parse( time_value );
		var relative_to	= ( arguments.length > 1 ) ? arguments[ 1 ] : new Date();
		var delta		= parseInt( ( relative_to.getTime() - parsed_date ) / 1000 );
		delta			= delta + ( relative_to.getTimezoneOffset() * 60 );
		
		if ( delta < 60 ) {
		
			return 'less than a minute ago';
		
		} else if( delta < 120 ) {
		
			return 'about a minute ago';
		
		} else if( delta < ( 60 * 60 ) ) {
		
			return ( parseInt( delta / 60 ) ).toString() + ' minutes ago';
		
		} else if( delta < ( 120 * 60 ) ) {
		
			return 'about an hour ago';
		
		} else if( delta < ( 24 * 60 * 60 ) ) {
		
			return 'about ' + ( parseInt( delta / 3600 ) ).toString() + ' hours ago';
		
		} else if( delta < ( 48 * 60 * 60 ) ) {
		
			return '1 day ago';
		
		} else {
		
			return ( parseInt( delta / 86400 ) ).toString() + ' days ago';
		
		}
	
	},	
	
	updateTwitter: function( json ) {
		
		var twitter	= json[ 0 ];
		var status	= twitter.text.replace( /((https?|s?ftp|ssh)\:\/\/[^"\s\<\>]*[^.,;'">\:\s\<\>\)\]\!])/g, function( url ) {

			return '<a href="'+url+'">'+url+'</a>';
		
		}).replace( /\B@([_a-z0-9]+)/ig, function( reply ) {
		
			return reply.charAt( 0 ) + '<a href="http://twitter.com/' + reply.substring( 1 ) + '">' + reply.substring( 1 ) + '</a>';
		
		});
				
	  	$( 'TWEET' ).innerHTML = status + ' <span>' + this.relativeTime( twitter.created_at ) + ' via <a href="http://twitter.com/klydo" target="_blank">Twitter</a></span>';
		
	},
		
	hideOverlay: function() {
		
		Event.stopObserving( 'popup-overlay', 'click' );
		
		new Effect.Morph( 'popup-overlay', {
			
			style: 'opacity: 0',
			afterFinish: function() {
				
				$( 'popup-overlay' ).style.display = 'none';
			
			}
		
		});
	
	},
	
	destroy: function() {
	
		Event.stopObserving( 'popup-overlay', 'click' );
		
		new Effect.Morph( 'popup-overlay', {
			
			style: 'opacity: 0',
			afterFinish: function() {
				
				$( 'popup-overlay' ).style.display = 'none';
			
			}
		
		});
		
		new Effect.Fade( 'popup-holder', { duration: 0.3, afterFinish:function() { /** $('popup-holder').innerHTML = ''; $( 'popup-holder' ).style.display = 'block'; **/ } });
		
	},
	
	showOverlay: function() {
		
		$( 'popup-overlay' ).style.display = 'block';
		
		new Effect.Morph( 'popup-overlay', {
			
			style: 'opacity: 0.2',
			afterFinish: function() {
			
				Event.observe( 'popup-overlay', 'click', function( i ) {
							
					Event.stopObserving( 'popup-overlay', 'click' );
		
					new Effect.Morph( 'popup-overlay', {
						
						style: 'opacity: 0',
						afterFinish: function() {
							
							$( 'popup-overlay' ).style.display = 'none';
						
						}
					
					});			

					new Effect.Fade( 'popup-holder', { duration: 0.3, afterFinish:function() { /** $('popup-holder').innerHTML = ''; $( 'popup-holder' ).style.display = 'block'; **/ } });

				});
			
			}
		
		});
	
	},
	
	show: function() {
		
		$( 'popup-holder' ).style.visibility = 'hidden';
		$( 'popup-holder' ).show();
		
		var height = document.documentElement.clientHeight;
		    height = ( height / 2 );
		    height = ( height - ( $( 'popup-holder' ).clientHeight / 2 ) );
		    		
		$( 'popup-holder' ).style.top = height + 'px';

		var width = document.documentElement.clientWidth;
		    width = ( width / 2 );
		    width = ( width - ( $( 'popup-holder' ).clientWidth / 2 ) );

		$( 'popup-holder' ).style.left = width + 'px';
		
		$( 'popup-holder' ).style.position = 'fixed';
		$( 'popup-holder' ).style.display = 'none';
		$( 'popup-holder' ).hide();
		$( 'popup-holder' ).style.visibility = 'visible';
		
		new Effect.Appear( 'popup-holder' );
		
		this.showOverlay();
	
	}

});

Klydo.holding = new holding();