///////////////////////////
function EnlargeImageInLightbox( i ) {
///////////////////////////

	ShowImage( i, 0	);
	SetVisibility( 'mainlayer',	'visible' );
	SetVisibility( 'lightboxlayer',	'hidden' );
}

///////////////////////////
function DisplayLightbox() {
///////////////////////////

	// unload small	images elements	in the mainlayer
	SetupSmall(	'none' );

	// register	and	render light box links
	clinks_href	= new Array();
	clinks_txt	= new Array();
	clinks_href.push('javascript:DisplayLightbox()');
	clinks_txt.push( ls_lightbox );
	clinks_href.push('javascript:HideLightbox()');
	clinks_txt.push( ls_albumview );
	RenderCtrlLinks();

	// write title and link
	document.getElementById('title_lb').innerHTML =	title;
	document.getElementById('ctrllinks_lb').innerHTML =	'<a	class="control"	href="javascript:HideLightbox()">'+ls_albumview+'</a>';

	// write thumbnails
	var	border = 14;
	var	html = '';
	for	(i=0;i<nbImages;i++) {

		var	hfill	 = maxSmallW-smallWidth[i];
		var	vfill	 = maxSmallH-smallHeight[i];
		var	m_left	 = border +	Math.floor(	hfill/2	);
		var	m_right	 = border +	Math.ceil (	hfill/2	);
		var	m_top	 = border +	Math.floor(	vfill/2	);
		var	m_bottom = border +	Math.ceil (	vfill/2	);

		var	mac	= GetMajorCaption(i).replace( /"/g,	'&quot;' );
		var	re	= /<\S[^>]*>/g;
		mac	= mac.replace(re,""); // strip html

		html +=	'<a	href="javascript:EnlargeImageInLightbox('+i+')">';
		html +=	'<img style="display: inline; padding: 0px;	border:	0px	solid black; ';
		html +=	'margin-left: '+m_left+'px;	margin-right:'+m_right+'px;	';
		html +=	'margin-top:'+m_top+'px; margin-bottom:'+m_bottom+'px;"	';
		html +=	'src="'+smallDir+'/'+ImageFile(i)+'" ';
		html +=	'width="'+smallWidth[i]+'" ' ;
		html +=	'height="'+smallHeight[i]+'" ' ;
		html +=	'galleryimg="no" title="'+mac+'" alt="'+mac+'" />';
		html +=	'</a> ';
	}
	document.getElementById('images_lb').innerHTML = html;

	// write footer
	document.getElementById('footer_lb').innerHTML = PortaMagicFooter(footer);

	// hide	the	main layer and show	the	lightbox
	SetVisibility( 'mainlayer',	'hidden' );
	SetVisibility( 'lightboxlayer',	'visible' );
}

///////////////////////////
function HideLightbox()	{
///////////////////////////

	// unload lightbox images to conserve memory
	document.getElementById('images_lb').innerHTML = '';

	// turn	on small images	in the main	layer
	SetupSmall(	smallPos );

	// unregister links
	clinks_href	= new Array();
	clinks_txt	= new Array();
	RenderCtrlLinks();

	// hide	lightbox and show the main layer
	SetVisibility( 'mainlayer',	'visible' );
	SetVisibility( 'lightboxlayer',	'hidden' );
}

///////////////////////////
function ShowingFirstImage() {
///////////////////////////

	if (intro!='') {

		return currentImage==-1;
	}

	return currentImage==0;
}

///////////////////////////
function ShowingLastImage()	{
///////////////////////////

	return currentImage==(nbImages-1);
}

///////////////////////////
function ShowHome()	{
///////////////////////////

	ShowImage( -1, 1 );
}

///////////////////////////
function Next()	{
///////////////////////////

	if ( !ShowingLastImage() ) {

		ShowImage( currentImage+1, 1 );
	}
}

///////////////////////////
function Previous()	{
///////////////////////////

	if ( !ShowingFirstImage() )	{

		ShowImage( currentImage-1, 1 );
	}
}

//////////////////////////
function ImageFile(	imgNb )	{
//////////////////////////

	return imageFilename[imgNb];
}

//////////////////////////
function GetMinorCaption(imgNb)	{
//////////////////////////

	return minorCaption[imgNb];
}

//////////////////////////
function GetMajorCaption(imgNb)	{
//////////////////////////

	return majorCaption[imgNb];
}

//////////////////////////
function ShowHidePrevNext()	{
//////////////////////////

	document.getElementById('previous').style.visibility = ShowingFirstImage() ? 'hidden' :	'visible';
	document.getElementById('next').style.visibility = ShowingLastImage() ?	'hidden' : 'visible';
}

//////////////////////////
function WaitCursorOn()	{
//////////////////////////

	var	e =	document.getElementsByTagName('body');
	for(i=0;i<e.length;i++)	{ e.item(i).style.cursor = 'wait'; }
	e =	document.getElementsByTagName('a');
	for(i=0;i<e.length;i++)	{ e.item(i).style.cursor = 'wait'; }
	e =	document.getElementsByTagName('table');
	for(i=0;i<e.length;i++)	{ e.item(i).style.cursor = 'wait'; }
}

//////////////////////////
function WaitCursorOff() {
//////////////////////////

	var	e =	document.getElementsByTagName('body');
	for(i=0;i<e.length;i++)	{ e.item(i).style.cursor = 'default'; }
	e =	document.getElementsByTagName('a');
	for(i=0;i<e.length;i++)	{ e.item(i).style.cursor = 'pointer'; }
	e =	document.getElementsByTagName('table');
	for(i=0;i<e.length;i++)	{ e.item(i).style.cursor = 'default'; }
}

//////////////////////////
var	cacheImage = new Image();
//////////////////////////
function CacheNextImage() {
//////////////////////////

	// cache the next image
	if ( !ShowingLastImage() ) {

		cacheImage.src = mediumDir+'/'+ImageFile(currentImage+1);
	}
}

//////////////////////////
// private functions used by ShowImage()
//////////////////////////
		var	mainImage =	new	Image();

		//////////////////////////
		function MainImageLoadDone() {
		//////////////////////////

			// turn	off	the	wait cursor
			WaitCursorOff();

			// cache next image
			CacheNextImage();
		}

		//////////////////////////
		function LoadMainImage() {
		//////////////////////////


		}
//////////////////////////
// end of private functions
//////////////////////////

//////////////////////////
function GenerateImageAndCaptionHTML( imageIdx,	onloadhandler )	{
//////////////////////////

	var	mac	= GetMajorCaption(imageIdx);
	var	mic	= GetMinorCaption(imageIdx).replace( /"/g, '&quot;'	);

	var	mihtml = '<img name="imagepane"	onload="'+onloadhandler+'" class="medium" src="' + mediumDir + '/'+ImageFile(imageIdx)+'" ';
	mihtml	  += ' title="'+mic+'" alt="'+mic+'" />';
	if (largeImages) {

		mihtml = '<a href="javascript:OpenLarge('+imageIdx+')">'+mihtml+'</a>';
	}
	var	bordersize = 1;
	cap_width =	parseInt(mediumWidth[imageIdx]+2*bordersize);
	mihtml += '<div	style="width:'+cap_width+'px;" class="caption">'+mac+'<br/></div>';

	return mihtml;
}

//////////////////////////
function ShowImage(	imgNb, scrollsmall ) {
// changes 'currentImage'
//////////////////////////

	// set the current image number
	currentImage = imgNb;

	// load	image, captions, et	cetera

	// hide/show next, previous	links
	ShowHidePrevNext();

	// render main item
	if (currentImage==-1) {

		// an intro	page text is existing and requested
		var	mihtml = '';
		mihtml += '<br/>';
		mihtml += '<div	id="intro" style="text-align:left;min-height:'+mediumHeight[0]+'px;">'+intro+'</div>';
		document.getElementById('mainimage').innerHTML = mihtml;

		// cache next image
		CacheNextImage();
	} else {

		// turn	on wait	cursor
		WaitCursorOn();

		// render image	and	caption	html
		document.getElementById('mainimage').innerHTML = GenerateImageAndCaptionHTML( currentImage,	'MainImageLoadDone()' );

		// nasty opera work-around
		var	isOpera	= (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
		if (isOpera) {

			// image onload	is not supported, hence	call it	directly
			MainImageLoadDone();
		}
	}

	// scroll to show the corresponding	small image
	var	sif	= document.getElementById('smalliframe');
	if (scrollsmall	&& sif)	{

		anchor = imgNb>=0 ?	imgNb :	'top';
		sif.src='small.html#'+anchor;
	}
}

//////////////////////////
function ImageBrowsingKeydownHandler( e	) {
//////////////////////////

	if (!e)	e =	window.event;
	if (e.type!='keydown') { return; }

	var	mp = parent	? parent : this;

	switch (e.keyCode) {

		case 37:	// left_arrow
					mp.Previous();
					break;

		case 39:	// right_arrow
					mp.Next();
					break;
		default:
	}
}

///////////////////////////
function OpenLarge(	imgNb )	{
///////////////////////////

	var	w =	largeWidth[imgNb];
	var	h =	largeHeight[imgNb];
	var	sw = screen	? screen.width : w;
	var	sh = screen	? screen.height	: h;
	var	scrollbars = 'no';
	var	gutter = 100;

	if (sw-gutter<w	|| sh-gutter<h)	{

		scrollbars = 'yes';
		w =	sw-gutter;
		h =	sh-gutter;
	}

	window.open('large.html',
				'',
				'width='+w+
				',height='+h+
				',resizable=yes,menubar=no,toolbar=no,status=no,location=no'+
				',scrollbars='+scrollbars+
				',left='+( (sw-w)/2	)+
				',top='+( (sh-h)/2 )+
				',screenX='+( (sw-w)/2 )+
				',screenY='+( (sh-h)/2 ) );
}

//////////////////////////
function SetupSmall( smallPosSetting ) {
//////////////////////////

	var	stym = document.getElementById('maincontent').style;

	if (smallPosSetting=='none') {

		// empty iframe
		document.getElementById('smalliframe_span').innerHTML =	'';

		// set the main	content	to fill	the	browser
		stym.left	= '0px';
		stym.top	= '0px';
		stym.bottom	= '0px';
		stym.right	= '0px';
		return;
	}

	var	iframe = '<iframe src="small.html" id="smalliframe"	name="smalliframe" frameborder="no"	scrolling="auto"></iframe>';
	document.getElementById('smalliframe_span').innerHTML =	iframe;

	var	sty	 = document.getElementById('smalliframe').style;
	var	scrollbarsize =	16;
	var	marginsize = 2*1+2*3+10;
	var	w =	parseInt(maxSmallW+scrollbarsize+marginsize+9)+'px';
	var	h =	parseInt(maxSmallH+scrollbarsize+marginsize)+'px';
	switch (smallPosSetting) {

		case 'top':		sty.left	= '0px';
						sty.top		= '0px';
						sty.width	= '100%';
						sty.height	= h;
						stym.top	= h;
						break;

		case 'bottom':	sty.left	= '0px';
						sty.bottom	= '0px';
						sty.width	= '100%';
						sty.height	= h;
						stym.bottom	= h;
						break;

		case 'right':	sty.right	= '0px';
						sty.top		= '0px';
						sty.width	= w;
						sty.height	= '100%';
						stym.right	= w;
						break;

		case 'left':
		default:		sty.left	= '0px';
						sty.top		= '0px';
						sty.width	= w;
						sty.height	= '100%';
						stym.left	= w;
						break;
	 }
	 sty.visibility	= 'visible';
}

///////////////////////////
function PortaMagicFooter( footerStr ) {
///////////////////////////

	var	p_link = ' <a href=\"http://www.stegmann.dk/mikkel/porta/\"	class="control">Porta</a>';
	return footerStr.replace( /	Porta/g, p_link	);
}

///////////////////////////
function ShowAll() {
///////////////////////////

	var	html = '';
	for	(i=0;i<nbImages;i++) {

		html +=	GenerateImageAndCaptionHTML( i,	'' );
	}
	document.getElementById('mainimage').innerHTML = html;
}

///////////////////////////
function RenderCtrlLinks() {
///////////////////////////

	var	ctrllinks =	'';
	for(i=0;i<clinks_href.length;i++) {

		ctrllinks += '&nbsp;&nbsp;<a class="control" href="' + clinks_href[i] +	'">' + clinks_txt[i] + '</a>';
	}
	ctrllinks += '<span	id="previous">&nbsp;&nbsp;<a class=control href="javascript:Previous()">'+ls_previous+'</a></span>';
	ctrllinks += '<span	id="next">&nbsp;&nbsp;<a class=control href="javascript:Next()">'+ls_next+'</a></span>';
	document.getElementById('ctrllinks').innerHTML = ctrllinks;
}

///////////////////////////
function SetupAlbum() {
///////////////////////////

	// set document	title
	document.title = title.replace(/(<([^>]+)>)/ig,"");

	// set main	image cell size
	var	bordersize = 2;
	document.getElementById('imagecell').style.width = parseInt(maxMediumW+2*bordersize)+'px';

	// render title
	document.getElementById('title').innerHTML = title;

	// render footer
	document.getElementById('footer').innerHTML	= PortaMagicFooter(footer);

	// render links
	RenderCtrlLinks();

	// render image
	ShowImage( currentImage, 0 );

	// write status	message
	window.status =	'This is a Porta photo album. Use the left and right arrow keys	to navigate.';

	// register	key	handler
	document.onkeydown = ImageBrowsingKeydownHandler;

	// show	thumbnails
	SetupSmall(	smallPos );

	CacheNextImage();
}

///////////////////////////
function GetObj(name) {
///////////////////////////

	if (document.getElementById) {

		this.obj = document.getElementById(name);
		this.style = document.getElementById(name).style;
	}
	else if	(document.all) {

		this.obj = document.all[name];
		this.style = document.all[name].style;
	}
	else if	(document.layers) {

		this.obj = document.layers[name];
		this.style = document.layers[name];
	}
}

///////////////////////////
function SetVisibility(obj_id,status) {
///////////////////////////

	var	x =	new	GetObj(obj_id);
	x.style.visibility = status;
}

//////////////////////////
function RenderSmall() {
//////////////////////////

	var	vert = smallPos=='left'	|| smallPos=='right';
	var	html = '';

	html +=	'<table>';

		if (!vert) { html += '<tr>'; }

			// control links
			if (vert) {	html +=	'<tr>';	}
				html +=	'<td>';
					if (slink_href!='' && slink_txt!='') {

						html +=	'<a	class="control"	target="_parent" href="'+slink_href+'">'+slink_txt+'</a><br/>';
					}
					if (intro!='') { html += '<a name="top"></a><a class="control" href="javascript:parent.ShowHome()">'+ls_home+'</a><br/>'; }
					html +=	'<a	class="control"	href="javascript:parent.ShowAll()">'+ls_showall+'</a><br/>';
					html +=	'<a	class="control"	href="javascript:parent.DisplayLightbox()" target="_parent">'+ls_lightbox+'</a><br/>';
				html +=	'</td>';
			if (vert) {	html +=	'</tr>'; }


			// images
			for	(i=0; i<nbImages; i++) {

				if (vert) {	html +=	'<tr>';	}
					html +=	'<td style="vertical-align:	middle;	text-align:	center;">';
						html +=	'<a	name='+i+' href="javascript:parent.ShowImage('+i+',0)">';
						html +=	'<img class="small"	src="'+smallDir+'/'+ImageFile(i)+'"';
						html +=	' style="margin: auto;"';
						html +=	' width="'+smallWidth[i]+'"';
						html +=	' height="'+smallHeight[i]+'"';
						html +=	' galleryimg="no" />';
						html +=	'</a>';
					html +=	'</td>';
				if (vert) {	html +=	'</tr>'; }
			}

		if (!vert) { html += '</tr>'; }

	html +=	'</table>';

	var	bordersize = 1;
	if (vert) {

		document.getElementById('smallpaper').style.width =	parseInt(maxSmallW+2*bordersize)+'px';
		document.getElementsByTagName('html').item(0).style.overflowX =	'hidden';
	} else {

		document.getElementById('smallpaper').style.height = parseInt(maxSmallH+2*bordersize)+'px';
		document.getElementById('smallpaper').style.whiteSpace = 'nowrap';
		document.getElementById('smallpaper').style.marginTop =	'2px';
	}
	document.getElementById('smallcell').innerHTML = html;
}