// -------------------------------------------------------------------------------  config variables and global definitions

var PAGINATION;
var NAV_X = 10;
var NAV_Y = 14;

function Navigation_select(s,m,p,i)
{
	if(!LISTENING) return;
	if(PAGES.setNext(s))
	{
		displayPanel.hide();
		LISTENING = false;
		PAGES.pages[PAGES.next()].setNext(m);
		if(p>=0)PAGES.getActivePage().activeProject = [PAGES.getActivePage().current(),p];
		if(i>=0)PAGES.getActivePage().activeImg = i;
		PAGES.getPage();
		return;
	}
	if(PAGES.getActivePage().setNext(m))
	{
		LISTENING = false;
		PAGES.getActivePage().getMenu(m);
		if(p>=0)
		{
			PAGES.getActivePage().activeProject = [PAGES.getActivePage().current(),p];
			if(i>=0)PAGES.getActivePage().activeImg = i;
			else PAGES.getActivePage().activeImg = 0;
			return;
		}
	}
	if(p>=0)
	{
		if(i>=0)PAGES.getActivePage().activeImg = i;
		else PAGES.getActivePage().activeImg = 0;
		getProject(p,i);
		return;
	}
	if(i>=0)
	{
		getProject(PAGES.getActivePage().activeProject,i);
		return;
	}
}


// ------------------------------------------------------------------------------- NavState Object

function NavState_last()			{ return this.lastVal; }
function NavState_next()			{ return this.nextVal; }
function NavState_current()			{ return (this.nextVal!=null ? this.nextVal : this.lastVal); }
function NavState_changed()			{ return (this.nextVal!=null); }
function NavState_getMinVal()		{ return (this.allowEmpty ? -1 : 0); }
function NavState_reset()			{ this.lastVal = this.defVal; this.nextVal = null; }
function NavState_clear(maxVal)		{ test = (this.allowEmpty ? -1 : 0); if(maxVal>=test) this.maxVal = maxVal; this.reset(); }
function NavState_setNext(val)
{ 
	if(!(val>=this.getMinVal() && val<=this.maxVal))
	{
		val=null;
		return false;
	}
	if(val==this.lastVal)
	{
		return false;
	}
	this.nextVal = val; 
	this.beforeChangeAction(); 
	return true; 
}
function NavState_finish()
{
	if(this.nextVal!=null) this.lastVal = this.nextVal;
	this.nextVal = null;
	this.afterChangeAction();
}
function NavState_beforeChangeAction()	{ return true; }
function NavState_afterChangeAction()	{ return true; }
function NavState_report(label)		{ str=(label ? label+"\n" : ""); str+="last: "+this.last()+" next: "+this.next()+" changed: "+this.changed(); alert(str); }
function NavState(maxVal,allowEmpty,defVal)
{
	this.maxVal = maxVal;
	this.allowEmpty = allowEmpty;
	
	this.getMinVal = NavState_getMinVal;
	this.last = NavState_last;
	this.next = NavState_next;
	this.current = NavState_current;
	this.changed = NavState_changed;
	this.reset = NavState_reset;
	this.clear = NavState_clear;
	this.setNext = NavState_setNext;
	this.finish = NavState_finish;
	this.beforeChangeAction = NavState_beforeChangeAction;
	this.afterChangeAction = NavState_afterChangeAction;
	this.report = NavState_report;
	
	this.defVal = defVal || this.getMinVal();
	this.reset();
}




// ------------------------------------------------------------------------------------------- Section Pagination
// the top-level navigation object
// implements NavState

function Pagination()
{
	if(!DATA) alert('DATA missing!');

	this.pages = new Array(DATA.length);
	this.beforeChangeAction = Pagination_beforeSectionChange;
	this.afterChangeAction = Pagination_afterSectionChange;

	this.init = Pagination_init;
	this.getPage = Pagination_getPage;
	this.getActivePage = Pagination_getActivePage;

	this.selectPageAnim = ANIMATOR.addFrameAnimation(10,Pagination_anim,this);
	this.selectPageAnim.setRTZ();
	this.selectPageAnim.whenFinished = function() { this.execScope.finish() };
}
Pagination.prototype = new NavState(6,false,6);

function Pagination_afterSectionChange()
{
	ap = this.getActivePage();
	if(ap.changed && ap.changed()) ap.getMenu();
	else
	{
		LISTENING = true;
		if(ap.activeProject) ap.showActiveProject();
	}
}

function Pagination_beforeSectionChange()
{
	displayPanel.hide();
	if(!atDefaultPage()) infoTab.src="img/pixel_clear.gif";
}

function Pagination_init()
{
	for(s=0; s<DATA.length; s++)
	{
		this.pages[s] = new Page(s,(s*20)+NAV_X,NAV_Y);
		this.pages[s].clear(DATA[s].length-1);
	}

//	defaultPage = createBlock(defPage_html,620,470,(DATA.length*20)+NAV_X,NAV_Y);
	defaultPage.setBgColor('#ffffff');
	enableClipping(defaultPage);
	
	defaultPage.revealPageAnim = ANIMATOR.addFrameAnimation(10,defPage_reveal_anim,defaultPage);
	defaultPage.revealPageAnim.goToEnd();
	
	defaultPage.setRelativeLeft = returnTrue;
	defaultPage.setNext = returnTrue;
	defaultPage.getMenu = returnTrue;
	defaultPage.revealPageAnim.getCurrentFrame = new Function("return 0");
	defaultPage.show();
	
	this.pages[DATA.length] = defaultPage;
}

function Pagination_getPage()
{
	this.pages[this.last()].revealPageAnim.setTarget(0);
	this.pages[this.next()].revealPageAnim.setTarget(10);
	this.selectPageAnim.playFwd();
}
	
function Pagination_getActivePage()
{
	return this.pages[this.current()];
}	

function Pagination_anim(frame)
{
	fs = Math.min(this.current(),this.last());
	ls = Math.max(this.current(),this.last());
	var leftOffset = 0;
	for(var i=fs; i<=ls; i++)
	{
		this.pages[i].revealPageAnim.playNextFrame();
		this.pages[i].setRelativeLeft(leftOffset);
//		leftOffset+=this.pages[i].revealPageAnim.getCurrentFrame()*60;
		leftOffset+=this.pages[i].revealPageAnim.frameAt*60;
	}
//	if(frame==this.selectPageAnim.frameTo) this.finish();
}

// ------------------------------------------------------------------------------------------------- Section Page
// one for each section in the navigation
// implements NavState

function defPage_reveal_anim(frame)
{
	this.setClipMask((frame*60)+20,470,600-(frame*60),0);
}

function Page(s, home_left, home_top)
{
	this.home_left = home_left;
	this.home_top = home_top;
	var numMaps = DATA[s].length;
	
	for(var i = 0; i<DATA[s].length; i++)
	{
		projs = DATA[s][i].projects;
		for(var ii = 0; ii<projs.length; ii++)
		{
			PROJECTS[projs[ii].id].m=i;
			PROJECTS[projs[ii].id].p=ii;
		}
	}
	
	this.activeProject = null;
	this.activeImg = 0;
	
	this.beforeChangeAction = Page_beforeMapChange;
	this.afterChangeAction = Page_afterMapChange;
	
	this.showActiveProject = Page_showActiveProject;

	// build "handle" (graphic with name of section)
	this.tab = pageTabs[s];
	enablePositioning(this.tab);
	this.tab.setBgColor("#ffffff");

	// build inner strips, joined in one long panel
	this.menuStrip = pageBlocks[s];
	enableClipping(this.menuStrip);
	this.menuStrip.setBgColor("#ffffff");
	this.menuStrip.setClipMask(600,80,0,0);
	
	this.setRelativeLeft = Page_setRelativeLeft;

	this.switchMenuAnim = ANIMATOR.addFrameAnimation((numMaps-1)*8,Page_switchMenu_anim,this);
	this.switchMenuAnim.goToStart();
	this.switchMenuAnim.whenFinished = function() {this.execScope.finish()};
	this.revealPageAnim = ANIMATOR.addFrameAnimation(10,Page_reveal_anim,this);
	this.revealPageAnim.goToStart();

	this.getMenu = Page_getMenu;
	
	this.tab.show();
	this.menuStrip.show();
}
Page.prototype = new NavState(2,false,0);

function Page_setRelativeLeft(left)
{
	this.menuStrip.setLeft(this.home_left+left+20-(this.current()*600));
	this.tab.setLeft(this.home_left+left);
}

function Page_getMenu()
{
	target = this.current()*8;
	this.switchMenuAnim.setTarget(target);
	this.switchMenuAnim.playToTarget();
}

function Page_afterMapChange()
{
	LISTENING = true;
	if(this.activeProject) this.showActiveProject();
}

function Page_beforeMapChange()
{
}

function Page_showActiveProject()
{
	if(!this.activeProject) return;
	if(displayPanel.cntains[0]== this.activeProject[0] && displayPanel.cntains[1]== this.activeProject[1])
	{
		if(!displayPanel.isVisible())
		{
			displayPanel.setLeft(this.home_left+19+(this.current()>0 ? 17 : 0));
			loadingMatte.setLeft(this.home_left+19+(this.current()>0 ? 17 : 0));
		}
		displayPanel.show();
	}
	if(displayPanel.isVisible()) displayPanel.hide();
	displayPanel.setLeft(this.home_left+19+(this.current()>0 ? 17 : 0));
	loadingMatte.setLeft(this.home_left+19+(this.current()>0 ? 17 : 0));

	s = PAGES.current();
	m = this.activeProject[0];
	p = this.activeProject[1];
	i = (this.activeImg >=0 ? this.activeImg : 0);
	if(i>=DATA[s][m].projects[p].images.length)
	{
		this.activeImg = 0;
		i=0;
	}

	loadingMatte.show();
	displayPanel.rewrite(displayImgHtml(DATA[s][m].projects[p],p,i));
	displayPanel.cntains = [m,p];
	displayPanel.show();
}

function Page_reveal_anim(frame)
{
	this.menuStrip.setClipMask(frame*60,80,this.current()*600,0);
}

function Page_switchMenu_anim(frame)
{
	this.menuStrip.setLeft((this.home_left+20) -(frame*75));
	this.menuStrip.setClipMask(600,80,(frame*75),0);
//	if(frame==this.switchMenuAnim.frameTo) this.finish();
}

function getProject(p,i)
{
	m = PAGES.getActivePage().current();
	i = (i>=0 ? i : 0);

	PAGES.getActivePage().activeProject = [m,p];
	PAGES.getActivePage().activeImg = i;
	
//	alert("map: "+m+" project: "+p+" image: "+i);
	
	PAGES.getActivePage().showActiveProject();	
}
	
// -------------------------------------------------------------------------------------------------- html markup generation

var displayImageLoaded = 0;

// <img src="img/back.gif" width="9" height="13" border="0" alt="" hspace="4" align="'+(m/2==parseInt(m/2) ? "top" : "bottom")+'">
//<a href="#" onmouseover="Navigation_select('+s+','+(m-1)+');">

// <img src="img/fwd.gif" width="9" height="13" border="0" alt="" hspace="4" align="'+(m/2==parseInt(m/2) ? "top" : "bottom")+'">
//<a href="#" onmouseover="Navigation_select('+s+','+(m+1)+');">

// _top = 0,0,8,12
// _bottom = 0,51,8,63

// w = 9
// h = 64



// 

imgMid = 0;
function fStripHtml(s,m,file,numAreas)
{
	mapName = "s"+s+"_m"+m;
	mapStr = '\n<map name="'+mapName+'">';
	for(var p=0; p<numAreas; p++)
	{
		mapStr += '\n<area shape="rect" coords="'+(p*66)+',0,'+((p*66)+64)+',64"';
		mapStr += ' href="#"';
		mapStr += ' alt="'+DATA[s][m].projects[p].text+'"';
//		mapStr += ' onmouseover="overItem('+s+','+m+','+p+');" ';
//		mapStr += ' onmouseout="outItem('+s+','+m+','+p+');" ';
		mapStr += ' onclick="Navigation_select('+s+','+m+','+p+'); ';
			if(document.all) mapStr += 'this.blur(); ';
			mapStr += 'return false"';
		mapStr += '>';
	}
	mapStr += '\n</map>';
	
	var str = "";
	if(m>0)
	{

		imgMid++;
		imgOr = (m/2==parseInt(m/2) ? "top" : "bottom");
		coords = (imgOr=="top" ? "0,0,8,12" : "0,51,8,63");	
		str+= '<img src="img/back_'+(imgOr)+'.gif" width="9" height="64" border="0" alt="" hspace="4" vspace="0" usemap="#fwdback'+(imgMid)+'"><map name="fwdback'+(imgMid)+'"><area shape="rect" coords="'+(coords)+'" href="#" onmouseover="Navigation_select('+s+','+(m-1)+');"></map>';

//		str+= '<a href="#" onmouseover="Navigation_select('+s+','+(m-1)+');"><img src="img/back.gif" width="9" height="13" border="0" alt="" hspace="4" align="'+(m/2==parseInt(m/2) ? "top" : "bottom")+'"></a>';
		
	}
	str += '<img src="'+strip_path+'/'+DATA[s][m].directory+'/'+file+'" ';
	str += 'height="64" border="0" ';
	str += 'usemap = "#'+ mapName +'" ';
	str += 'alt="">';
	if(m<(DATA[s].length-1))
	{

		imgMid++;
		imgOr = (m/2==parseInt(m/2) ? "top" : "bottom");
		coords = (imgOr=="top" ? "0,0,8,12" : "0,51,8,63");	
		str+= '<img src="img/fwd_'+(imgOr)+'.gif" width="9" height="64" border="0" alt="" hspace="4" vspace="0" usemap="#fwdback'+(imgMid)+'"><map name="fwdback'+(imgMid)+'"><area shape="rect" coords="'+(coords)+'" href="#" onmouseover="Navigation_select('+s+','+(m+1)+');"></map>';

//		str+= '<a href="#" onmouseover="Navigation_select('+s+','+(m+1)+');"><img src="img/fwd.gif" width="9" height="13" border="0" alt="" hspace="4" align="'+(m/2==parseInt(m/2) ? "top" : "bottom")+'"></a>';
	}
	
	str += mapStr;

	return str;
}

function displayImageWhenLoaded()
{
	if(!displayImageLoaded) return;
	loadingMatte.hide();
	displayImageLoaded = 0;
}

function displayImgHtml(project,p,selImg)
{
	selImg = selImg || 0;
	imgSrc = DATA[PAGES.current()][PAGES.getActivePage().current()].directory + "/" + project.images[selImg];
	
	imgTag = '<img src="img/pixel_clear.gif" width="1" height="340" hspace="0" vspace="0" align="bottom" border="0" alt=""><img src="'+ display_path +'/'+imgSrc+'" align="baseline" alt=\"\"';
		if (project.border) imgTag +=' border=1';
		imgTag +=' onload="displayImageLoaded = 1"';
	imgTag+= '>';

	caption = '<p class="displayInfo"><span class="text1" style="font-family: helvetica, arial, sans-serif; font-size: 13px; font-weight:bold; color: #333333;">'+project.text+'</span><br><span class="text2" style="font-family: helvetica, arial, sans-serif; font-size: 11px; color: #000000;">'+project.text2+'</span></p>';
	
	imgSelector = "";
	if(project.images.length>1)
	{
		for(var i=0; i<project.images.length; i++)
		{
			if(i!=selImg)
			{
				imgSelector+='<a href="#" onclick="Navigation_select('+PAGES.current()+','+PAGES.getActivePage().current()+','+p+','+ i +'); return false">';
				imgSelector+='<img src="img/dimg_o.gif" width="12" height="14" hspace="1" border="0" alt="">';
				imgSelector+='</a>';
			}
			else imgSelector+= '<img src="img/dimg_z.gif" width="12" height="14" hspace="2" border="0" alt="">';
//			imgSelector += "<br>";
		}
	}
	
	str="";
	str+= blockHTML(imgTag,'i',421,341,0,0,1);
	str+= blockHTML(caption,'c',214,140,430,304,1);

//	str+= blockHTML(blockHTML('loading','x',80,40,350,304,1),'loading',421,341,0,0,1,"#ff00ff");

	if(imgSelector!="")str+= blockHTML(imgSelector,'s',214,16,432,272,1);
	
	return str;
}

function findElement(objID,scope)
{
	
}

function spacer(w,h)
{
	return '<img src="img/pixel_clear.gif" width="'+w+'" height="'+h+'" hspace="0" vspace="0" border="0" alt="">';
}

function hideLoading()
{
	window.setTimeout("objHide('loading',displayPanel)",1000);
}

function objHide(objID,scope)
{
//	return true;
	if(!scope) scope=window;
	if(document.layers && scope.document.layers[objID]) scope.document.layers[objID].visibility = "hidden";
	if(document.all && scope.document.all[objID]) scope.document.all[objID].style.visibility = "hidden";
	else if(document.getElementById && document.getElementById(objID)) document.getElementById(objID).style.visibility = "hidden";
}

function Page_tab_markup(s)
{
	var imgSrc = display_path + "/" + DATA[s][0].directory + "/" + DATA[s][0].directory + "_h.gif";
	var html = '<a href="#" onmouseover="Navigation_select('+s+');">';
	html += '<img src="'+imgSrc+'" border=0 alt="" hspace=4></a>';
	return html;
}

function Page_mapStrips_markup(s)
{
	var str = "";
	idStem = "s"+s+"_i";
	var x = 0;
	var y = 0;
	for(var m=0; m<DATA[s].length; m++)
	{
		str += blockHTML(
			fStripHtml(s,m,DATA[s][m].filename,DATA[s][m].projects.length),
			idStem+m,600,72,x,y,true);
		x+=600;
	}
	return str;
}



// ------------------------------------------------------------------------------  global state variables

var LISTENING = true;

// ------------------------------------------------------------------------------  util

function props(separator)
{
	str="";
	for(prop in this)
	{
		str+=prop+": "+this[prop] + separator;
	}
	return str;
}
Object.prototype.props = props;