//---- eMail String ----
eMailStr = "Wati" + "@" + "WatiDesi" + "gn.com";

//---- Colors ----------
LeftTop    = "7766BB";	//  peri
LeftBot    = "EEEE11";	//  yellow
LeftMid    = "EE66BB";	//  pink
TopStrip   = "EEEE11";	//  yellow
BotStrip   = "99DD55";	//  green
CtrBot     = "DD6633";	//  orange
CtrTop     = "AADD77";	//  green
CtrCtr     = "FFFFFF";	//  white
BrightPink = "FFFFFF";	//  white
Cream      = "FFFFFF";	//  white
Red        = "FFFFFF";	//  white
Orange     = "FFFFFF";	//  white
Black      = "000000";	//  black

var PageTitleStr = '<FONT COLOR=red SIZE=+1 FACE=Arial>All seasons, all occasions, all over the world ...</FONT>';	// Global
var PageNavBarStr = '';		// Global
var PageNavBarColor = "EE66BB";	// Global
function TitleAndNavBar(x)
{
	if(x == '') return;

	// Hack because Mozilla doesn't like global variables
	LeftTop    = window.LeftTop;
	LeftBot    = window.LeftBot;
	LeftMid    = window.LeftMid;
	TopStrip   = window.TopStrip;
	BotStrip   = window.BotStrip;
	CtrBot     = window.CtrBot;
	CtrTop     = window.CtrTop;
	CtrCtr     = window.CtrCtr;
	BrightPink = window.BrightPink ;
	Cream      = window.Cream;
	Red        = window.Red;
	Orange     = window.Orange;
	Black      = window.Black;

	var i;
	PageNavBarStr = "";
	var iMax = PageArray.length;
	for(i = 0; i < iMax; i++)
	{
		var Label = PageArray[i][0];
		var URL = PageArray[i][2];
		if(Label == x)
		{
			cBegin = "<font color=red>";
			cEnd = "</font>";
			PageTitleStr = PageArray[i][1];
		}
		else
		{
			cBegin = "<a href=" + URL + "><font color=#" + PageNavBarColor + "><u>";
			cEnd = "</u></font></a>";
		};

		PageNavBarStr = PageNavBarStr + cBegin + Label + cEnd;
		if(i < iMax - 1) PageNavBarStr = PageNavBarStr + "<font color=red>&nbsp;&nbsp;|&nbsp;&nbsp;</font>";
	}

	PageNavBarStr = "<FONT SIZE=-2 face=Arial><B>" + PageNavBarStr + "</B></FONT>";
	if(PageTitleStr)
	{
		PageTitleStr = "<FONT SIZE=+1 COLOR=red face=Arial><center>" + PageTitleStr + "&nbsp; &nbsp;</center></FONT>";
	}
	else
	{
		PageTitleStr = " ";
	}
}

function p(x) { document.writeln(x); }

function LayoutTop(PageName)
{
	LayoutTop1(PageName);
	// Caller can call these separately and put hidden text between them.
	// If so, the font color must match the background color in LayoutTop1.
	// E.g., see index.html.
	LayoutTop2();
}

function LayoutTop1(PageName)
{
	TitleAndNavBar(PageName);

	p("<DIV ALIGN=center>");
	p("<TABLE COLS=3 ROWS=6 CELLSPACING=0 CELLPADDING=0 BORDER=0>");
	p("	<TR>");
	p("		<TD WIDTH=88></TD>");
	p("		<TD WIDTH=680></TD>");
	p("		<TD WIDTH=88></TD>");
	p("	</TR>");
	p("	<TR HEIGHT=185>");
	p("		<TD BGCOLOR=#" + LeftTop + "></TD>");
	p("		<TD BGCOLOR=#" + CtrTop + ">");	// Color to match for hidden text

	p("<DIV ALIGN=center>");
	p("<TABLE COLS=3 ROWS=4 CELLSPACING=2 CELLPADDING=2 BORDER=0>");
	p("	<TR VALIGN=bottom>");
	p("		<TD ROWSPAN=4 WIDTH=180><IMG SRC=Logo.jpg WIDTH=170 HEIGHT=170></TD>");
	p("		<TD WIDTH=490 COLSPAN=2 ALIGN=left><FONT SIZE=+3 COLOR=red FACE=Arial>Clothing for Girls</FONT></TD>");
	p("	</TR><TR VALIGN=top>");
	p("		<TD WIDTH=25></TD>");
	p("		<TD WIDTH=465><FONT SIZE=+0 COLOR=red FACE=Arial>Pretty, practical, easy-care and fun</FONT></TD>");
	p("	</TR>");
	p("	<TR VALIGN=bottom>");
	p("		<TD COLSPAN=2 WIDTH=465>" + PageTitleStr);
}

function LayoutTop2(PageName)
{
	p("		</TD>");
	p("	</TR>");
	p("	<TR>");
	p("		<TD COLSPAN=2 ALIGN=center>" + PageNavBarStr + "</TD>");
	p("	</TR>");
	p("</TABLE>");
	p("</DIV>");

	p("		</TD>");
	p("		<TD BGCOLOR=#" + LeftTop + " VALIGN=bottom ALIGN=center>");

	if(PageName !=  "")
	{
		p("<A HREF=http://www.WatiDesign.com/index.html><FONT COLOR=#" + PageNavBarColor + " FACE=arial SIZE=-1>Other<BR>Seasons</FONT></A><BR>&nbsp;");
	}

	p("		</TD>");
	p("	</TR>");
	p("	<TR HEIGHT=5>");
	p("		<TD COLSPAN=3 BGCOLOR=#" + TopStrip + "></TD>");
	p("	</TR>");
	p("	<TR HEIGHT=400>");
	p("		<TD BGCOLOR=#" + LeftMid + "></TD>");
	p("		<TD BGCOLOR=#" + CtrCtr + ">");
}

function LayoutBot()
{
	p("	</TD>");
	p("		<TD BGCOLOR=#" + LeftMid + "></TD>");
	p("	</TR>");
	p("	<TR HEIGHT=5>");
	p("		<TD COLSPAN=3 BGCOLOR=#" + BotStrip + "></TD>");
	p("	</TR>");
	p("	<TR HEIGHT=30>");
	p("		<TD BGCOLOR=#" + LeftBot  + "></TD>");
	p("		<TD BGCOLOR=#" + CtrBot + ">");

	p("<DIV ALIGN=CENTER>");
	p("<FONT COLOR=white FACE=Arial SIZE=-2>&copy; Wati Grossman, 2005-2007</FONT>");
	p("</DIV>");

	p("		</TD>");
	p("		<TD BGCOLOR=#" + LeftBot + "></TD>");
	p("	</TR>");
	p("</TABLE>");
	p("</DIV>");
}

function LayoutMid(cols, rows, imgArray, popupWidth, popupHeight, direction)
{
	if(cols < 1) cols = 1;
	if(rows < 1) rows = 1;

	var colWidth = Math.round(620/cols) - 8;
	var rowHeight = Math.round(440/rows) - 8;
	var imgCount = imgArray.length;

	if(direction == null) { iImgStart = 0; iImgIncr = 1; }
	else { iImgStart = imgCount - 1; iImgIncr = -1; }

	var iCol;
	var iRow;
	var iImg = iImgStart;

	p("<DIV ALIGN=center VALIGN=bottom>");
	p("<TABLE COLS=" + cols + " ROWS=" + rows + " CELLSPACING=2 CELLPADDING=2>");
	for(iRow = 0; iRow < rows; iRow++)
	{
		p("<TR height=" + rowHeight + ">");
		for(iCol = 0; iCol < cols; iCol++)
		{
			p("<TD ALIGN=center VALIGN=middle width=" + colWidth + ">");
			if(iImg < imgCount && iImg >= 0)
			{
				var src = imgArray[iImg][0];
				var imgWidth = imgArray[iImg][1];
				var imgHeight = imgArray[iImg][2];
				var imgPopup = imgArray[iImg][3];

				iImg = iImg + iImgIncr;	// Image names are Image1, Image2, ...

				var shrink = 1.0;
				var shrinkWidth = colWidth/imgWidth;
				var shrinkHeight = rowHeight/imgHeight;
				if (shrinkWidth < shrink) shrink = shrinkWidth;
				if (shrinkHeight < shrink) shrink = shrinkHeight;

				imgWidth = Math.round(imgWidth * shrink);
				imgHeight = Math.round(imgHeight * shrink);

				var winName = "\'TempWin\'";
				if(imgPopup.indexOf("html") > 0) winName = "\'TempWinX\'";

				var Msg = "<IMG NAME=ImageName"+iImg+" SRC="+src+" WIDTH="+imgWidth+" HEIGHT="+imgHeight+">";
				var Header = "<A HREF="+imgPopup+" onClick=\"return popup(this,"+winName+","+popupWidth+","+popupHeight+")\">";
				var Trailer = "</A>";
				if(imgPopup) Msg = Header + Msg + Trailer;
				p(Msg);
			}
			p("</TD>");
		}
		p("</TR>");
	}
	p("</TABLE>");
	p("</DIV>");
}

function popup(mylink, windowname, popupWidth, popupHeight)
{
	if (! window.focus) return true;

	var href;
	if (typeof(mylink) == 'string') { href=mylink; } else { href=mylink.href; }

	if(href.indexOf("Dummy") > 0)	// Scrolling images have href= Dummy1 or Dummy2
	{
		href = href.replace("Dummy1",Dummy1);
		href = href.replace("Dummy2",Dummy2);
	}

	if(href.indexOf("\.jpg") > 0)	// .jpg as opposed to html
	{
		newWindow = window.open(href, windowname,
			"width="+popupWidth+",height="+popupHeight+",scrollbars=no,resizable=no,toolbar=no,directories=no,status=no,menubar=no");
	}

	else					// .html as opposed to jpg
	{
		newWindow = window.open(href, windowname,
			"width="+popupWidth+",height="+popupHeight+",scrollbars=yes,resizable=yes,toolbar=no,directories=no,status=no,menubar=no");
	}

	newWindow.focus();
	return false;
}