var gallery = function( container, props ) {

    var imagePrefix = "item-";
    var imagePath = props.imgPath, urlPath = props.urlPath

    var table = new Element( "table", { "align" : "center" } ).injectInside( container );
    var tbody = new Element( "tbody" ).injectInside( table );

    //-----------------------------------------------
    //Prefetch image
    //-----------------------------------------------
    
    var collection_path = "images/shadow/collection/";
    var collection_images = ['collection_bl.jpg','collection_br.jpg','collection_l.jpg','collection_r.jpg','collection_t.jpg','collection_tl.jpg','collection_tr.jpg'];
    
    var huge_path = "images/shadow/huge/";
    var huge_images = ['light.gif','light.png','shadow-b.jpg','shadow-bl.jpg','shadow-br.jpg','shadow-l.jpg','shadow-r.jpg','shadow-t.jpg','shadow-tl.jpg','shadow-tr.jpg'];
    
    var small_path = "images/shadow/small/";
    var small_images = ['shadow-b.jpg','shadow-bl.jpg','shadow-br.jpg','shadow-l.jpg','shadow-r.jpg','shadow-t.jpg','shadow-tl.jpg','shadow-tr.jpg'];

    for (var i=0;i<collection_images.length;i++) {
        collection_images[i] = collection_path + collection_images[i] ;
    }
    for (var i=0;i<huge_images.length;i++)  {
        huge_images[i] = huge_path + huge_images[i] ;
    }
    for (var i=0;i<small_images.length;i++) {
        small_images[i] = small_path + small_images[i] ;
    }
	
    var loadcollection = Asset.images(collection_images);
    var loadhuge = Asset.images(huge_images);
    var loadsmall = Asset.images(small_images);
	
    //------------------------------------------------
    
	for ( var i=0; i<props.pages; i++ ) {
	
		if( i==0 || i%3==0 ) var tr = new Element( "tr" ).injectInside( tbody );
		
		var td = new Element( "td" ).injectInside( tr );
		
		var anc = new Element( "a", { "href" : urlPath + "item"+(i+1)+".html", "styles" : { "display" : "block" } } ).injectInside( td );
		
		var div = [];
		
		for( var j=0; j<8; j++ ) {
			switch( j ) {
				case 0: div[j] = new Element( "div" ).injectInside( anc ); break;
				default : div[j] = new Element( "div" ).injectInside( div[j-1] );
			}
		}
		
		var image = new Element( "img", { "src" : imagePath + imagePrefix + (i+1) +".jpg" } ).injectInside( div[ div.length-1 ] );
        
		var lightDiv = new Element( "div", { "class": "light", styles : { position : "absolute", top : window.ie6 ? 8 : 6, left : window.ie6? 16 : 15, padding : 0, margin : 0 } } ).injectInside( div[ div.length-1 ] );
//		var lightDiv = new Element( "div", { "class": "light", styles : { position : "absolute", top : 6, left : window.ie6? 0 : 16, padding : 0, margin : 0 } } ).injectInside( div[ div.length-1 ] );
		
	}
    
	$( "gallery-container" ).getElements( "a" ).addClass( "gallery-images" );
	
	$( "gallery-container" ).getElements( "a" ).addEvent( "mouseover", function( ) {

		this.addClass( "hover" );

	} );
	
	$( "gallery-container" ).getElements( "a" ).addEvent( "mouseout", function( ) {
		
		this.removeClass( "hover" );
		
	} );

	if( window.ie6 ) {

		div = [];
		for( var j=0; j<8; j++ ) {
			switch( j ) {
				case 0: div[j] = new Element( "div", { id: "samokie", styles: { width : 157, position: "absolute", display: "none", zIndex: 1 } } ).injectBefore( $( "app" ) ); break;
				default : div[j] = new Element( "div" ).injectInside( div[j-1] );
			}
		}
		
		var mydiv = new Element( "div", { styles : { height : 160, background: "none" } } ).injectInside( div[ div.length-1 ] );
		
		var lightDiv = new Element( "div", { "class": "light", styles : { position : "absolute", top : 6, left : window.ie6? 0 : 16, padding : 0, margin : 0 } } ).injectInside( div[ div.length-1 ] );

	}

//    $$(".light").addEvent('mouseenter', function(evt) {
//        evt.target.setStyle( 'background', 'url( collections/images/shadow/huge/light.gif ) no-repeat center center;');
//    });
//    
//    $$(".light").addEvent('mouseleave', function(evt) {
//        evt.target.setStyle( 'background', 'none');
//    });
}