var DHTML = document.getElementById || document.all || document.layers  ? true : false,
	ie5  = (document.all && document.getElementById),
	ns6 = (!document.all && document.getElementById),
	msie = userAgentContains( 'msie' ),
	mozilla = userAgentContains( 'mozilla' ),
	MethodOne = ie5,
	EventSuccess = msie || mozilla ? true : false,
	FilmStrip,
	FilmStrip2,
	HeadTag,
	ContainerTag,
	ClientFrameTag,
	BodyTag,
	FadeTag,
	Holes1,
	Holes2,
	PosX = 0,
	FlipX = 0,
	HolesX = 0,
    ImageCount = 0,
	FrameLoop = 0,
	ImageLoop = 0;
	Delay1 = 50,
	movementStep = 2; // 1 2 4 8 17
	movementActive = true,
	FrameWidth = 136,
	FrameHeight = 55,
	Frames = aStripImage.length,
	aImg = new Array,
	aAnchor = new Array,
	aImgFront = new Array,
	Resources = new Array,
	CurrentFrame = 0,
	TimerID1 = 0,
	setupComplete = false,
	pagerPage = 0,
	onloadCalled = false,
	fading = 0,
	minOpac = 0.01,
	fadeOpacity = 1.0,
	opacStep = 0.08;
	
function eventTemplateLoaded()
{
	HeadTag = document.getElementsByTagName( 'head' )[ 0 ];
	BodyTag = document.getElementsByTagName( 'body' )[ 0 ];
	ContainerTag = document.getElementById( 'container' );
	ClientFrameTag = document.getElementById( 'clientframe' );
	FadeTag = document.getElementById( 'fadeoverlay' );
	setOpacity(FadeTag, fadeOpacity);
	fading = 2;
	if (history.navigationMode)
		history.navigationMode="fast";
	if(onloadCalled)
		return;
	onloadCalled = true;
	setupFilmStrip();
	eventPageLoaded();
}

function pageReloaded( NoFade )
{
	fadeOpacity = 1.0;
	fading = 2;
	setOpacity(FadeTag, fadeOpacity);
	setCellPager( 0 );
	document.body.style.cursor = "auto";
	ClientFrameTag.scrollTop = 0;
}

function userAgentContains( browser )
{
	return navigator.userAgent.toLowerCase().indexOf( browser ) + 1;
}

function getObj( name )
{
	if( document.getElementById )
	{
		if( ! ( this.obj = document.getElementById( name ) ) )
			return false;
		this.style = document.getElementById( name ).style;
	}
	else if( document.all )
	{
		if( ! ( this.obj = document.all[ name ] ) )
			return false;
		this.style = document.all[ name ].style;
	}
	else if( document.layers )
	{
		if( ! ( this.obj = document.layers[ name ] ) )
			return false;
		this.style = document.layers[ name ];
	}
}
/*
function ReplaceHTML(id, text)
{
	if( document.getElementById )
	{
		x = document.getElementById( id );
		x.innerHTML = '';
		x.innerHTML = text;
	}
	else if( document.all )
	{
		x = document.all[ id ];
		x.innerHTML = text;
	}
	else if( document.layers )
	{
		x = document.layers[ id ];
		x.document.open();
		x.document.write( text );//'<p>' + text + '</p>' );
		x.document.close();
	}
	return true;
}*/

function ReplaceHTML( id, text )
{
	if( document.all )
		document.all[ id ].innerHTML = text;
	else
		if( document.getElementById )
		{
			rng = document.createRange();
			el = document.getElementById( id );
			rng.setStartBefore( el );
			htmlFrag = rng.createContextualFragment( text );
			while( el.hasChildNodes() )
				el.removeChild( el.lastChild );
			el.appendChild( htmlFrag );
		}
}

function BookmarkPage( title, url )
{
	if( document.all )
		window.external.AddFavorite( url, title );
	else if( window.sidebar )
		window.sidebar.addPanel( title, url, '' );
}

function setStatusNow( text )
{
	window.status = text;
	// we dont want the status in opera anyway, as it disables the tooltip, and ie doesnt work
	//return ( userAgentContains( "mozilla" ) || userAgentContains( "msie" ) ) ? true : false;
	return EventSuccess;
}

function setStatus( text )
{
	window.status = text;
	if( msie )
		setTimeout( 'setStatusNow( "' + text + '" )' , 10 );
	return EventSuccess;
	/*
	if( userAgentContains( "msie" ) )
	{
		setTimeout( 'setStatusNow( "' + text + '" )' , 0 );
		return false;
	}
	return setStatusNow( text );*/
}

function setMovement( on )
{
	if( ! setupComplete )
		return;

	if( ! movementActive )
	{
		if( on )
			TimerID1 = setInterval( 'moveFilmStrip()', Delay1 );
			
		// reset position?
	} else
		if( ! on )
			clearInterval( TimerID1 );
	movementActive = on;
}

function MouseOverCell( id )
{
	if( ! cellStatus[ id ] || cellStatus[ id ][ 1 ] == '' )
		return false;

	cell = document.getElementById( "cell" + id );
	cell.className = "cellContainerHover";
	setStatus( cellStatus[ id ][ 0 ] );
	return true;
}

function MouseOutCell( id )
{
	window.status = "";
	cell = document.getElementById( "cell" + id );
	cell.className = "cellContainer";
	return true;
}

function LoadScriptPage( URI )
{
	fading = 1;
	FadeTag.style.display = 'block';
	fadeOpacity = minOpac;
	setOpacity(FadeTag, fadeOpacity);
	document.body.style.cursor = 'wait';
	for(loop=0;loop!=8;++loop)
	{
		cell = document.getElementById( 'cellPoly' + loop );
		cell.removeAttribute('href');
		cell.style.cursor = 'wait';
	}
		
//	link = "http://www.beeliving.co.uk/2/" + URI;
//	ReplaceHTML( "container", '<p>Loading <a href="' + link + '">' + link + '</a>...</p>' );
	URI = ( -1 == URI.indexOf( "?" ) ) ? URI + '?js=1' : URI + '&js=1';
	Resources[ URI ] = false; // reload if its for the page
	LoadScript( URI );
//	ScriptTag.innerHTML = 'function eventPageLoaded(){}';
	return false;
}

function LoadScript( URI )
{
	if( Resources[ URI ] )
		return;
	Resources[ URI ] = true;
	ScriptTag = document.createElement( 'script' );
	ScriptTag.type = 'text/javascript';
//	ScriptTag.setAttribute( 'type', 'text/javascript' );
	ScriptTag.src = URI;
//	ScriptTag.setAttribute( 'src', URI );
	HeadTag.appendChild( ScriptTag );
}

function LoadStylesheet( URI )
{
	if( Resources[ URI ] )
		return;
	Resources[ URI ] = true;
	StyleTag = document.createElement( 'link' );
	StyleTag.rel = 'stylesheet';
	StyleTag.type = 'text/css';
	StyleTag.href = URI;
	HeadTag.appendChild( StyleTag );
}

/*
AjaxRequestOptions = {
	asynchronous:true,
    onSuccess: function(t) {
	    ReplaceHTML( "container", t.responseText );
    },
    on404: function(t) {
	    ReplaceHTML( "container", "Page not found" );
    },
    onFailure: function(t) {
	    ReplaceHTML( "container", "An error occurred, " + t.status + " - " + t.statusText );
    }
}*/

function ClickCell( id )
{
	id = parseInt( id );
	if( cellStatus[ pagerPage * 6 + id ]
		&& '' != ( URI = cellStatus[ pagerPage * 6 + id ][ 1 ] ) )
	{
		LoadScriptPage( URI );
//		window.eventPageLoaded();
	}
	return false;
	
/*	URI = ( -1 == URI.indexOf( "?" ) ) ? URI + '?xml=1' : URI + '&xml=1';
	new Ajax.Request( URI, AjaxRequestOptions );
	return false;*/
}

function setCell( id, name, URI, description, onclick )
{
	if( name )
		name = '<div class="outer"><div class="middle"><div class="inner">' + name + '</div></div></div>';
	ReplaceHTML( "cell" + id, name );
	Poly = document.getElementById( "cellPoly" + id );
	if( URI != "" ){
		Poly.setAttribute( "href", URI );
		Poly.style.cursor = "pointer";
	} else {
		Poly.removeAttribute( "href" );
		Poly.style.cursor = "default";
	}
	if( null != onclick )
		Poly.setAttribute( "onclick", onclick );
	Poly.setAttribute( "alt", description );
	Poly.setAttribute( "title", description );
}

function setCellPager( page )
{
	pagerPage = page;
	nextPage = page + 1;
	if( ( maxPage = cellStatus.length - 3 ) > 0 )
		maxPage = Math.floor( maxPage / 6 );
	if( nextPage > maxPage )
		nextPage = page;
	cell = document.getElementById( "cellUp" );
	if( nextPage != page )
	{
		setCell( 'Up', '+', '.', 'Up to next honey comb', 'return CellPage(' + nextPage + ')' );
		cell.className = "cellPager";
	} else {
		setCell( 'Up', '', '', '', '' );
		cell.className = "cellPager hidden";
	}

	nextPage = page - 1;
	if(nextPage < 0 )
		nextPage = page;
	cell = document.getElementById( "cellDown" );
	if( nextPage != page )
	{
		setCell( 'Down', '-', '.', 'Down to next honey comb', 'return CellPage(' + nextPage + ')' );
		cell.className = "cellPager";
	} else {
		setCell( 'Down', '', '', '', '' );
		cell.className = "cellPager hidden";
	}
}

function CellPage( page )
{
	if( ( maxPage = cellStatus.length - 3 ) > 0 )
		maxPage = Math.floor( maxPage / 6 );
	if( navPage + page < 0
		|| navPage + page > maxPage )
		return EventSuccess;
	navPage += page;
	page = navPage;
	offset = page * 6;
	for(loop = 2 ; loop != 8; ++loop )
	{
		if( ( cellInfo = cellStatus[ loop + offset ] ) )
			setCell( loop, cellInfo[ 2 ], cellInfo[ 1 ], cellInfo[ 0 ] );
		else
			setCell( loop, '', '', '' );
	}
	setCellPager( page );
	return EventSuccess;
		/*
	offset = page * 6;
	for(loop = 2 ; loop != 8; ++loop )
	{
		if( ( cellInfo = cellStatus[ loop + offset ] ) )
			setCell( loop, cellInfo[ 2 ], cellInfo[ 1 ], cellInfo[ 0 ] );
		else
			setCell( loop, '', '', '' );
	}
	setCellPager( page );
	return false;*/
}

function setFrame( index, imagePath, caption )
{	
	aAnchor[ index ].setAttribute( 'href', imagePath + '.jpg' );
 	aImgFront[ index ].setAttribute( 'alt', caption );
 	aImgFront[ index ].setAttribute( 'title', caption );
 	aImgFront[ index ].setAttribute( 'onmouseover', 'return setStatusNow( \'' + caption + '\' );' );
 	aImgFront[ index ].setAttribute( 'onmouseout', 'return setStatusNow( \'\' );' );
// 	aImgFront[ index ].setAttribute( 'onmouseclick', 'return LoadScriptPage( \'viewImage.js?' + imagePath + '\' );' );
 	aImg[ index ].setAttribute( 'alt', caption );
// 	aImg[ index ].setAttribute( 'src', imagePath + 't.jpg' );
	aImg[ index ].setAttribute( 'src', 'template/thumb.php?' + imagePath + '.jpg' );
}

function calculateFrames()
{
	Frames = Math.ceil( screen.width / FrameWidth ) + 1;
	ImageCount = aStripImage.length;
	if( ! MethodOne )
	{
		if( ( rem = Frames % ImageCount ) )
			Frames += ImageCount - rem;
 		ImageLoop = Frames % ImageCount;
	} else
		ImageLoop = 0; // not used
	window.previousWidth = screen.width;
}

function createFrame( loop, image )
{
 	newAnchor = document.createElement( 'a' );		
 	newImgFront = document.createElement( 'img' );
 	newImgFront.setAttribute( 'src', 'images/nav/1x1.gif' );			 	
 	newImg = document.createElement( 'img' );
	newImgFront.className = newImg.className = 'filmimage';
 	newImgFront.style.cssText = newImg.style.cssText = 'left:' + loop * FrameWidth + 'px';		
 				 	
	aAnchor[ loop ] = newAnchor;
	aImg[ loop ] = newImg;
	aImgFront[ loop ] = newImgFront;
	
	if( image != -1 )
		setFrame( loop, aStripImage[ image ], aCaption[ image ] );

 	FilmStrip2.obj.appendChild( newAnchor );
 	newAnchor.appendChild( newImgFront );
	FilmStrip1.obj.appendChild( newImg );
}

function updateFrames()
{
	var oldFrames = Frames;
	calculateFrames();
	if( Frames != oldFrames )
	{
		if( Frames > oldFrames )
		{ // add
			for(loop = oldFrames; loop != Frames; ++loop )
				createFrame( loop, -1 );
		} else {
			// remove
			for( loop = Frames; loop != oldFrames; ++loop )
		 	{
			 	aAnchor[ loop ].removeChild( aImgFront[ loop ] );
			 	FilmStrip2.obj.removeChild( aAnchor[ loop ] );
				FilmStrip1.obj.removeChild( aImg[ loop ] );
			}
		}
		// move back to start
		HolesX = FrameLoop = 0;
		PosX = PosX % FrameWidth;
		for( loop = 0; loop != Frames; ++loop )
			aImg[ loop ].style.left = aImgFront[ loop ].style.left = FrameWidth * loop + 'px';
		Holes1.style.left = Holes2.style.left = HolesX + 'px';
		FilmStrip1.style.left = FilmStrip2.style.left = PosX + 'px';

	}
	for( loop = 0, image = 0; loop != Frames; ++loop )
	{
		setFrame( loop, aStripImage[ image ], aCaption[ image ] );
		if( ++image == ImageCount )
			image = 0;
	}
}

function setupFilmStrip()
{
	if( DHTML )
	{
		Holes1 = new getObj( 'holes1' );
		Holes2 = new getObj( 'holes2' );
		FilmStrip1 = new getObj( 'filmstrip' );
		FilmStrip2 = new getObj( 'filmstrip2' );
		
		if( FilmStrip1 && FilmStrip2 && Holes1 && Holes2 )
		{
			Holes1.style.width = Holes2.style.width =
				FilmStrip1.style.width = FilmStrip2.style.width = screen.width + FrameWidth + 'px';

			calculateFrames();
			for( loop = 0, image = 0; loop != Frames; ++loop )
		 	{
			 	createFrame( loop, image );
				if( ++image == ImageCount )
					image = 0;
		 	}
			TimerID1 = setInterval( 'moveFilmStrip()', Delay1 );
			setupComplete = true;
		}
	}
}

function setFilmStrip( aNewImage, aNewCaption, Offset )
{
	setMovement( false );
	aStripImage = aNewImage;
	aCaption = aNewCaption;
	updateFrames();
	setMovement( true );
}

function offsetStripImages( Offset )
{
	for( loop = 0, imageIndex = Offset; loop != Frames; ++loop )
	{
		setFrame( loop, aStripImage[ imageIndex ], aCaption[ imageIndex ] );
		
		if( ++imageIndex == ImageCount )
			imageIndex = 0;
	}
}

function setOpacity(elem, opacity)
{
	if(msie)
	{
		opac = Math.floor(opacity*100);
		elem.style.filter="alpha(opacity="+opac+")";
	}
	if(mozilla)
		elem.style.mozOpacity = "" + opacity;
	elem.style.opacity = "" + opacity;
}


function moveFilmStrip()
{
	switch( fading )
	{
		case 2:
			fadeOpacity -= 4 * opacStep;
			if(fadeOpacity<minOpac)
			{
				fadeOpacity = minOpac;
				fading = 0;
				FadeTag.style.display = "none";
			}
			setOpacity(FadeTag, fadeOpacity);
			break;
		case 1:
			fadeOpacity += opacStep;
			if(fadeOpacity>1.0)
			{
				fadeOpacity = 1.0;
				fading = 0;
			}
			setOpacity(FadeTag, fadeOpacity);
			break;
		default:
			break;
	}
	
	if( ! movementActive )
		return;
		
	if( screen.width != window.previousWidth )
	{
		Holes1.style.width = Holes2.style.width =
			FilmStrip1.style.width = FilmStrip2.style.width = screen.width + FrameWidth + 'px';
		updateFrames();
	}

	PosX -= movementStep;

	if( MethodOne )
	{ // internet explorer likes this, maybe others
		if( PosX == -FrameWidth )
		{
			if( ++ImageLoop == ImageCount )
				ImageLoop = 0;
			offsetStripImages( ImageLoop );
			PosX = -movementStep;
		}
	} else { // method 2, for firefox
		if( ! ( PosX % FrameWidth ) )
		{
			if( ( FrameLoop + 1 ) == ImageCount )
			{
				// move back to start
				for( loop = 0; loop != Frames; ++loop )
					aImg[ loop ].style.left = aImgFront[ loop ].style.left = FrameWidth * loop + 'px';
				PosX = HolesX = FrameLoop = 0;
			} else {
				aImg[ FrameLoop ].style.left = aImgFront[ FrameLoop ].style.left = FrameWidth * ( Frames + FrameLoop ) + 'px';
				++FrameLoop;
//				ReplaceHTML("header", "FrameLoop="+FrameLoop+" Frames="+Frames);
				HolesX += FrameWidth;
			}
			Holes1.style.left = Holes2.style.left = HolesX + 'px';
		}
	}
	FilmStrip1.style.left = FilmStrip2.style.left = PosX + 'px';
}