var GetWindowSize = function(w) {
        w = w ? w : window;
        var width = w.innerWidth || (w.document.documentElement.clientWidth || w.document.body.clientWidth);
        var height = w.innerHeight || (w.document.documentElement.clientHeight || w.document.body.clientHeight);
		
		if( w.document.body.scrollWidth>width )
			width = w.document.body.scrollWidth;
		if( w.document.body.scrollHeight>height )
			height = w.document.body.scrollHeight;
			
		
        return [width, height]
}
var GetVisibleSize = function(w) {
        w = w ? w : window;
        var width = w.innerWidth || (w.document.documentElement.clientWidth || w.document.body.clientWidth);
        var height = w.innerHeight || (w.document.documentElement.clientHeight || w.document.body.clientHeight);
		
        return [width, height]
}
var GetScrollOffset = function(w) {
        w = w ? w : window;
        var x = w.document.body.scrollLeft;
        var y = w.document.body.scrollTop;
		
        return [x, y]
}
function Gallery(images,imagesBig,className,thumbsRows,thumbsCols,templateWait, templateNoImage, templateImage,tableParent,previewParent,mainDiv,templateImageBig,templateWaitBig )
{
	var loadedImages=new Array();
	

	var changeImage=function(nr) {
		prevImg.showImage(imagesBig[nr]);
	}

	var ImageLoaded=function(destContainer,myTemplateImage,myTemplateNoImage,myTemplateWait,extOnClick) {
	
		var buffer=new Image();
		var templateImageP=new Template(myTemplateImage); 
		
		this.showImage=function(src) {
			if( destContainer==null )
			{
				if( src!=null )
					showImage(src);
			}
			else
			{
				if( src==null || src==undefined )
				{
					destContainer.update(myTemplateNoImage);
					destContainer.onclick=null;
				}
				else
				{
					var img2=new Image();
					img2.src=src;
					if( loadedImages[img2.src] )
					{
						buffer.src=src;
						loaded();
					}
					else
					{
						destContainer.update(myTemplateWait);
						buffer.onload=loaded;
						buffer.src=src;
					}
				}
			}
		}
		var myOnClick=function() {
			extOnClick(nr);
		}
		var loaded=function() {
			loadedImages[buffer.src]=true;
			destContainer.update(templateImageP.evaluate({src:buffer.src}));
			if( extOnClick!=null )
			destContainer.onclick=myOnClick;
		}
		
		var nr=0;
		
		this.setNr=function(n) {	
			nr=n;
		}
	
	}

	var prefix=className;

	
	if( className==null )
		this.cl='gallery';
	else
		this.cl=className;
		
	mainDiv.hide();
	mainDiv.addClassName(this.cl);
	mainDiv.setStyle({position: "absolute", left: 0, top: 55});
	
	
	document.body.appendChild(mainDiv);

	
	var thumbTable=tableParent;

	
	
	var images2dArray=new Array();
	var imagesArray=new Array();
	var i,n=0;
	
	var colsCount=images.length/thumbsRows;
	images2dArray[n]=new Array();
	var tmp1=Math.ceil(images.length/thumbsRows);

	
	for(i=0;i<images.length;i++)
	{
		images2dArray[n][images2dArray[n].length]=i;
		if( (i+1)%tmp1==0 ) {
			n++;
			images2dArray[n]=new Array();
		}
		
	}

	
	var tr;
	n=0;
	for(i=0;i<thumbsRows*thumbsCols;i++)
	{
		if( n==0 ) {
			tr=Element.extend(document.createElement('tr'));
			if( Prototype.Browser.IE )
				thumbTable.tBodies[0].appendChild(tr);
			else
				thumbTable.appendChild(tr);
			n=thumbsCols;
		}

		n--;

		
		var td=Element.extend(document.createElement('td'));
		td.update('&nbsp;');
		td.setStyle({width: "120px", height: "120px"});
		tr.appendChild(td);
		var o=new ImageLoaded(td,templateImage,templateNoImage,templateWait,changeImage);
		
		
		imagesArray[i]=o;
	}
		
		
	
	
	var startCol=0;
		
		
	var prevImg=new ImageLoaded(previewParent,templateImageBig,"",templateWaitBig);
		
	this.left=function() {
		if( startCol==0 )
			return;
			
		startCol--;
		
		genThumbs();
	}
	
	this.right=function() {
		if( (startCol+thumbsCols)>=(images2dArray[0].length) )
			return;
			
		startCol++;
		
		genThumbs();
	}
	
	
	this.close=function() {
	
		Effect.Fade(mainDiv);
		Effect.Fade(overlayBG);
		$(flashDiv).show();
	}
	
	this.show=function() {
		$(flashDiv).hide();
		
		GetVisibleSize[0]

		Effect.Appear(overlayBG);
		
		var tmp1=(GetVisibleSize()[0]-mainDiv.getWidth())/2;
		mainDiv.setStyle({left: tmp1});
		
		
		Effect.Appear(mainDiv);
		scroll(0,0);

	}
	

	
	var genThumbs=function() {
		var row,col;
		var n=0;
		for(row=0;row<thumbsRows;row++)
			for(col=startCol;col<(thumbsCols+startCol);col++)
			{
				if( row>=images2dArray.length )
				{
					imagesArray[n].showImage();
					n++;
					continue;
				}
				if( col>=images2dArray[row].length )
				{
					imagesArray[n].showImage();
					n++;
					continue;
				}
				var i=images2dArray[row][col];
				imagesArray[n].showImage(images[i]);
				imagesArray[n].setNr(i);
				
				n++;
			}
	}
	
	
			var overlayBG = Element.extend(document.createElement('div'));
		overlayBG.setStyle({position: 'absolute', top: 0, left: 0, width: GetWindowSize()[0], height: GetWindowSize()[1], margin: '0 0 0 0'});
		overlayBG.setStyle({textAlign:"center"});
		overlayBG.setStyle({opacity:0.5});
		overlayBG.setStyle({backgroundColor: '#9596db'});
		overlayBG.setStyle({backgroundImage: 'url(\'nrt/tlo2.png\')'});
		overlayBG.setStyle({zIndex: 10});
		overlayBG.hide();
		
		document.body.appendChild(overlayBG);
	genThumbs();
		$(overlayBG).setStyle({zIndex: 20});
		$(mainDiv).setStyle({zIndex: 101});
		

}


function closeImage()
{
	var overlay2=Element.extend(document.getElementById('showImg2Id'));
	overlay2.hide();
	overlay2.remove();
	var overlay=Element.extend(document.getElementById('showImgId'));
	overlay.hide();
	overlay.remove();
}
function showImage(uri)
{
	var totalHeight;
	var totalWidth;
	var visibleWidth;
	var visibleHeight;
	
	var body = document.getElementsByTagName('body')[0];
	
	visibleHeight=body.clientHeight;
	visibleWidth=body.clientWidth;
	
	totalHeight=document.body.scrollHeight;
	totalWidth=document.body.scrollWidth;
	

	var overlay = Element.extend(document.createElement('div'));

	overlay.setAttribute('id','showImgId');
	overlay.setStyle({position: 'absolute', top: 0, left: 0});
	overlay.setStyle({opacity:0.5});
	overlay.setStyle({width:totalWidth});
	overlay.setStyle({height:totalHeight});
	overlay.setStyle({backgroundColor:'black'});
	overlay.setStyle({zIndex:500});
	
	body.appendChild(overlay);	


	var imgWin = Element.extend(document.createElement('div'));
	var img=new Image();
	img.src=uri;
	imgWin.setAttribute('id','showImg2Id');
	imgWin.update('<table style="background-color: #474acb; border: solid 1px #474acb;"><tr><td style="text-align: right;"><a style="text-decoration: none; font-familly: verdana; font-size: 11px; color: #f2f2f2;" href="javascript:closeImage()">zamknij</a></td></tr><tr><td><img src="'+uri+'" style="border: solid 5px white;" onclick="closeImage()" onload="showImageLoaded()"/></td></tr></table>');
	imgWin.setStyle({position: 'absolute', top: 0, left: 0});
	imgWin.setStyle({opacity:1});
	imgWin.setStyle({zIndex:500});

	

	imgWin.hide();
	body.appendChild(imgWin);
	
	


}
function showImageLoaded()
{
	visibleHeight=document.body.clientHeight;
	visibleWidth=document.body.clientWidth;
	
	totalHeight=document.body.scrollHeight;
	totalWidth=document.body.scrollWidth;

	var imgWin=Element.extend(document.getElementById('showImg2Id'));
	
	var t=visibleHeight/2-imgWin.getHeight()/2+document.body.scrollTop;
	if( t<=0 ) t=10;
	imgWin.setStyle({left: (visibleWidth/2-imgWin.getWidth()/2+document.body.scrollLeft),top: t});
	
	
	Effect.Grow(imgWin);
}
