/*
		TODO LIST
		
	ok - MORE ROWS WHEN POSSIBLE
	ok - LARGE VIEW: NEED TO REMOVE PREVIOUS OR NEXT
	ok - LARGE HANDLING OF NEXT / PREVIOUS
	ok - KEEP LARGE VIEW WHEN RESIZE
	ok - SHOW ALL INFO
	ok - DEBUG MOZILLA BAR
	ok - INLINE INFO
	ok - IMPROVE PRELOAD
	ok - CLEAN UP PRELOAD / INFO
	ok - OPERA COMPATIBILITY
	ok - PHP SCRIPT CREATING A LIST
	
	Fix:	ok - Page number bug
			ok - Long text problem (image description)
			ok - Add Footer first line for ALL images
	ok - Add contact name
	ok - Add programming + explanation page?

	ok - Fix:	Orientation / Size of "please wait" Thumb and Image...
	ok - Fix:	Hard coded title - need to be changed

	OK - TRY WITH PARIS :)

	ONE LINE VIEW MODE
	{
		Scroll thumb right / left automaticaly using location of mouse cursor
		Popview for large images
	}


	SORT BY FUNCTION? (Date?, Name?)
	CODE COMMENT 
	TEST ONLINE
	
	// Works fine; To be added in some preference:	SEVERAL STYLE COLOR?
	
	SEVERAL STYLE ?
	PHONE (SMALL RES) HANDLING?
		
	CLEAN UP
	ERROR MANAGEMENT	
	
	LARGE HANDLING OF INDEX ? EFFECT ?
*/

var 	ImageLibrary = 0;
var		galleryInfo = 0;
var 	inlineInfo = 0;
var		root_element = 0;

function gallery_setup()
{
	ImageLibrary.make_fake_ones();
	
	gallery_set_default(4,0,160,160, ImageLibrary.getCount());
	
	window.onresize = my_reload;
	window.onload = my_reload;
	
	init_mouse_event();
	
	my_reload();
	
//	alert( css_get_color(0) );
}

/*
*/
function css_get_color(id)
{
	if( browser == 'ie' ) return document.styleSheets[0].rules[id].style.color;
	return document.styleSheets[0].cssRules[id].style.color;
}
/*
	list of thumb (url)
	list of large (url)
	list of w,h thumb		?
	list of w,h size url	
	exif?
	
	list of comment 1 (header)
	list of comment 2 (footer)	
*/

function cInfo()
{
	cInfo.prototype.width = 0;
	cInfo.prototype.height = 0;
	cInfo.prototype.size = 0;
	cInfo.prototype.date = 0;
	cInfo.prototype.time = 0;
	cInfo.prototype.name = 0;
	cInfo.prototype.url = 0;	
	cInfo.prototype.header = null;
	cInfo.prototype.footer = null;	
}

function cImage(id)
{
	this.id = id;
	this.info_thumb = new cInfo();
	this.info_image = new cInfo();	
	
	cImage.prototype.set_thumb = function( url, w, h, size )
	{
		i = this.info_thumb;
		i.url = url;
		i.width = w;
		i.height = h;
		i.size = size;		
	}

	cImage.prototype.set_image = function( url, w, h, size )
	{
		i = this.info_image;
		i.url = url;
		i.width = w;
		i.height = h;
		i.size = size;
	}

	cImage.prototype.set_exif = function( s1, s2 )
	{
		i = this.info_image;	
		i.header = s1;
		i.footer = s2;
			
		name = new String( i.url );
		var a1 = name.lastIndexOf("/");
		var a2 = name.length;
		if( a1 == -1 ) a1 = 0;
		else			a1 += 1;

		i.date = "02/24/2008";
		i.name = name.slice(a1,a2);
	}

	// obj.set_exif2(img_def[9], img_def[10], img_def[11], img_def[12], img_def[13] );
	cImage.prototype.set_exif2 = function( s1, s2, s3, s4, s5, s6)
	{
		i = this.info_image;	
		i.name = s1;
		i.header = s2;

		var		new_line = "\n";
		if( browser == 'ie' ) new_line += "\r";

		i.footer = s3 + new_line + s4;
		
		i.date = s5;
		i.time = s6;		
	}

				
	cImage.prototype.set_next = function( obj )		{	this.next = obj;	}
	cImage.prototype.set_previous = function( obj )		{	this.previous = obj;	}	
}

var	jpeg_elm = new Array();

/* --------------------------------------

*/
function search_jpeg(elm)
{
	while( elm != null )
	{
		if( elm.id == "jpeg" )	jpeg_elm.push(elm);

		if( elm.hasChildNodes() ) search_jpeg( elm.firstChild );

		elm = elm.nextSibling;
	}
}


/* --------------------------------------

*/
var static_finding = null;

function search_elm(elm, id)
{
	while( elm != null )
	{
		if( elm.id == id )	static_finding = elm;

		if( elm.hasChildNodes() ) search_elm( elm.firstChild, id);
		elm = elm.nextSibling;
	}
}

/* ----------------------------------------------------------------------
*/
function cImageRef()
{
	// Current image #
	cImageRef.prototype.current = -1;

	// Image counter
	cImageRef.prototype.count = 0;
	
	// List of cImage objects
	cImageRef.prototype.list = new Array();
	
	// list of HTML image objects
	cImageRef.prototype.images = new Array();


	// Create a new cImage object
	cImageRef.prototype.create = function()
	{
		var img = new cImage(this.count);
		this.list.push(img);
		this.count++;
		return	img;
	}
	
	// Get first cImage object
	cImageRef.prototype.getFirst = function()
	{
		this.current = -1;
		return	this.getNext();		
	}

	// Get next cImage object
	cImageRef.prototype.getNext = function()
	{
		if( (this.current+1) == this.count )return false;
		return this.list[ ++this.current ];
	}

	cImageRef.prototype.preload_thumb = function(id)
	{
		
	}

	cImageRef.prototype.preload_image = function(id)
	{
		
	}

	cImageRef.prototype.getImageInfo = function(id)
	{
		id += this.index_first_image;
		
		if( id >= this.count ) return false;

		return this.list[id].info_image;
	}
	
	cImageRef.prototype.getThumbInfo = function(id)
	{
		id += this.index_first_image;
		
		if( id >= this.count ) return false;

		return this.list[id].info_thumb;
	}

	cImageRef.prototype.getImageURL = function(id)
	{
		var index = id + this.index_first_image;
		if( index >= this.count ) return false;

		var info = this.list[index].info_image;

		if( load_isloaded(info.url) == false )
		{
			load_add_ref( info.url, lg_callback, id);
			load_process_ex();
			
			if( info.width > info.height )	info = this.list[0].info_image;
			else							info = this.list[1].info_image;
		}
			
		return info.url;
	}
	cImageRef.prototype.getImageURL2 = function(id)
	{
		var index = id + this.index_first_image;
		if( index >= this.count ) return false;

		var info = this.list[index].info_image;

		if( load_isloaded(info.url) == false )
		{
			load_add_ref( info.url, lg_callback2, id);
			load_process_ex();
			
			if( info.width > info.height )	info = this.list[0].info_image;
			else							info = this.list[1].info_image;
		}
			
		return info.url;
	}

	cImageRef.prototype.getThumbURL = function(id)
	{
		var index = id + this.index_first_image;
		if( index >= this.count ) return false;

		var info = this.list[index].info_thumb;

		if( load_isloaded(info.url) == false )
		{
			load_add_ref( info.url, tn_callback, id);
			load_process_ex();
			
			if( info.width > info.height )	info = this.list[0].info_thumb;
			else							info = this.list[1].info_thumb;
		}
			
		return info.url;
	}

	cImageRef.prototype.get_previous = function( id )
	{
		var p = this.list[id + this.index_first_image].previous;
		if( p == 0 ) return	-1;
		return	p.id - this.index_first_image;
	}
	
	cImageRef.prototype.get_next = function( id )
	{
		var n = this.list[id + this.index_first_image].next;
		if( n == 0 ) return	-1;
		return	n.id - this.index_first_image;
	}
	

	// Empty the list of cImage object
	cImageRef.prototype.clean = function()
	{
		// should I clean the images too?
		for( e in list ) delete( this.list[e] );
		this.list.splice(0, this.list.length);
		this.count = 0;
	}	

	cImageRef.prototype.getCount = function()	{	return this.count - this.index_first_image;	}
	
	cImageRef.prototype.make_fake_ones = function()
	{
		var e_prev = 0;
		
		root_element = document.body;
		
		// Create "please wait" thumb
		obj = this.create();
		// obj.set_thumb( load_get_pw_tbn(), 130, 87, 0);
		// obj.set_image( load_get_pw_img(), 600, 400, 0);
		obj.set_thumb( please_wait_thumb_h, 130, 87, 0);
		obj.set_image( please_wait_image_h, 600, 400, 0);
		
		obj = this.create();		
		obj.set_thumb( please_wait_thumb_v, 87, 130, 0);
		obj.set_image( please_wait_image_v, 400, 600, 0);
		
		// Set the index of the first image
		this.index_first_image = this.count;
		
		// Loop on all URL thumb
		for( i in list_img )
		{
			// img = this.images[i];
			img_def = list_img[i];
			
			if( img_def.length == 3 )
			{
				// COMPATIBILITY MODE / TEST ONLY
				// Short information table created for test purpose...
				url = img_def[0];
				tw = img_def[1];
				th = img_def[2];
				
				obj = this.create();
				
				obj.set_previous(e_prev);
				if( e_prev != 0 ) e_prev.set_next( obj );
				e_prev = obj;
				
				obj.set_thumb(url, tw, th, 0);
				
				url = url.replace('thumb','large');
	
				w = (tw > th)? 600:400;
				h = (tw > th)? 400:600;			
	
				obj.set_image(url, w, h, 0);
	
				filename = url.replace('Denmark/content/bin/images/thumb/','');
	
				obj.set_exif("header: " + filename, "Footer: " + filename );
			}else
			{
				// Full information table created by PHP :)
				var	url = img_def[0];
				var	tw = img_def[1];
				var	th = img_def[2];
				
				obj = this.create();
				
				obj.set_previous(e_prev);
				if( e_prev != 0 ) e_prev.set_next( obj );
				e_prev = obj;
				
				obj.set_thumb(url, tw, th, 0);
				
				// url = url.replace('thumb','large');

				var	url = img_def[3];
				var	w = img_def[4];
				var	h = img_def[5];
				var	size = img_def[6];
				var	type = img_def[7];
				var	date = img_def[8];
				var	time = img_def[9];
				//	w = (tw > th)? 600:400;				h = (tw > th)? 400:600;			
	
				obj.set_image(url, w, h, size);
	
				// filename = url.replace('Denmark/content/bin/images/thumb/','');
	
				// obj.set_exif("header: " + filename, "Footer: " + filename );
				
				obj.set_exif2(img_def[10], img_def[11], img_def[12], img_def[13], date, time);

			}
		}
		obj.set_next(0);
	}
}
/* ------------------------------------------------------
	Inline Info:	show
*/
function inline_show()
{
	inlineInfo.timerId = 0;
	inlineInfo.show();
}

function inline_will_stop()
{
	inlineInfo.timerId2 = 0;
	inlineInfo.confirm_stop();
}

/* ------------------------------------------------------
	Inline Info:	Start Counting...
*/
function cInline()
{
	cInline.prototype.main_element = 0;
	cInline.prototype.parent_element = 0;
	cInline.prototype.elm = 0;
	cInline.prototype.status = 0;
	cInline.prototype.mode = 0;	

	cInline.prototype.start = function(elm, evnt, mode)
	{
		if( this.status == 0 ) return;
		if( evnt == null ) evnt = window.event;

		// #0 for inline image info (thumb) / #1 for header info (large image)
		this.mode = mode;
		
		// Don't lauch the timer if the elmement is the same than before
		if( this.elm != elm )
		{
			// longer timer if there's no tooltip at all on the screen
			if( this.elm == 0 )	this.timerId = setTimeout(inline_show, 700);
			else				this.timerId = setTimeout(inline_show, 200);
			this.elm = elm;			
		}

		// Clear the "stop" timer
		if( this.timerId2 != 0 )
		{
			clearTimeout(this.timerId2);
			this.timerId2 = 0;
		}
	}
	
	cInline.prototype.stop = function()
	{	
		if( this.timerId2 != 0 ) clearTimeout(this.timerId2);
		this.timerId2 = setTimeout(inline_will_stop, 20);
	}

	cInline.prototype.confirm_stop = function()
	{
		this.elm = 0;	
		this.destroy();
		if( this.timerId != 0 )
		{
			clearTimeout(this.timerId);
			this.timerId = 0;
		}
	}

	cInline.prototype.show = function()
	{
		this.create();
	}

	cInline.prototype.create = function()
	{	
		if( this.status == 0 ) return;
		
		this.destroy();
		
		if( this.elm == 0 ) return;

		if( !this.mode )	index = parseInt( this.elm.firstChild.id );
		else				index = parseInt( this.elm.id );

		info = ImageLibrary.getImageInfo( index );

		if( info == false ) return;

		element = this.main_element = document.createElement("pre");
		
		var		new_line = "\n";
		if( browser == 'ie' ) new_line += "\r";

		// #0	- 	Show info for the selected thumb
		if( !this.mode )
		{
			cW = 132;
			cH = 60;
			cX = mouseX + 6;
			cY = mouseY + 14;
				
			size = new Number( info.size / 1024 );
			size = size.toFixed(1);
			
			string = new String();
			
			string += "Name: " + info.name + new_line;
			string += "Dimensions: " + info.width + " x " + info.height + new_line;
			string += "Size: " + size + " KB" + new_line;
			string += "Date: " + info.date;
		}else
		{
			cW = 312;
			cH = 64;
			cX = mouseX + 6;
			cY = mouseY + 14;
			string = new String( text_to_paragraph(info.header, 64, new_line) );
		}

		// Init element
		if( ( cX + cW ) > gallery_w ) cX = gallery_w - cW;
		if( ( cY + cH ) > gallery_h ) cY = gallery_h - cH;

		element.id = "id_inline";
		element.className = "class_inline";
		element.unselectable = "on";
		element.style.width = cW + "px";
		element.style.height = cH + "px";
		element.style.left = cX + "px";
		element.style.top = cY + "px";
		
		element.appendChild( document.createTextNode(string) );
		
		root_element.appendChild( element );
	}
	
	
	cInline.prototype.destroy = function()
	{	
		if( this.main_element != 0 )
		{
			static_finding = null;
			search_elm(root_element, "id_inline");
		
			if( static_finding != null )
				root_element.removeChild( this.main_element );
			this.main_element = 0;
		}
	}
	
	cInline.prototype.enable = function()
	{
		this.status = 1;
	}

	cInline.prototype.disable = function()
	{
		this.destroy();
		this.stop();
		this.confirm_stop();		
		this.status = 0;	
	}	
}


/*
var list_img = [
	[ "Denmark/content/bin/images/thumb/002.jpg", 130, 87 ],
	[ "Denmark/content/bin/images/thumb/059.jpg", 130, 87 ]
	];
*/
var		gallery_x = 0;
var		gallery_y = 0;
var		gallery_w = 0;
var		gallery_h = 0;
var		gallery_mode = 0;

var		vignette_w = 0;
var		vignette_h = 0;
var		vignette_w_margin =	4;
var		vignette_h_margin =	4;

var		gallery_y_bar = 0;
var		gallery_h_title = 0;

var		gallery_nb_photos = 0;
var		gallery_xy_table = Array();
var 	current_image = 0;
var		destination_image = 0;
var		image_per_page = 0;
var		image_index_at_limit = 0;
var		timer_flag, timer_period, timer_event;

// var		gallery_title = new String("Copenhagen, Denmark - 2007");

var		lParam = new Array();

var		thumb_jpeg_container;

/* --------------------------------------
*/
function gallery_set_mode(v)
{
	gallery_mode = v;
}

/* --------------------------------------
*/
function gallery_get_mode()
{
	return	gallery_mode;
}

/* --------------------------------------
*/
function gallery_get_realx(x)
{
	return x + root_element.offsetLeft;	
}

/* --------------------------------------
*/
function gallery_get_realy(y)
{
	return y + gallery_h_title + gallery_y; 	
}

/* --------------------------------------
*/
function	gallery_reset_index()
{
	current_image = current_image - ( current_image % image_per_page );
}
			
/* --------------------------------------
*/
function gallery_timer_start(p, evnt)
{
	var	timerId = setTimeout(gallery_timer, p);
	timer_flag = 1;
	timer_period = p;
	timer_event = evnt;

	lParam.splice(0, lParam.length);

	var  nb = gallery_timer_start.arguments.length-2;
	for(var i=0;i!=nb;i++)
	{
		lParam.push( gallery_timer_start.arguments[i+2] );
	}
	
}

/* --------------------------------------
*/
function gallery_timer_stop()
{
	timer_flag = 0;
}

/* --------------------------------------
*/
function gallery_timer()
{
	switch(timer_event)
	{
		case	0:
			if( timer_event_0() == true ) timer_flag = 0;
		break;
		
		case	1:
			if( timer_event_1() == true ) timer_flag = 0;
		break;

		case	2:
			if( timer_event_2() == true ) timer_flag = 0;
		break;

		case	3:
			if( timer_event_3() == true ) timer_flag = 0;
		break;

		case	4:
			if( timer_event_4() == true ) timer_flag = 0;
		break;

		default:
		break;
	}
	if( timer_flag )	setTimeout(gallery_timer, timer_period);
}

/* --------------------------------------
	Creates an array of object (div) but without the object currently selected
*/
function thumb_get_array( sel )
{
	var	art = new Array();
	var elm = document.getElementById("id_thumb");
	
	while( elm != null )
	{
		if( elm.id == "id_thumb" )
		{
			if( elm.firstChild.id != sel.firstChild.id )	art.push(elm);
		}		
		elm = elm.nextSibling;
	}

	return	art;
}


/* --------------------------------------

*/
function retrieve_thumb_id(elm)
{
	var pattern = /(thumbnail)/;
		
	if( pattern.test(elm.id) == true )
	{
		thumb_jpeg_container = elm;		
		return	true;
	}
	return	false;
}


/* --------------------------------------

*/
function parse_elements(elm,fnct)
{
	while( elm != null )
	{
		if( fnct( elm ) == true ) return true;

		if( elm.hasChildNodes() )
		{
			if( parse_elements( elm.firstChild, fnct ) ) return true;
		}

		elm = elm.nextSibling;
	}
	
	return false;
}

/* --------------------------------------

*/
function info_timer_function()
{
	if( galleryInfo != 0 )	galleryInfo.run();	
}

/* --------------------------------------

*/
function header_in(evnt)
{
	elm = elm_from_event(evnt);
	elm.style.color = css_get_color(0);		// "#f0f0b0";
	elm.style.cursor = "pointer";
	inlineInfo.start(elm, evnt, 1);
}

/* --------------------------------------

*/
function header_out(evnt)
{
	elm = elm_from_event(evnt);
	elm.style.color = css_get_color(1);		// "#e0e0a0";
	elm.style.cursor = "default";	
	inlineInfo.stop();	
}


/* --------------------------------------

*/
function cInfo()
{
	// Default values...
	cInfo.prototype.reset = function()
	{
		this.main_text = 0;
		this.main_element = 0;
		this.main_node = 0;
		this.main_node2 = 0;
	
		this.next_text = 0;
		this.next_element = 0;	
		this.next_node = 0;
		this.next_node2 = 0;
	
		this.header_element = 0;
		this.header_node = 0;
		
		this.header_need_link = 1;
		this.index = 0;
	}

	this.reset();
		
	cInfo.prototype.clean = function()
	{
		child_clean( this.main_element );
		child_clean( this.next_element );
		child_clean( this.header_element);

		this.reset();		
	}	
	
	// update the info (when the image has changed usually)
	// arg[0] -> id of the new image
	cInfo.prototype.update = function( id )
	{
		var info = ImageLibrary.getImageInfo( id );

		// -------------- The Header -------------		
		var line = new String( info.header );
		var	max = 104;
		if( line.length > max)
		{
			var line = line.substring(0,max);
			var	i = line.lastIndexOf(" ");		
			line = line.substring(0,i) + '...';
			this.inline = 'on';
		}else	this.inline = 'off';

		this.header_text = line;		
		this.header_count = 0;
		this.index = id;

		// -------------- The Footer -------------
		// Build the text	
		string1 = new String();
		string2 = new String();

		size = new Number( info.size / 1024 );
		size = size.toFixed(1);

		var		new_line = "\n";
		if( browser == 'ie' ) new_line += "\r";

		string2 += info.name + new_line;
		string2 += info.width + " x " + info.height + new_line;
		string2 += size + "KB" + new_line;
		string2 += info.date + " at " + info.time + new_line;		
		string2 += info.footer;
		string1 += "Name:" + new_line + "Width / Height:" + new_line + "Size:" + new_line + "Date:" + new_line + "Exif:";

		if( this.main_element == 0 )
		{
			element = this.main_element = document.createElement("pre");
			element.className = "class_info";
			this.main_need_link = 1;	
			e = document.createElement("pre");
			element.appendChild(e);
			e.className = "class_info";
			e.style.left = "92px";
			e.style.top = "0px";
			element.unselectable = "on";
			element.style.cursor = "default";
			e.unselectable = "on";
		}

		if( this.next_element == 0 )
		{
			element = this.next_element = document.createElement("pre");
			element.className = "class_info";
			this.next_need_link = 1;
			e = document.createElement("pre");
			element.appendChild(e);
			e.className = "class_info";
			e.style.left = "92px";			
			e.style.top = "0px";
			element.unselectable = "on";
			element.style.cursor = "default";			
			e.unselectable = "on";
		}
	
		// If a text is already present, I setup the second one
		if( this.main_text == 0 )
		{
			this.main_text = string1;
			this.next_dir = 1;
			this.main_dir = 0;

			element = this.main_element;
			element.style.color = css_get_color(2);		// "#f0f0f0";
			this.next_element.style.color = css_get_color(3);		// "#505050";
			
			if( this.main_node != 0 )	element.removeChild(this.main_node);
			if( this.main_node2 != 0 )	element.firstChild.removeChild(this.main_node2);
			this.main_node = document.createTextNode(string1);
			this.main_node2 = document.createTextNode(string2);
			element.firstChild.appendChild(this.main_node2);
			element.appendChild(this.main_node);
		}else
		{
			this.next_text = string1;
			this.main_dir = 1;
			this.next_dir = 0;
			
			element = this.next_element;
			element.style.color = css_get_color(2);		// "#f0f0f0";
			this.main_element.style.color = css_get_color(3);		// "#505050";

			if( this.next_node != 0 )	element.removeChild(this.next_node);
			if( this.next_node2 != 0 )	element.firstChild.removeChild(this.next_node2);
			this.next_node = document.createTextNode(string1);
			this.next_node2 = document.createTextNode(string2);
			element.firstChild.appendChild(this.next_node2);
			element.appendChild( this.next_node );
		}

		this.next_count = 0;
		this.main_count = 0;

		this.timer = setTimeout(info_timer_function, 10);
	}

	cInfo.prototype.run = function()
	{
		var	keep_going = 0;
	
		// -------------- The Header --------------
		
		if( this.header_count < 45 )
		{
			if(	this.header_need_link )
			{
				this.header_element = document.getElementById("id_header");
				this.header_need_link = 0;
			}
			if( this.header_count == 0 )
			{
				element = this.header_element;
				if( this.header_node != 0 )	element.removeChild(this.header_node);
				this.header_node = document.createTextNode( this.header_text );
				element.unselectable = "on";
				element.id = this.index;
				element.appendChild(this.header_node);
				element.style.left = 0 + "px";
				remove_event(element, null, header_in, header_out);
				
				if( this.inline == 'on' )
				{
					add_event(element, null, header_in, header_out);
					element.style.color = css_get_color(4);		// "#e0e0a0";
				}else
				{
					// remove_event(element, null, header_in, header_out);
					element.style.color = css_get_color(5);		// "#c0c0c0";
				}
			}

			this.header_count++;
			keep_going++;
		}	
						
		// -------------- The Footer --------------		
		// don't do anything if there's only one text
		if( this.main_text == 0 ) return false;
							
		// scroll the old text
		if( this.main_count < 45 )
		{
			if( this.main_need_link == 1)
			{
				var info_box = document.getElementById("id_infobox");
				if( info_box != false )
				{
					info_box.align = "left";
					info_box.appendChild( this.main_element );
					this.main_need_link = 0;
				}
			}
			
			// x moves around 1/4 of circle
			x = new Number( 640 );
			deg = new Number( this.main_count );
			deg = ( deg * Math.PI ) / 90;
			x = x * Math.sin( deg );
			
			elm = this.main_element;
			if( !this.main_dir ) x = 640 - x;
			elm.style.left = (x + 4) + "px";

			this.main_count++;			
			keep_going++;
		}else
		{
			if( this.main_dir )
			{
				// delete	this.main_text;
				this.main_text = 0;
			}
		}

		// scroll the new text		
		if( this.next_text != 0 )
		{
			if( this.next_need_link == 1)
			{
				var info_box = document.getElementById("id_infobox");
				if( info_box != false )
				{
					info_box.align = "left";
					info_box.appendChild( this.next_element );
					this.next_need_link = 0;
				}
			}
			
			if( this.next_count < 45 )
			{
				// x moves around 1/4 of circle
				x = new Number( 640 );
				deg = new Number( this.next_count );
				deg = ( deg * Math.PI ) / 90;
				x = x * Math.sin( deg );
				
				elm = this.next_element;
				if( !this.next_dir ) x = 640 - x;
				elm.style.left = (x + 4) + "px";

				this.next_count++;
				keep_going++;
			}else
			{
				if( this.next_dir )	this.next_text = 0;
			}
		}
	
		if( keep_going )
		{
			this.timer = setTimeout(info_timer_function, 10);
			return true;
		}
		
		return false;
	}
}

/* --------------------------------------
*/
function lg_callback( source, lParam )
{
//	dbg = document.getElementById("debug");	
//	dbg.value += "!! " + lParam + "src: " + source + " \r\n";

	elm = document.getElementById("id_image");
	if( elm == null )
	{
//		dbg.value += "no image object!\n\r";
		
		return 	false;
	}
	v = parseInt( elm.style.wordSpacing );

	if( v == lParam )
	{
//		dbg.value += "set this images!\r\n";
			
		elm.style.backgroundImage = "url('" + source + "')";
		elm.style.wordSpacing = -1;
		return 	true;

	}else
	{
//		dbg.value += "Oops! " + v + " , " + lParam + " \n\r";
	}

	return 	false;
}

/* --------------------------------------
*/
function tn_callback( source, lParam)
{
	var	flag = 0;
	
	jpeg_elm.splice(0,jpeg_elm.length);
	
	search_jpeg( root_element );
	
	jpeg_elm.reverse();
	
	var cnt = jpeg_elm.length;
	for(var i=0;i!=cnt;i++)
	{
		elm = jpeg_elm.pop();
		v = parseInt( elm.style.wordSpacing );
		
		if( v == lParam )
		{
			elm.style.backgroundImage = "url('" + source + "')";
			elm.style.wordSpacing = -1;
			flag++;
		}
	}

	return flag;
}

var myWindow = 0;

/* --------------------------------------
*/
function lg_callback2( source, lParam )
{
	var code = "<html><body style=\"margin:0px;\">\n\r" + 
				"<div align=\"center\" >\n\r" + 
				"<img style=\"width:600px;\"";
// src="images/img1.jpg"></img> </div>

	myWindow.document.write(code + "<img src=\"" + source + "\"></img></div></body></html>");
	
	myWindow.width = 100;
	return 	false;
}

/* --------------------------------------

*/
function popup_view_image(elm)
{
	thumb_jpeg_container = null;

	parse_elements(elm,retrieve_thumb_id);

	index = parseInt( thumb_jpeg_container.id );

	var url = ImageLibrary.getImageURL2( index );
	var info = ImageLibrary.getImageInfo( index );	

	current_image = index;
	var h = info.height + 4;
	var	w = info.width + 4;
 	myWindow = open(url, "name",
 	'left=312,top=32,Height=' + h + ',Width=' + w + ',dependent=yes,location=no,menubar=no,resizable=no,status=no', false);

	// this.timer = setTimeout(info_timer_function, 10);
/*	if( browser == 'ie' )
	{
		if( f1 != null ) myWindow.attachEvent("onload", lg_load);
	}else					// OTHER Browser...
	{
		if( f1 != null ) myWindow.addEventListener("load", lg_load, false);
	}
*/
}



/* --------------------------------------
*/
function effect()
{
	effect.prototype.count = 0;
	effect.prototype.select = null;
	effect.prototype.obj = new Array();
	effect.prototype.xy = new Array();
	effect.prototype.elm_lg_view = null;
	effect.prototype.c1 = 0;
	effect.prototype.c2 = 0;
	effect.prototype.elm_lg_src = null;
	
	effect.prototype.sel_x = 0;
	effect.prototype.sel_y = 0;	

	effect.prototype.sq_init = function()
	{
	}
	
	effect.prototype.sq_draw = function(c1, c2)
	{
	}

	effect.prototype.lg_preload = function()
	{
		thumb_jpeg_container = null;
		
		parse_elements(this.select,retrieve_thumb_id);

		this.index = index = parseInt( thumb_jpeg_container.id );

		ImageLibrary.getImageURL( index );

		current_image = index;
	}

	effect.prototype.init = function(list, elm)
	{
		this.count = 0;
		this.obj = list;
		this.select = elm;
		var id = elm.firstChild.id;

		this.sel_x = parseInt(elm.style.left) + vignette_w / 2;
		this.sel_y = parseInt(elm.style.top) + vignette_h / 2;	
		
		sx = this.sel_x;
		sy = this.sel_y;
			
		for( i in list )
		{
			e = list[i];

			dx = new Number( parseInt(e.style.left) + vignette_w / 2 );
			dy = new Number( parseInt(e.style.top) + vignette_h / 2 );
			
			dx = (dx-sx);
			dy = (dy-sy);
					
			// Normalize the vector
			var d = Math.sqrt(dx*dx + dy*dy);
			dx = dx / d;
			dy = dy / d;
			
			// small cos because it's cute :)
			this.xy.push( Math.cos(dx) * dx * 80 );
			this.xy.push( Math.cos(dy) * dy * 80 );
		}

		this.lg_preload();
	}

	effect.prototype.run = function()
	{
		this.count++;
		frame = this.count;
		
		list = this.obj;		

		// select flashes
		var step_phase = 12;
		
		if( frame <= step_phase )
		{
			xd = ( gallery_w / 2 ) * frame / step_phase;
			yd = ( (gallery_h + gallery_h_title + 48 ) / 2 ) * frame / step_phase;
			sx = this.sel_x * (step_phase-frame) / step_phase;
			sy = this.sel_y * (step_phase-frame) / step_phase;
			xd = ( ( xd + sx ) ) - vignette_w / 2;
			yd = ( ( yd + sy ) ) - vignette_h / 2;

			this.select.style.left = xd + "px";
			this.select.style.top = yd + "px";
		}else
		{
			if( ( frame & 4 ) == 0 )	this.select.style.visibility = "visible";		
			else						this.select.style.visibility = "hidden";
		}

		// maximum 30 frames, then we stop the anim
		if( frame >= 30 )
		{
			// remove the remaining objects if any
			for( i in list )
			{
				e = list[i];
				if( e != null )	root_element.removeChild( e );
			}
			
			root_element.removeChild( this.select );

			this.elm_lg_view = gallery_lg_create(this.index);
			
			gallery_set_mode(1);

			gallery_lg_view( this.elm_lg_view, this.index );
			
			return true;
		}
		
		// remove the bar from the screen
		var bar = document.getElementById("navig_bar");
		bar.style.left = -( gallery_w / 28 ) * frame;

		// move all the thumb
		for( i in list )
		{
			e = list[i];
			if( e != null )
			{
				dx = this.xy[ (i*2) ];
				dy = this.xy[ (i*2) + 1 ];			
				
				x = parseInt(e.style.left);
				y = parseInt(e.style.top);

				// clipping x,y
				if( x > gallery_w || ( x + vignette_w ) < 0 ||
					y > gallery_h || ( y + vignette_h ) < 0 )
				{
						root_element.removeChild( e );
						e = null;
						list[i] = null;
				}
			}
			// move this object (if valid)
			if( e != null )
			{
				e.style.left = x + dx + "px";
				e.style.top = y + dy + "px";
			}
		}

		return false;		
	}

	effect.prototype.getc = function()
	{
		return (this.count);
	}
}

/* --------------------------------------
*/
function effect2( lp )
{
	effect2.prototype.count = 0;
	effect2.prototype.select = null;
	effect2.prototype.direction = lp[1];	

	effect2.prototype.init = function()
	{
		this.count = 0;
		var	obj = document.getElementById("id_large");
		this.obji = document.getElementById("id_image");
		this.objs = document.getElementById("id_shadow");
		
		this.select = obj;
		this.width = parseInt(this.obji.style.width);

		inlineInfo.enable();
	}
	
	effect2.prototype.run = function()
	{
		var frame = this.count++;

		if( frame > 45 )	return true;

		w = new Number( this.width );
		deg = new Number( frame );
		deg = ( deg * Math.PI ) / 22.5;
		w = w * Math.cos( deg );

		// 1/4 of the way -> show the back 
		if( frame  == 12 )	this.obji.style.backgroundImage = "url('')";

		// 3/4 of the way -> show the next (or previous) image
		if( frame == (22+12) )
		{
			e = this.select.firstChild;

			index = parseInt( e.id );

			if( this.direction == 1 ) index = ImageLibrary.get_previous( index );
			else					  index = ImageLibrary.get_next( index );
			
			if( index != -1 )
			{
				var info = ImageLibrary.getImageInfo(index);
				var url = ImageLibrary.getImageURL(index);
				
				h = info.height;
				this.obji.style.backgroundImage = "url('" + url + "')";
				this.obji.style.wordSpacing = index;
	
				this.width = info.width;
				this.objs.style.height = h + "px";
				this.obji.style.height = h + "px";
				this.select.style.height = (h - 16 ) + "px";

				e.id = index + "_obj";
				
				galleryInfo.update( index );	
			}
		}
		
		w = Math.abs( w );
		w = Math.floor( w );

		this.obji.style.width = w + "px";
		ofs = -( ( this.width - w ) / 2 );

		this.obji.style.backgroundPosition = ofs + "px 0px";
		this.objs.style.width = (w+2) + "px";
	}
	
	return false;	
}


/* --------------------------------------
*/
function setClip(obj, left, top, right, bottom) 
{
     obj.style.clip = "rect("+top+"px "+right+"px "+" "+bottom+"px "+left+"px )";
}


/* --------------------------------------
*/
function effect3( lp )
{

	effect3.prototype.init = function()
	{
		this.count = 0;
		var	obj = document.getElementById("id_large");

		// detach the large view
		w = new Number( parseInt(obj.style.width) );
		h = new Number( parseInt(obj.style.height) ) + 180;
		
		x = new Number( parseInt(obj.style.left) );
		y = new Number( parseInt(obj.style.top) );
	
		var parent = obj.parentNode;
		var myCopy = obj.cloneNode(true);
		
		parent.removeChild(obj);

		// create the clipper
		this.clipper = e_div = document.createElement("div");
		this.width = w;
		this.height = h + 100;
		e_div.className = "class_clipper";
		e_div.style.left = x + "px";
		e_div.style.top = y + "px";
		myCopy.style.left = "0px";
		myCopy.style.top = "0px";

		setClip(e_div,0,0,w,h);

		// re-attach the view to the clipper
		e_div.appendChild(myCopy);

		parent.appendChild(e_div);
	
		return false;
	}
	
	effect3.prototype.run = function()
	{
		if( this.count++ >= 16  )
		{
			child_clean( this.clipper );
			
			galleryInfo.clean();	
			
			gallery_reset_index();
			
			gallery_set_mode(0);
			
			gallery_refresh(true);
			
			inlineInfo.enable();
			
			return true;
		}

		w = new Number( this.width / 2 )
		w = ( w / 16 ) * this.count;
		
		h = new Number( this.height / 2 );
		h = ( h / 16 ) * this.count;
		
		setClip(this.clipper, w, h, this.width-w, this.height-h);

		return false;
	}
}

/* --------------------------------------
*/
function timer_event_3()
{
	var cmd = lParam[0];
	
	switch(cmd)
	{
		case	0:	// init
			lParam[0] = 1;

			ef = new effect3( lParam );

			lParam.push( ef );
	
			ef.init();

		break;
		
		default:	// run
			ef = lParam[1];
			return	ef.run();			
		break;		
	}
	
	return	false;
}


/* --------------------------------------
*/
function timer_event_2()
{
	var cmd = lParam[0];
	
	switch(cmd)
	{
		case	0:	// init
			lParam[0] = 1;

			ef = new effect2( lParam );

			lParam.push( ef );
	
			ef.init();

		break;
		
		default:	// run
			ef = lParam[2];
			return	ef.run();			
		break;		
	}
	
	return	false;
}


/* --------------------------------------
*/
function timer_event_1()
{
	var elm = lParam[0];
	var cmd = lParam[1];
	
	switch(cmd)
	{
		case	0:	// init
			lParam[1] = 1;
			
			ef = new effect();

			lParam.push( ef );

			var list = thumb_get_array( elm );
		
			ef.init( list, elm );

		break;
		
		default:	// run
			ef = lParam[2];
			return	ef.run();			
		break;		
	}
	
	return	false;
}


/* --------------------------------------
*/
function timer_event_0()
{
	if( current_image == destination_image )
	{
			inlineInfo.enable();
			return true;
	}
	
	if( current_image > destination_image )
	{
		current_image -= 2;
		if( current_image < destination_image )current_image = destination_image;
	}else
	{
		current_image += 2;	
		if( current_image > destination_image )current_image = destination_image;		
	}

	gallery_refresh(false);
	
	return	false;
}


/* --------------------------------------
*/
function gallery_set_image_per_page(v)
{
	if( v > image_index_at_limit )
	{
		var nb_page = new Number( gallery_nb_photos/ image_per_page );
		var cpage = new Number( current_image / image_per_page );
		nb_page = Math.ceil(nb_page);
		cpage = Math.ceil(cpage);
		if( cpage >= nb_page )
		{
			current_image = (nb_page-1) * image_per_page;
		} 
	}
	image_per_page = v;
}


/* --------------------------------------
*/
function 	gallery_set_width(v)
{
	alert("unused");
}

/* --------------------------------------
*/
function 	gallery_set_size(w,h)
{
	gallery_w = w-4;
	gallery_h = h;	
}


/* --------------------------------------
*/
function	gallery_set_default(v1,v2,v3,v4,v5)
{
	gallery_x = v1;
	gallery_y = v2;	
	vignette_w = v3;
	vignette_h = v4;
	gallery_nb_photos = v5;
	
	image_index_at_limit = 0;
}


/* compute the location of the images on the screen
*/
function compute_xy()
{
//	var x_start = root_element.offsetLeft;
	var x_start = 0;
	var y_start = 0;	// root_element.offsetTop;
	
	max_h = gallery_h - 104;
		
	var width = gallery_w - (gallery_x*2);
	
	var	w = vignette_w + vignette_w_margin;
	var	h = vignette_h + vignette_h_margin;
	
	var nw = new Number( (width+vignette_w_margin) / w);
	nw = Math.floor(nw);
	if( nw > 1 )
	{
		var mrg_w = new Number( ( width - (w * nw - vignette_w_margin) ) / ( nw - 1) );
		sw = mrg_w + vignette_w + vignette_w_margin;
	}else	sw = vignette_w;

	var nh = new Number( (max_h+vignette_h_margin) / h );
	nh = Math.floor(nh);	
	if( nh > 1 )
	{
		var mrg_h = new Number( ( max_h - (h * nh - vignette_h_margin) ) / ( nh - 1) );
		sh = mrg_h + vignette_h + vignette_h_margin;
	}else	sh = h;

	gallery_xy_table.splice(0, gallery_xy_table.length);
	
	for(var j=0;j!=nh;j++)
	{	
		for(var i=0;i!=nw;i++)
		{
			var left = new Number( i * sw + x_start + gallery_x );
			var top = new Number( j * sh + y_start + gallery_y );
			gallery_xy_table.push( Math.floor(left) );
			gallery_xy_table.push( Math.floor(top) );
		}
	}
}

/* ---------------------------------------------
*/
function	child_clean(elm)
{
	while( elm.hasChildNodes() )
	{
		child_clean( elm.lastChild );
		elm.removeChild( elm.lastChild );
	}
}


/* ---------------------------------------------
*/
function	remove_event(elm, f1, f2, f3)
{
	if( browser == 'ie' )
	{
		if( f1 != null ) elm.detachEvent("onclick",f1);
		if( f2 != null ) elm.detachEvent("onmouseover", f2);
		if( f3 != null ) elm.detachEvent("onmouseout", f3);
	}else
	{
		if( f1 != null ) elm.removeEventListener("click", f1, false);
		if( f2 != null ) elm.removeEventListener("mouseover", f2, false);
		if( f3 != null ) elm.removeEventListener("mouseout", f3, false);
	}
}

/* ---------------------------------------------
*/
function	add_event(elm, f1, f2, f3)
{
	if( browser == 'ie' )
	{
		if( f1 != null ) elm.attachEvent("onclick", f1);
		if( f2 != null ) elm.attachEvent("onmouseover", f2);
		if( f3 != null ) elm.attachEvent("onmouseout", f3);
	}else					// OTHER Browser...
	{
		if( f1 != null ) elm.addEventListener("click", f1, false);
		if( f2 != null ) elm.addEventListener("mouseover", f2, false);
		if( f3 != null ) elm.addEventListener("mouseout", f3, false);
	}
}

/* ---------------------------------------------
*/
function refresh_xy_btn( btn1, btn2)
{
	var		x1 = gallery_w - 124;
	var		x2 = gallery_w - 54;
	
	if( !refresh_xy_btn.arguments.length )
	{
		btn1 = document.getElementById("PREVIOUS");
		btn2 = document.getElementById("NEXT");		
	}
	
	btn1.style.left = x1 + "px";
	btn2.style.left = x2 + "px";	
}


/*
	# images per page
	# images total
	# current image
	# y location
	# width of the bar
*/
function	draw_page_bar()
{
	// # of pages total
	var	current = destination_image;
	
	var	ofs = (current % image_per_page);
	if( ofs ) ofs = image_per_page - ofs;
	var nb_page = new Number( (gallery_nb_photos+ofs) / image_per_page );
	nb_page = Math.ceil(nb_page);
	
	// # current page
	var cpage = new Number( current / image_per_page );
	cpage = Math.ceil(cpage);

	var x_start = root_element.offsetLeft;
	var margin_w = 4;
	
	// Create Header, Parent, Previous, Next
	var e_div_1 = document.createElement("div");
	var e_div_2 = document.createElement("div");
	var e_div_4 = document.createElement("div");
	var e_div_5 = document.createElement("div");
	
	// Create page numbers
	for(var i=0;i!=nb_page;i++)
	{
		var e_div_6 = document.createElement("div");
		e_div_6.id = "page" + i;
		e_div_6.align = "center";
		e_div_6.style.left = (i*20 + 56 ) + "px";
			
		if( cpage == i )e_div_6.className = "page-number-b";
		else
		{
			e_div_6.className = "page-number-c";
			e_div_6.id = "PAGE" + i;
			add_event(e_div_6, mpSelect, mpHoverOver, mpHoverOut);
		}
		var text = new String(i + 1);
		var number = document.createTextNode(text);

		e_div_6.appendChild(number);
		e_div_2.appendChild(e_div_6);		
	}

	e_div_2.appendChild( document.createTextNode("Page:") );
	e_div_1.style.top = gallery_y_bar + "px";
	e_div_1.style.left = x_start + margin_w + "px";	
	e_div_1.style.width = (gallery_w-margin_w*2) + "px";
	
	e_div_1.id = "navig_bar";
	e_div_1.className = "page-header";
	e_div_2.className = "page-number-a";
	
	// Previous...	
	if( cpage != 0 )
	{
		e_div_4.id = "PREVIOUS";
		e_div_4.className = "page-previous";
		e_div_4.appendChild( document.createTextNode("Previous") );
		add_event(e_div_4, mpSelect, mpHoverOver, mpHoverOut);
		e_div_2.appendChild(e_div_4);
	}

	// Next...	
	if( (cpage+1) < nb_page )
	{
		e_div_5.id = "NEXT";	
		e_div_5.className = "page-next";
		e_div_5.appendChild( document.createTextNode("Next") );
		add_event(e_div_5, mpSelect, mpHoverOver, mpHoverOut);
		e_div_2.appendChild(e_div_5);	
	}
	
	refresh_xy_btn(e_div_4,e_div_5);
	
	e_div_1.appendChild(e_div_2);

	root_element.appendChild(e_div_1);
}


/* ------------------------------------------------------

*/
function	gallery_refresh_title()
{
	var elm = document.getElementById("id_title");
	if( elm != false ) elm.style.width = ( gallery_w - gallery_x * 2 ) + "px";

	elm = document.getElementById("id_about");
	elm.style.left = (gallery_w - 116) + "px";	

	elm = document.getElementById("id_contact");
	elm.style.left = (gallery_w - 116) + "px";	
}

/* ------------------------------------------------------

*/
function	gallery_insert_title()
{
	var e_div_1 = document.createElement("div");
	var e_div_2 = document.createElement("div");
	var e_div_3 = document.createElement("div");
	var e_div_4 = document.createElement("div");

	var x_start = root_element.offsetLeft;
	var shadow_w = 4;
	var shadow_h = 4;
	
	e_div_2.className = "class_title_1";	
	e_div_1.className = "class_xy";
	e_div_1.style.left = x_start + gallery_x + "px";
	e_div_1.style.top = -4 + gallery_y + "px";
		
	// dotted_line
	var e_div_5 = document.createElement("div");
	e_div_5.className = "dotted_line";
	e_div_5.style.top = "6px";

	// Title
	var text_shadow = document.createTextNode(gallery_title);
	var text = document.createTextNode(gallery_title);	

	e_div_3.className = "class_title_2";
	e_div_3.appendChild(text_shadow);
	e_div_4.className = "class_title_2";
	e_div_4.appendChild(text);
	e_div_4.style.left = shadow_w + "px";
	e_div_4.style.top = shadow_h + "px";

	e_div_1.appendChild(e_div_2);
	e_div_2.appendChild(e_div_3);
	e_div_1.appendChild(e_div_4);	

	e_div_1.id = "id_title";
	e_div_1.appendChild(e_div_5);
	e_div_1.style.width = ( gallery_w - gallery_x * 2 ) + "px";
	e_div_3.unselectable = "on";
	e_div_4.unselectable = "on";
	e_div_1.style.cursor = "default";
	
	// Contact Me...
	var e_div_5 = document.createElement("div");
	var e_div_6 = document.createElement("a");
	var contact = document.createTextNode("- Contact Me");
	e_div_5.className = "class_contact";
	e_div_6.className = "class_contact";
	e_div_6.style.left = (gallery_w - 116) + "px";
	e_div_6.style.top = "8px";
	e_div_6.id = "id_contact";
	e_div_6.href = "mailto:david@davidfernandes.net";
	e_div_6.appendChild(contact);
	e_div_5.appendChild(e_div_6);
	e_div_1.appendChild(e_div_5);

	// About this gallery...
	var e_div_5 = document.createElement("div");
	var e_div_6 = document.createElement("a");
	var contact = document.createTextNode("- About This Gallery");
	e_div_5.className = "class_contact";
	e_div_6.className = "class_contact";

	e_div_6.style.top = "24px";
	e_div_6.style.left = (gallery_w - 116) + "px";
	e_div_6.id = "id_about";

	e_div_6.href = "about.htm";
	e_div_6.target = "_blank";
	e_div_6.appendChild(contact);
	e_div_5.appendChild(e_div_6);
	e_div_1.appendChild(e_div_5);

	root_element.appendChild(e_div_1);
	
	gallery_h_title = e_div_1.offsetHeight + 10;
}


/* ------------------------------------------------------
	Create the "div" object at its given xy location starting from a list of picture
*/
function draw_thumbnail( xy, images)
{
	var	y_start = gallery_h_title;
	
	var new_kids = 0;
	var nbi = images.length * 2;
	var nb = (xy.length < nbi)? xy.length : nbi;
	
	images.reverse();

	for(var i=0;i!=nb;i++)
	{
		// Create all the element for this thumb
		var e_div_1 = document.createElement("div");
		var e_div_2 = document.createElement("div");
		var e_div_3 = document.createElement("div");
		var e_div_4 = document.createElement("div");
		var e_div_5 = document.createElement("div");
		
		var text = new String(i/2 + current_image + 1);
		var number = document.createTextNode(text);
		e_div_5.appendChild(number);
		e_div_1.appendChild(e_div_2);
		e_div_1.appendChild(e_div_3);
		e_div_3.appendChild(e_div_4);
		e_div_1.appendChild(e_div_5);
	
		// setup DIV #5		
		e_div_5.className = "my_class5";

		// setup DIV #4		
		e_div_4.id = "jpeg";
		e_div_4.className = "my_class4";

		index = images.pop();

		// request the thumb	
		var info = ImageLibrary.getThumbInfo( index );
		var url = ImageLibrary.getThumbURL( index );

		str = "url('" + url + "')";		
		w = info.width;
		h = info.height;
		e_div_4.style.backgroundImage = str;
		e_div_4.style.wordSpacing = index;

		// ------------------------------
		e_div_4.style.width = w;
		e_div_4.style.height = h;	
		
		// setup DIV #3		
		e_div_3.className = "my_class3";
		e_div_3.style.width = w;
		e_div_3.style.height = h;	
		e_div_3.style.marginLeft = (vignette_w-w)/2 + 3;
		e_div_3.style.marginTop = (vignette_h-h)/2 + 3;
	
		// setup DIV #2
		e_div_2.id = index + "thumbnail";
		e_div_2.className = "my_class1";
		e_div_2.style.width = vignette_w;
		e_div_2.style.height = vignette_h;

		// setup DIV #1
		e_div_1.id = "id_thumb";
		e_div_1.className = "detect";

		add_event(e_div_1, mSelect, mHoverOver, mHoverOut);

		e_div_1.style.left = xy[i++] + "px";
		e_div_1.style.top = y_start + xy[i] + "px";

		// Connect the element to each other
		root_element.appendChild(e_div_1);
		
		new_kids++;
	}
	
	h = y_start + xy[nb-1] + vignette_h + vignette_h_margin;
	
	return	h;
}

/* ------------------------------------------------------
*/
function create_image_index()
{
	var last = gallery_nb_photos - current_image;
	var nb = (image_per_page < last )? image_per_page:last;
	var images = new Array();
	
	for(var i=0;i!=nb;i++)	images.push( i + current_image );

	return images;
}

/* ------------------------------------------------------
*/
function gallery_lg_view( elm, index)
{
	root_element.appendChild(elm);

	static_finding = null;
	search_elm(elm, "id_image");
	
	if( static_finding != null )
	{		
		var url = ImageLibrary.getImageURL( index );

		str = "url('" + url + "')";
		
		static_finding.style.backgroundImage = str;	
	}
}


/* ------------------------------------------------------

*/
function refresh_lg_buttons(v1,v2)
{
	if( v1 == undefined )	prev = document.getElementById("LG_PREVIOUS");
	else					prev = v1;
	
	if( v2 == undefined )	next = document.getElementById("LG_NEXT");
	else					next = v2;

	if( current_image > 0 )
	{
		prev.style.visibility = "visible";
	}else
	{
		prev.style.visibility = "hidden";		
	}
	
	if( ( current_image + 1 ) < gallery_nb_photos )
	{
		next.style.visibility = "visible";
	}else
	{
		next.style.visibility = "hidden";	
	}
}

/* ------------------------------------------------------

*/
function gallery_lg_refresh()
{
	var	x_start = ( gallery_w - 640 ) / 2;
	x_start = gallery_get_realx(x_start);

	elm = document.getElementById("id_large");
	if( elm != false ) elm.style.left = x_start + "px";
}
	
/* ------------------------------------------------------

*/
function gallery_lg_create(index)
{
	var	x_start = ( ( gallery_w - 640 ) / 2 );
	x_start = gallery_get_realx(x_start);
	var	y_start = gallery_h_title + gallery_y;
	
	// Create all the nodes for this large view
	var e_div_1 = document.createElement("div");
	var e_div_2 = document.createElement("div");
	var e_div_3 = document.createElement("div");
	var e_div_4 = document.createElement("div");
	var e_div_5 = document.createElement("div");
	var e_div_6 = document.createElement("div");
	var e_div_7 = document.createElement("div");
	var e_div_8 = document.createElement("div");
	var e_div_9 = document.createElement("div");
	var e_div_10 = document.createElement("div");
	var e_div_11 = document.createElement("pre");	

	var t1 = document.createTextNode( "Index" );
	var t2 = document.createTextNode( "Previous" );
	var t3 = document.createTextNode( "Next" );

	// setup each node
	e_div_1.className = "class_lg_xy";
	e_div_2.className = "class_lg_1";
	e_div_3.className = "class_lg_nav";
	e_div_4.className = "class_lg_nv1";
	e_div_5.className = "class_lg_nv2";
	e_div_6.className = "class_lg_nv3";
	e_div_7.className = "class_lg_2";
	e_div_8.className = "class_lg_3";
	e_div_9.className = "class_lg_4";		
	e_div_10.className = "class_clipper";
	e_div_11.className = "class_header";

	// set to "please wait" for now...
	var	info = ImageLibrary.getImageInfo( index );
	var	url = ImageLibrary.getImageURL( index );

	str = "url('" + url + "')";
	w = info.width;
	h = info.height;

	e_div_8.style.backgroundImage = str;
	e_div_8.style.wordSpacing = index;


	e_div_7.style.width = w;
	e_div_8.style.width = w;
	
	e_div_7.style.height = h;
	e_div_8.style.height = h;

	e_div_1.style.height = (h - 16 ) + "px";
	e_div_1.style.width = 640 + "px";

	e_div_2.align = "center";

	// link the nodes
	e_div_4.appendChild(t1);
	e_div_5.appendChild(t2);
	e_div_6.appendChild(t3);
	
	e_div_1.id = "id_large";
	e_div_2.id = index + "_obj";	
	e_div_3.id = index + "_obj";	
	e_div_4.id = "INDEX";
	e_div_5.id = "LG_PREVIOUS";
	e_div_6.id = "LG_NEXT";	
	e_div_7.id = "id_shadow";
	e_div_8.id = "id_image";
	e_div_10.id = "id_infobox";
	e_div_11.id = "id_header";
	
	add_event(e_div_4, mpSelect, mpHoverOver, mpHoverOut);
	add_event(e_div_5, mpSelect, mpHoverOver, mpHoverOut);	
	add_event(e_div_6, mpSelect, mpHoverOver, mpHoverOut);			
	
	refresh_lg_buttons(e_div_5, e_div_6);
	
	e_div_1.appendChild(e_div_2);
	e_div_2.appendChild(e_div_3);
	e_div_3.appendChild(e_div_4);
	e_div_3.appendChild(e_div_5);
	e_div_3.appendChild(e_div_6);
	e_div_3.appendChild(e_div_11);
	e_div_2.appendChild(e_div_7);
	e_div_7.appendChild(e_div_8);
	e_div_2.appendChild(e_div_9);
	
	e_div_9.appendChild(e_div_10);
	setClip(e_div_10, 0, 0, 598, 98);
	
	e_div_1.style.left = x_start + "px";
	e_div_1.style.top = y_start + "px";	

	if( galleryInfo == 0 )	galleryInfo = new cInfo();

	galleryInfo.update( index );

	return	e_div_1;
}


/* ------------------------------------------------------

*/
function gallery_refresh(flg_update_bar)
{
	width = root_element.offsetWidth;
	height = root_element.offsetHeight;	

	// I want a minimum of 2 images wide...
	var min = ( ( vignette_w + vignette_w_margin ) * 2 ) + 24;
	if( width < min ) width = min;

	// I want a minimum of 2 images height...
	min = ( ( vignette_h + vignette_h_margin ) * 1 ) + 102;
	if( height < min ) height = min;
	
	gallery_set_size(width, height);


	switch( gallery_get_mode() )	
	{		
		case	0:	// Mode thumbnail...

		// compute location of thumbs; return the xy list
		compute_xy();
	
		// load the images...
		ipp = gallery_xy_table.length/2;
		
		gallery_set_image_per_page(ipp);

		child_clean(root_element);
	
		gallery_insert_title();
		
		images = create_image_index();
	
		var y_bar = 16 + draw_thumbnail( gallery_xy_table, images );
		if( flg_update_bar == true )
		{
			gallery_y_bar = y_bar;
		}else
		{
			if( gallery_y_bar < y_bar ) gallery_y_bar = y_bar;
		}
		
		draw_page_bar();
		
		break;
		
		case	1:	// Mode Large view
		
			inlineInfo.disable();
			
			// Center the image and refresh the title...
			gallery_refresh_title();
			
			gallery_lg_refresh();
			
		break;
	}
}

/*
	Warning, the value is 16 pixels bigger with Firefox when reload (compare to resize)
	OK, under explorer.
*/
function	my_reload()
{
	if( inlineInfo == 0 )	inlineInfo = new cInline();

	inlineInfo.enable();

	gallery_refresh(true);
}


/* ------------------------------------------------------
*/
function mclick()
{
	alert("Click! ");
}


/* ------------------------------------------------------
*/
function select(elm)
{
	alert("click ID: " + elm.id);
}

/* ------------------------------------------------------
*/
function mHover(elm, v)
{
	var id = 'frame' + elm.id;

	theElement = document.getElementById(id);
	if( v )	theElement.className = 'my_class2';
	else	theElement.className = 'my_class1';
}


/* ------------------------------------------------------
*/
function page_hover(elm, v)
{
	if( v )
	{
		elm.style.color = css_get_color(6);		// "#a0a0a0";
		elm.style.cursor = "pointer";		
	}else
	{
		elm.style.color = css_get_color(7);		// "#000000";
		elm.style.cursor = "default";
	}	
}


/* ------------------------------------------------------
	Get the parent
*/
function get_trigger(elm)
{
	do
	{
		if( elm.id == "id_thumb") break;
		elm = elm.parentNode;
	}while( elm != null );

	return elm;
}


/* ------------------------------------------------------
*/
function elm_from_event(evnt)
{
	if( !evnt)	evnt = window.event;

	if( evnt.target )	// DOM
	{
		elm = evnt.target;
	}else if( evnt.srcElement )	// IE
	{
		elm = evnt.srcElement;
	}
	return	elm;
}

/* ------------------------------------------------------
*/
function mSelect(evnt)
{
	elm = elm_from_event(evnt);
	elm = get_trigger(elm);

	if( gallery_h < 400 )
	{
		popup_view_image(elm);
	}else
	{
		inlineInfo.stop();
	 	gallery_timer_start(10, 1, elm, 0);
 	}
}


/* ------------------------------------------------------
*/
function mHoverOver(evnt)
{
	elm = get_trigger( elm_from_event(evnt) );

	if( elm != null )
	{
		child = elm.firstChild;
		child.className = 'my_class2';
		inlineInfo.start(elm, evnt, 0);
	}
}

/* ------------------------------------------------------
*/
function mHoverOut(evnt)
{
	elm = get_trigger( elm_from_event(evnt) );

	if( elm != null )
	{
		child = elm.firstChild;
		child.className = 'my_class1';
		inlineInfo.stop();
	}
}


/* ------------------------------------------------------
	PAGE EVENT HANDLER
*/
function mpSelect(evnt)
{
	elm = elm_from_event(evnt);
	
	str = new String(elm.id);
	switch( elm.id )
	{
		case	"LG_PREVIOUS":
			if( current_image > 0)
			{
				current_image -= 1;
				destination_image = current_image;
			 	gallery_timer_start(10, 2, 0, 1);
			 	refresh_lg_buttons();			 	
		 	}
		break;

		case	"LG_NEXT":
			if( ( current_image + 1 ) < gallery_nb_photos )
			{
				current_image += 1;
				destination_image = current_image;				
			 	gallery_timer_start(10, 2, 0, 2);
			 	refresh_lg_buttons();
			}
		break;

		case	"INDEX":
			 	gallery_timer_start(10, 3, 0);
				inlineInfo.disable();			 	
		break;
	
		case	"PREVIOUS":
			inlineInfo.disable();
		 	destination_image = current_image - image_per_page;
		 	if( destination_image < 0 ) destination_image = 0;
		 	gallery_timer_start(10, 0);
		 	
			image_index_at_limit = image_per_page;
			gallery_refresh(false);
		 	
		break;
	
		case	"NEXT":
			inlineInfo.disable();		
		 	destination_image = current_image + image_per_page;
		 	gallery_timer_start(10, 0);

			image_index_at_limit = image_per_page;
			gallery_refresh(false);
		 	
		break;

		default:
			var pattern = /^(PAGE)/;
			if( pattern.test(str) == true )
			{
				page = str.slice(4,str.length);
				var c = page * image_per_page;
				if( c < gallery_nb_photos ) current_image = c;
				else						current_image += image_per_page;

				destination_image = current_image;
				image_index_at_limit = image_per_page;
				
				gallery_refresh(false);
			}
		break;
	}	
}

/* ------------------------------------------------------
*/
function mpHoverOver(evnt)
{
	elm = elm_from_event(evnt);
	elm.style.color = css_get_color(8);		// "#c0c0c0";
	elm.style.cursor = "pointer";	
}

function mpHoverOut(evnt)
{
	elm = elm_from_event(evnt);
	elm.style.color = css_get_color(9);		// "#202020";
	elm.style.cursor = "default";	
}