// JavaScript Document
// Author: Piotr Lukow vel Broniszewski

function GalleryPictureView(id, pictures)
{
	this.id = id;
	var actualPictureIndex = 0;
	this.pictures = pictures;
	

	
	this.right = function()
	{
				
		if (actualPictureIndex != (this.pictures.length - 3))
		{
			actualPictureIndex++;
			this.redrawGallery();
		}
	}
	
	this.left = function()
	{
	
		if (actualPictureIndex != 0)
		{
			actualPictureIndex--;	
			this.redrawGallery();
		}
		
		this.redrawGallery();
	}
	
	this.generateHtml = function()
	{
		
		var html = '';
		
		if (this.pictures.length > 2 && actualPictureIndex != 0)
		{
			html += '<div style="display:none;">';
 				for (var i = 0; i < actualPictureIndex; i++){
					html += this.getLink(i);
				}
			html += '</div>';
			
		}
		
		html += '<table id="' + this.id + '_tab" border="0" width="100%"><tr><td id="leftField" width="12.5%" align="center">';
		if (actualPictureIndex != 0)
		{
			html += '<input class="buttonGallery" type="button" onclick="javascript:'+ this.id +'.left();initLytebox();" alt="Przesun w lewo" value="|&lt;&lt;"/>';
		}
		
		html += '</td>';
		
		for (var i=0; (i < this.pictures.length) && (i < 3); i++)
		{
			var index = i + actualPictureIndex;
			html += '<td id="field'+ i +' width="25%">' + this.getLink(index) + '</td>';
		}

		html += '<td id="rightField" width="12.5%" align="center">';
		if (actualPictureIndex != (this.pictures.length -3) && this.pictures.length > 2)
		{
			html += '<input class="buttonGallery" type="button" onclick="javascript:'+ this.id +'.right();initLytebox();" alt="Przesun w prawo" value="&gt;&gt;|" />';
		}
		html += '</td></tr></table>';
		
		if (this.pictures.length > 2 )
		{
			html += '<div style="display:none">';
			
			for (var i = actualPictureIndex + 3; i < this.pictures.length; i++)
			{
				html += this.getLink(i);
			}
			
			html += '</div>';
		}
		
		html += '<br/><div id="picDesc" align="center"></div>';
		return html;
	}
	
	this.getLink = function(index)
	{
			
			var html = '<a href="' + this.pictures[index][0] + '" ';
			html += 'rel="lytebox[' + this.pictures[index][2] +']" ';
			html += 'title="' + this.pictures[index][3] + '">';
			html += '<img src="' + this.pictures[index][1] + '" border="0" onmouseover="javascript:document.getElementById(\'picDesc\').innerHTML=\'' + this.pictures[index][3] +'\';" onmouseout="javascript:document.getElementById(\'picDesc\').innerHTML=\'\';"/>';
			html += '</a>';	
			return html;
	}

	this.drawGallery = function()
	{
		var html = '<form action="javascript:void(0)" id="' + this.id + '">';
		html += this.generateHtml()+'</form>';
		
		document.write(html);
	}
	
	this.redrawGallery = function()
	{
		var html = this.generateHtml();
		document.getElementById(this.id).innerHTML = html;
	}
	
}