// JavaScript Document
// thumbs to display per page
var per_page = 6;
var screen_window;
		
// thumb page class
function thumbPage(num_screens, per_page, thumb_config)
{
	this.thumbs = new Array(num_screens);
	this.num_screens = num_screens;
	this.per_page = per_page;
	this.cur_page = 1;
	this.num_pages = 1;
	this.thumb_dir = '/image_gallery/thumbs/';
	this.mid_dir = '/image_gallery/mid/';
	this.pic_dir = '/image_gallery/pictures/';
	this.page_location = 'index.html';
	this.screen_prefix = '';
	this.screen_ext = '.jpg';
	this.no_img_msg = '<div style="text-align: center; font-style: italic;">There are no screenshots to display at this time.</div>';
	
	this.thumb_selected = '/images/ss_thumb_overlay.gif';
	this.thumb_unselected = '/images/ss_thumb_overlay.gif';
	this.current_mid_id = -1;
	
	this.mid_next_id = 0;
	this.mid_previous_id = 0;

	this.thumbs = my_pics;
	this.first_thumb_displayed = -1;
	this.last_thumb_displayed = this.thumbs.length - 1;
	
	// class functions
	this.page_nav = thumbPage_nav;
	this.move_page = move_pages;
	this.output = thumbPage_output;
}

function thumbPage_nav()
{
	this.num_pages = Math.ceil(this.thumbs.length / this.per_page);
	var output = '';
	var upper_nav_output = '';
	if(this.num_pages > 1)
	{
		// back
		upper_nav_output += (this.cur_page > 1) ? '<a href="#p1" onClick="javascript: my_thumb_page.move_page(' + (this.cur_page - 1) + ');"><b>BACK</b></a> &nbsp;' : '';
	
		for(i = 1; i <= this.num_pages; i++)
		{
			upper_nav_output += (i > 1 && i < this.thumbs.length) ? ' ' : '';
			upper_nav_output += (i == this.cur_page) ? '<span style="font-weight: bold;">[ ' + i + ' ]</span>' : '<a href="#p1" onClick="javascript: my_thumb_page.move_page(' + i + ');">[ ' + i + ' ]</a>';
		}
		
		upper_nav_output += (this.cur_page < this.num_pages) ? ' &nbsp;<a href="#p1" onClick="javascript: my_thumb_page.move_page(' + (this.cur_page + 1) + ');"><b>NEXT</b></a>' : '';
		output += upper_nav_output;
		output += '';
	}
	//document.getElementById("upper_thumb_nav").innerHTML = upper_nav_output;
	document.getElementById("ss_nav").innerHTML = output;
}

function move_pages(page)
{
	this.output(page);
	show_mid(my_thumb_page.first_thumb_displayed);
}

function thumbPage_output(cur_page)
{
	this.current_mid_id = -1;
	this.cur_page = cur_page;
	var thumb_output = '';
	var per_row = 3;
	var cur_element = 1;
	var page_start_index = ((this.cur_page * this.per_page) - this.per_page);
	this.first_thumb_displayed = -1;
	
	for(i = page_start_index; i < this.thumbs.length; i++)
	{
		if((i+1) <= (this.cur_page * this.per_page))
		{
			this.first_thumb_displayed = (this.first_thumb_displayed == -1) ? i : this.first_thumb_displayed;
			this.last_thumb_displayed = i;
			
			//var margin_style = (cur_element == per_row) ? '' : '';
			var this_quote = this.thumbs[i].quote.split('[--sub_by_sep--]');
			var this_title = (this_quote[1].length > 0) ? this_quote[1] : '&nbsp;';
			this_quote = this_quote[0].replace("&#39;", "&rsquo;");
			
			var mouse_over = (this_quote.length > 0) ? ' onmouseover="return escape(\'' + this_quote + '\');"' : '';
			this_img_src = this.thumb_dir + this.thumbs[i].name + this.screen_ext;
			thumb_output += '<div class="thumbWrap"><div class="thumbTitle">' + this_title + '</div><div class="thumb_box" style="background: url(' + this_img_src + ');"><a href="javascript:view_screen(' + i + ');"><img src="/images/ss_thumb_overlay.gif" border="0" id="' + this.thumbs[i].name + '" ' + mouse_over + '></a></div></div>';
			if(cur_element == per_row)
			{
				thumb_output += '<div style="clear:both; font-size: 8px;">&nbsp;</div>';
				cur_element = 1;
			} else {
				cur_element++;
			}
		}
	}
	
	thumb_output += (cur_element != 1) ? '<div style="clear:both;">&nbsp;</div>' : '';
	this.page_nav();
	
	document.getElementById("thumbs_container").innerHTML = (this.num_screens > 0) ? thumb_output : this.no_img_msg;
	tt_Init();
}

function view_screen(id)
{		
	selected_id = id;
	new_window = window.open("/image_gallery/screen_window.html", "ImageBrowser", "width=900,height=730,status=0");
	new_window.selected_id = id;
	new_window.my_pics = my_pics;
	new_window.focus();
}

function show_mid(my_id)
{

}

function set_next_prev(id)
{
	my_thumb_page.mid_next_id = ((id + 1) >= my_pics.length) ? 0 : (id + 1);
	my_thumb_page.mid_previous_id = ((id - 1) >= 0) ? (id - 1) : (my_pics.length - 1);
}

function show_mid_next()
{

	// page forward
	if(my_thumb_page.mid_next_id < my_thumb_page.first_thumb_displayed || my_thumb_page.mid_next_id > my_thumb_page.last_thumb_displayed)
	{
		if(my_thumb_page.cur_page + 1 <= my_thumb_page.num_pages)
		{
			my_thumb_page.output(my_thumb_page.cur_page + 1);
		} else {
			my_thumb_page.output(1);
		}
	}
	show_mid(my_thumb_page.mid_next_id);
}

function show_mid_previous()
{
	if(my_thumb_page.mid_previous_id < my_thumb_page.first_thumb_displayed || my_thumb_page.mid_previous_id > my_thumb_page.last_thumb_displayed)
	{
		// page back
		if(my_thumb_page.cur_page - 1 > 0)
		{
			my_thumb_page.output(my_thumb_page.cur_page - 1);
		} else {
			my_thumb_page.output(my_thumb_page.num_pages);
		}
	}
	show_mid(my_thumb_page.mid_previous_id);
}

function to_main_screen()
{
	output = '<div id="to_main_screen_container"><a href="screenshots.html"><img src="/images/pds/btn_list.gif" border="0"></a></div>';
	document.write(output);
}
/*
//----------------------------------------- page output
var my_thumb_page = new thumbPage(my_pics.length, per_page);

my_thumb_page.output(1);
// display first thumb as mid
if(my_pics.length > 0)
{
	show_mid(0);
}
*/