function JSlideshow(max_files, path) {
	this.max_files = max_files;
	this.path = encodeURIComponent(path);
	this.base_src = 'files.php?action=preview&path=' + this.path;
	this.preload = [
		{
			navigate: 'navigate_left',
			loading: 0,
			disabled: false
		},
		{
			navigate: '',
			loading: 0,
			disabled: false
		},
		{
			navigate: 'navigate_right',
			loading: 0,
			disabled: false
		}
	];
	
	this.current_thumbnail_index = 0;
	this.current_index = 0;
	this.selected_thumbnail = null;
	this.slideshow_timeout = 0;
	
	this.thumbnail_tables = [];
	var s = -800;
	
	var tables = $('thumbnail_strip').immediateDescendants();
	for (var i = 0; i < tables.length; i++)
	{
		var table = tables[i];
		
		table.style.left = s + "px";
		this.thumbnail_tables.push(table);
		s += 800;
		table.style.display = 'table';
	}
	
	this.init();
}

JSlideshow.prototype.thumbnail_loaded = function(table)
{
	var info = this.preload[table];
	info.loading--;
	
	if (info.loading <= 0)
	{
		info.loading = 0;
		
		/* Done with all the loading */
		if (table == 1)
		{
			if (this.preload[0].loading == 0 && !this.preload[0].disabled)
				this.enable_navigation($(this.preload[0]));
			
			if (this.preload[2].loading == 0 && !this.preload[2].disabled)
				this.enable_navigation($(this.preload[2]));
		}
		else if (this.preload[1].loading == 0 && !info.disabled)
		{
			this.enable_navigation(info);
		}
	}
}

JSlideshow.prototype.set_thumbnail = function(table, idx, srcidx)
{
	var tab = this.thumbnail_tables[table];
	var image = tab.getElementsBySelector('img')[idx];
	var src = this.base_src + '&file=' + srcidx;

	this.preload[table].disabled = false;
	this.preload[table].loading += 1;
	
	image.onclick = function()
	{
		this.current_index = srcidx;
		this.display_image();
	}.bind(this);
	
	image.style.cursor = 'pointer';
	
	image.onload = function()
	{
		this.thumbnail_loaded(table);
	}.bind(this);
	
	image.src = src;
}

JSlideshow.prototype.preload_table = function(table)
{
	var tab = this.thumbnail_tables[table];
	var info = this.preload[table];

	var nav = $(info.navigate);	
	this.disable_navigation(info);
	
	var start = this.current_thumbnail_index + (table - 1) * 5;
	var last = Math.min(this.max_files, start + 5);
	var images = tab.getElementsBySelector('img');

	/* Preload specific thumbnail */
	for (var idx = Math.max(0, start); idx < last; idx++)
		this.set_thumbnail(table, idx - start, idx);
	
	/* Set empty images */
	for (var idx = Math.max(0, last - start); idx < 5; idx++)
	{
		images[idx].src = "";
		images[idx].style.pointer = 'default';
	}
}

JSlideshow.prototype.init = function()
{
	/* First load current thumbnails */
	for (var i = 0; i < Math.min(this.max_files, 5); i++)
		this.set_thumbnail(1, i, i);
	
	/* Now preload */
	this.preload_table(0);
	this.preload_table(2);
	this.display_image();

	$('controls').style.visibility = 'visible';	
	$('controls').style.left = (($(document.body).getWidth() - 320) / 2) + 'px';
	
	$('navigate_image_right').onclick = this.navigate_image_right.bind(this);
	$('navigate_image_left').onclick = this.navigate_image_left.bind(this);
	
	$('big_image').onclick = this.image_clicked.bind(this);
	
	$('navigate_image_pause').onclick = this.navigate_pause.bind(this);
	$('navigate_image_play').onclick = this.navigate_play.bind(this);
}

JSlideshow.prototype.swap_tables = function(direction)
{
	/* Direction: -1, right; 1, left */
	var o = this.thumbnail_tables;
	
	if (direction == -1)
	{
		this.thumbnail_tables = [o[1], o[2], o[0]];
		o[0].style.left = '800px';
	}
	else
	{
		this.thumbnail_tables = [o[2], o[0], o[1]];
		o[2].style.left = '-800px'
	}
}

JSlideshow.prototype.move_finished = function(direction)
{
	/* Swap tables in correct position */
	this.swap_tables(direction);
	
	this.current_thumbnail_index -= 5 * direction;

	/* Direction: -1, right; 1, left */
	if (direction == -1)
	{
		this.enable_navigation(this.preload[0]);
		this.preload_table(2);	
	}
	else
	{
		this.enable_navigation(this.preload[2]);
		this.preload_table(0);
	}
	
	this.update_selection();
}

JSlideshow.prototype.do_navigate = function(direction)
{
	this.disable_navigation(this.preload[0]);
	this.disable_navigation(this.preload[2]);
	
	new Effect.MoveBy(this.thumbnail_tables[1], 0, direction * 800, {
		duration: 1
	});
	
	new Effect.MoveBy(this.thumbnail_tables[direction * -1 + 1], 0, direction * 800, {
		duration: 1,
		
		afterFinish: function()
		{
			this.move_finished(direction);
		}.bind(this)
	});	
}

JSlideshow.prototype.navigate_left = function()
{
	this.do_navigate(1);
}

JSlideshow.prototype.navigate_right = function()
{
	this.do_navigate(-1);
}

JSlideshow.prototype.disable_navigation = function(info)
{
	var nav = $(info.navigate);
	
	nav.onclick = '';
	nav.style.cursor = 'default';
	nav.setOpacity(0.3);
	
	info.disabled = true;
}

JSlideshow.prototype.enable_navigation = function(info)
{
	var nav = $(info.navigate);
	nav.onclick = this[nav.id].bind(this);

	nav.style.cursor = 'pointer';
	nav.setOpacity(1);
	
	info.disabled = false;
}

JSlideshow.prototype.display_image = function()
{
	new Ajax.Request('files.php?action=slideshow_info&path=' + this.path + '&file=' + this.current_index, {
		method: 'get',
		onSuccess: function (transport)
		{
			if (transport.status != 200 || transport.responseText == '')
				return;
			
			var items = transport.responseText.split(';', 4);
			var dimensions = $('slideshow').getDimensions();
			
			var dx = (dimensions.width - 30) / parseFloat(items[0]);
			var dy = (dimensions.height - 260) / parseFloat(items[1]);
			
			var times = Math.min(dx, dy);
			
			var width = parseFloat(items[0]);
			var height = parseFloat(items[1]);
			
			if (times < 1)
			{
				width = width * times;
				height = height * times;
			}
			
			var img = $('big_image');
			img.src = "";
			img.style.display = 'none';
			img.style.width = parseInt(width) + 'px';
			img.style.height = parseInt(height) + 'px';

			img.src = items[3];
			img.style.display = 'inline';
			
			$('comment').update(items[2]);
			
			this.update_selection();
		}.bind(this)
	});
}

JSlideshow.prototype.navigate_image_left = function()
{
	if (this.current_index == 0)
		return;
	
	this.current_index -= 1;
	this.display_image();
	
	if (this.current_index + 1 == this.current_thumbnail_index)
		this.navigate_left();
}

JSlideshow.prototype.update_selection = function()
{
	if (this.selected_thumbnail != null)
	{
		this.selected_thumbnail.removeClassName('selected');
		this.selected_thumbnail = null;
	}

	if (this.current_index >= this.current_thumbnail_index && 
	    this.current_index < this.current_thumbnail_index + 5)
	{
		this.selected_thumbnail = $(this.thumbnail_tables[1].getElementsBySelector('img')[this.current_index % 5]);
		this.selected_thumbnail.addClassName('selected');
	}
}

JSlideshow.prototype.navigate_image_right = function()
{
	if (this.current_index >= this.max_files - 1)
		return;
	
	this.current_index += 1;
	this.display_image();
	
	if (this.current_index == this.current_thumbnail_index + 5)
		this.navigate_right();
}

JSlideshow.prototype.image_clicked = function()
{
	window.open($('big_image').src, '_blank');
}

JSlideshow.prototype.navigate_pause = function()
{
	if (this.slideshow_timeout == 0)
		return;
	
	clearTimeout(this.slideshow_timeout);
	this.slideshow_timeout = 0;
}

JSlideshow.prototype.next_timeout = function()
{
	if (this.current_index >= this.max_files - 1)
		return;

	var tm = parseInt($('slideshow_time').value);

	if (isNaN(tm))
		tm = 2;
	
	/* Start preloading */
	var img = new Image()
	img.src = 'files.php?action=image&path=' + this.path + '&file=' + (this.current_index + 1);
	
	this.slideshow_timeout = setTimeout(function()
	{
		this.navigate_image_right();
		this.next_timeout();
	}.bind(this), tm * 1000);
}

JSlideshow.prototype.navigate_play = function()
{
	if (this.slideshow_timeout != 0)
		return;

	this.next_timeout();
}

