var ThreeLines = {};
ThreeLines.Line = Class.create({
	initialize: function(){
		this.lineElem = new Element( 'div' );
		this.lineElem.addClassName('line');
		this.lineElem.hide();
		$('main').appendChild( this.lineElem );
	
		this.init();
	},

	MAX_SIZE: 300,

	init: function( aBaseColor ){
		// I hate math!! X(
		this.moveValue = Math.floor( Math.random() * 10 ) - 5;
		if( this.moveValue == 0 ) 
			this.moveValue = 1;
		this.sizeValue = Math.floor( Math.random() * 10 ) - 5;
		if( this.sizeValue == 0 )
			this.sizeValue == 1;

		this.opacityValue = ( Math.random() * 0.05 - 0.025 );
		if( this.opacityValue == 0 )
			this.opacityValue == 0.1;
		

		this.position = Math.floor( Math.random() * ( $('main').getHeight() - 10 ) );
		this.size = Math.floor( Math.random() * ( $('main').getHeight() - this.position ) );
		this.opacity = Math.random();

		this.updateElem();
	},

	setBaseColor: function( aBaseColor ){
		this.lineElem.style.backgroundColor = aBaseColor;
	},

	show: function(){
		this.lineElem.show();
	},

	hide: function(){
		this.lineElem.hide();

	},

	act: function(){
		this.position += this.moveValue;
		this.size += this.sizeValue;
		if( this.size < 0 ){
			this.size = 0;
		}

		this.opacity += this.opacityValue;

		if( this.size <= 0 ){
			this.sizeValue = this.sizeValue.abs();
		} else if( this.size >  $('main').getHeight() - this.position - 10 ){
			this.sizeValue = this.sizeValue.abs() * -1;
		}

		if( this.position < 0 ){
			this.moveValue = this.moveValue.abs();
		}
		else if ( ( this.position + this.size ) > $('main').getHeight() - 10 ){
			this.moveValue = this.moveValue.abs() * -1;

			if( ( this.sizeValue.abs() > this.moveValue.abs() ) && this.sizeValue > 0 ){
				this.sizeValue = this.sizeValue.abs() * -1;
			}
		}

		if( this.opacity < 0 || this.opacity > 1 ){
			this.opacityValue *= -1;
		}

		this.updateElem();
	},

	updateElem: function(){
		this.lineElem.setStyle( {
			height: ThreeLines.getStyleSize( this.size ),
			top: ThreeLines.getStyleSize( this.position )
		} );
		this.lineElem.setOpacity(this.opacity);
	}
});

ThreeLines.Prop = {
	initialize: function(){
		this.lineIndex = 0;

		Event.observe($('colors'), 'click', this.onclick_color.bindAsEventListener(this) );
		Event.observe($('start'), 'click', this.onclick_start.bindAsEventListener(this) );
		Event.observe($('reset'), 'click', this.onclick_reset.bindAsEventListener(this) );
	},	

	show: function(){
		this.lineIndex = 0;
		Effect.Appear( $('prop') );
		$('start').removeClassName('FOCUS');
		$('color0').addClassName('FOCUS');
	},

	onclick_color: function( aEvent ){
		var elem = Event.element( aEvent );
		if( elem.tagName == 'LI' && this.lineIndex < 3 ){
			var color = elem.style.backgroundColor;
			var colorElem = $('color' + this.lineIndex);
			colorElem.style.backgroundColor = color;
			colorElem.removeClassName('FOCUS');
			ThreeLines.Main.setLine( this.lineIndex, color );
			this.lineIndex++;

			if( $('color' + this.lineIndex) ){
				$('color' + this.lineIndex).addClassName('FOCUS');
			}
			else {
				if( ThreeLines.Main.working ){
					Effect.Fade( $('prop') );
				}
				else {
					Effect.Appear( $('buttons'), { 
						duration: 0.5
					} );
					setTimeout( function(){ 
						$('title').hide(); 
						$('copyright').hide();
					}, 10 );
					
					$('start').addClassName('FOCUS');
				}
			}
		};
	},

	onclick_start: function(){
		ThreeLines.Main.start();
		Effect.Fade( $('prop') );
	},

	onclick_reset: function(){
		$('buttons').hide();
		this.lineIndex = 0;
		$('color0').addClassName('FOCUS');
		$('start').removeClassName('FOCUS');
	}
}

ThreeLines.Main = {
	lines: [],
	initialize: function(){
		for( var i = 0; i < 3; i++ ){
			var line = new ThreeLines.Line();
			line.init();
			this.lines[this.lines.length] = line;
			
		}

		ThreeLines.Prop.initialize();
		ThreeLines.Prop.show();
		this.resize();

		Event.observe( window, 'resize', this.resize.bind( this ) );
	},

	working: false,

	setLine: function( aIndex, aColor ){
		this.lines[aIndex].setBaseColor(aColor);
	},

	start: function(){
		if( ! this.working ){
			this.lines.each( function(item){
				item.show();
			});

			this.timer = setInterval( this.act.bind( this ), 50 );
			this.working = true;
		}
	},

	stop: function(){
		clearInteval( this.timer );
	},

	act: function(){
		this.lines.each( function(item){
			item.act();
		} );
	},

	resize: function(){
		$('main').style.height = ThreeLines.getStyleSize( ThreeLines.getDocumentSize().height );
	}
};

ThreeLines.getStyleSize = function( aValue ){
	return aValue == 0 ? 0 : aValue + 'px';
};

// From LUNARR :P
ThreeLines.getDocumentSize = function(){
  var result = { width: 0, height: 0 };

  if( Prototype.Browser.Opera  ) {
    result.width = window.innerWidth;
    result.height = window.innerHeight;
  }
  else {
    if( document.compatMode == 'CSS1Compat' ) {
      result.width = document.documentElement.clientWidth;
      result.height = document.documentElement.clientHeight;
    }
    else {
      result.width = document.body.clientWidth;
      result.height = document.body.clientHeight;
    }
  }
  return result;
};

Event.observe( window, 'load', function(){
	ThreeLines.Main.initialize();
} );