Grid = Class.create();

Grid.prototype = {
	initialize: function( element, options ) {
		this.element = $( element );
		this.boxes = new Array();

		this.options = {
			text: true
      }
      Object.extend( this.options, options );

		var boxes = this.element.getElementsByClassName( 'link' );

		if( this.options.text ) 
			this.text = this.element.down( '#text' );
		else
			this.text = false;

		boxes.each( function( box ) {
			this.boxes.push( new Grid.Box( box, this.text ) );
		}.bind( this ) );
   }
}

Grid.Box = Class.create();

Grid.Box.prototype = {
	initialize: function( element, text ) {
		this.element = $( element );

		this.img = this.element.down( 'img' );
		this.src = this.img.src;
		this.onsrc = this.src.replace( /.png/, "_on.png" );
		
		var preload = new Image(); 
		preload.src = this.onsrc;

		this.text = text;
		if( this.text ) {
			this.textsrc = this.text.src;
			this.ontextsrc = this.src.replace( /boxes/, "text" );
			preload.src = this.ontextsrc;
		}

		if( !Element.hasClassName( this.element, 'selected' ) ) {
			this.element.onmouseover = this.over.bind( this );
			this.element.onmouseout = this.out.bind( this );
		}
	},

	over: function( event ) {
		this.img.src = this.onsrc;
		if( this.text )
			this.text.src = this.ontextsrc;
	},

	out: function( event ) {
		this.img.src = this.src;
		if( this.text )
			this.text.src = this.textsrc;
	}

}