var agt = navigator.userAgent.toLowerCase();

function setCookie(cookieName,cookieValue) {
	document.cookie = cookieName+"="+escape(cookieValue) + ";expires="
	}
	
function readCookie(cookieName) {
	var theCookie=""+document.cookie;
	var ind=theCookie.indexOf(cookieName);
	if (ind==-1 || cookieName=="") return ""; 
	var ind1=theCookie.indexOf(';',ind);
	if (ind1==-1) ind1=theCookie.length; 
	return unescape(theCookie.substring(ind+cookieName.length+1,ind1));
	}
	
if (document.layers) {
	rule='<style type="text\/css">body, div, p, blockquote, form {font-size: 14px;}<\/style>';
	document.write(rule)
	}


/********************************************************************
	What shall we call our cookies? Something friendly, so as not to scare the
	internet geeks.
*/
var fontSizeCookieName = 'fontSize3';

/********************************************************************
	An array of font-size keywords, which we'll use to change the page's font-size.
	More info on these keywords can be found at the following URLs:
		http://www.alistapart.com/stories/sizematters/
		http://www.w3.org/TR/REC-CSS1#font-size

*/
var sizeA = new Array('11px','12px','14px');

/********************************************************************
	if you don't like the insanely large keywords to be available, you can truncate the
	array like so:
*/
sizeA.length=3; // this makes only the first 3 keywords available

/********************************************************************
	currentSizeAIndex holds the default value for the pages font-size, which is set in
	your stylesheets with a rule for the body element
*/
var currentSizeAIndex = 1; // this corresponds to the rule "body { font: 11px; }"

/********************************************************************
	Let's see if there are cookies, and if there use the fontSize cookie value for
	currentSizeAIndex and add some rules to set the page's font-family and font-size
	to the correct keyword.
*/
if (readCookie(fontSizeCookieName)!='') {
	currentSizeAIndex = readCookie(fontSizeCookieName)
	rule='<style type="text\/css" media="screen, projection, handheld">body, th, td, p, li, blockquote, div, span, input, textarea, option, a {font-size: '+sizeA[currentSizeAIndex]+' !important;}';
	document.write(rule)
	
	if(currentSizeAIndex==0)
		{
		document.write("\ntable.topnav1 {width:173px !important}\n"+
		".menuarea a {width:178px !important; line-height:14px !important;}\n"+
		"#menu_1 {}\n"+
		"td.colLeftTD {}\n"+
		"img.leftSpacer {}"+
		"table.listingpage, #colLinksCommon {}\n");
		}
	else if(currentSizeAIndex==1) // || currentSizeAIndex==2
		{
		document.write("\ntable.topnav1 {width:193px !important}\n"+
		".menuarea a {width:198px !important; line-height:16px !important;}\n"+
		"#menu_1 {}"+
		"#path *, #menu_1 *, .menuarea *, #changeSize * {font-size:12px !important}\n"+
		"td.colLeftTD {}\n"+
		"img.leftSpacer {}"+
		"table.listingpage, #colLinksCommon {}\n");
		}
	else 
		{
		document.write("\ntable.topnav1 {width:203px !important}\n"+
		".menuarea a {width:208px !important; line-height:14px !important; }\n"+
		"#menu_1 {}"+
		"#path *, #changeSize * {font-size:12px !important}\n"+
		"#menu_1 *, .menuarea * {font-size:13px !important}\n"+
		"img.leftSpacer {}"+
		"table.listingpage, #colLinksCommon {}\n");
		}
	document.write('<\/style>');
	}
	
/********************************************************************
	changeFontSize() is the function that changes the font-size. It takes one
	parameter, an integer. Ideally that integer is 1 or -1, which either increases or
	decreases the font-size by one keyword.
*/
function changeFontSize(i) {
	var newSizeAIndex = currentSizeAIndex-(-i);
	if (newSizeAIndex<0 || newSizeAIndex==sizeA.length) return false;
	activateButton('sizeUp');
	activateButton('sizeDown');
	if (newSizeAIndex==0) fadeButton('sizeDown');
	if (newSizeAIndex==sizeA.length-1) fadeButton('sizeUp');
	
	document.body.style.fontSize=sizeA[newSizeAIndex];
	currentSizeAIndex = newSizeAIndex;
	// let's stuff it in a cookie so we can remember it
	setCookie(fontSizeCookieName,currentSizeAIndex);
	// NS6 won't properly apply the changes in abs positioned divs unless we do
	// this trickery:
	if (!document.all) { 
		e = document.getElementsByTagName('body')[0];
		e.parentNode.replaceChild(e,e);
		}
	//menu.moveEm()
	window.location.reload();
	}
	
	function changeFontSizeSmallest() {	
	newSizeAIndex=0;
	//document.body.style.fontSize=sizeA[newSizeAIndex];
	currentSizeAIndex = newSizeAIndex;
	// let's stuff it in a cookie so we can remember it
	setCookie(fontSizeCookieName,currentSizeAIndex);
	
	if (!document.all) { 
		e = document.getElementsByTagName('body')[0];
		e.parentNode.replaceChild(e,e);
		}
	window.location.reload();
	}
	
	function changeFontSizeMedium() {	
	newSizeAIndex=1;
	//document.body.style.fontSize=sizeA[newSizeAIndex];
	currentSizeAIndex = newSizeAIndex;
	
	setCookie(fontSizeCookieName,currentSizeAIndex);
	
	if (!document.all) { 
		e = document.getElementsByTagName('body')[0];
		e.parentNode.replaceChild(e,e);
		}
	window.location.reload();
	}
	
	function changeFontSizeLargest() {	
	newSizeAIndex=2;
	//document.body.style.fontSize=sizeA[newSizeAIndex];
	currentSizeAIndex = newSizeAIndex;
	
	setCookie(fontSizeCookieName,currentSizeAIndex);
	
	if (!document.all) { 
		e = document.getElementsByTagName('body')[0];
		e.parentNode.replaceChild(e,e);
		}
	window.location.reload();
	}
	

/********************************************************************
	writeControls() inserts the form in your document for browsers that these scripts
	work with, which right now are IE5+ Mac and PC, and Mozilla and Mozilla-based
	browsers (NS6).
	
	I would have liked to have done this without innerHTML, but trying it with pure
	W3C DOM methods like createElement and insertBefore created too many
	problems related to different browser implementations. It came down to the fact
	that when using abs positioned divs, NS6 did not apply changes made with the
	form controls until i added the following bit to changeFontSize and
	changeFontFamily:
			e = document.getElementsByTagName('body')[0];
			e.parentNode.replaceChild(e,e);
	
	Problem is, that this causes NS6 to hang when nodes have been inserted into
	the document via insertbefore() or appendChild(). So I'm sticking with innerHTML
	for now.
*/

function writeControls() {	
	if (document.getElementsByTagName) { // kosher
		var formDiv = document.getElementById('preferences');
		if (!formDiv) {
			alert('<div id="preferences"></div> must appear in your markup where you want the form to appear\n(and before <script type="text/javascript" id="controlsScript">writeControls()</script>)');
			return;
			}
		
		// Because NS6 will try to call writeControls() every time the
		// e.parentNode.replaceChild(e,e) trick is used when writeControls()
		// is called from within a script element in the body of the HTML doc:
		if (formDiv.innerHTML != '') return;
		/*
		var theForm='<form style="display:block !important" id="preferencesForm"><table cellpadding="0" cellspacing="0"><tr><td>';
		theForm+='<input type="button" id="sizeDown" class="preferencesEl" onclick="changeFontSize(-1)" value=" A - " \/></td><td>';
		theForm+='<input type="button" id="sizeUp" class="preferencesEl" onclick="changeFontSize(1)" value=" A+ " \/></td><tr></table>';
		theForm+='</form>';
		*/	
		
		var theForm='<table cellpadding="0" cellspacing="0"><tr>';
		theForm+='<td class="sizeCell"><a id="sizeSmallest" class="preferencesEl" onclick="changeFontSizeSmallest()"/><img src="http://www.artjarvi.fi/fileadmin/template/main/images/a1.gif" alt=""></a></td>';
		theForm+='<td class="sizeCell"><a id="sizeMedium" class="preferencesEl" onclick="changeFontSizeMedium()"/><img src="http://www.artjarvi.fi/fileadmin/template/main/images/a2.gif" alt=""></a></td>';
		theForm+='<td class="sizeCell"><a id="sizeLargest" class="preferencesEl" onclick="changeFontSizeLargest()"/><img src="http://www.artjarvi.fi/fileadmin/template/main/images/a3.gif" alt=""></a></td>';
		theForm+='<tr></table>';
		
		formDiv.innerHTML = theForm;
		
		// For IE5.0 Mac (it's fixed in later versions), which puts the contents of elements
		// outside of their containers, unless we do this:
		if (agt.indexOf('msie 5.0; mac') != -1) document.getElementById('fs').innerHTML=document.getElementById('fs').innerHTML;
		/*
		if (currentSizeAIndex==0) {
			fadeButton('sizeDown');
		} else if (currentSizeAIndex==sizeA.length-1) {
			fadeButton('sizeUp');
			}
		*/
		}
	}

/********************************************************************
	the following line calls writeControls() when the document has fully loaded. If
	you would rather have the function called a the page is being rendered, you can
	comment out the line below and insert the following line in your HTML markup
	immediately following the preferences div (<div id="preferences"></div>):
			
			<script type="text/javascript" id="controlsScript">writeControls()</script>
	
	Be warned, however, that script elements outside of the head element may not
	validate for some HTML document types.
*/

function fadeButton(bId) {
	var button = document.getElementById(bId);
	button.blur();
	button.disabled='disabled';
	button.style.borderColor='#999';
	button.style.color='#999';
	}
	
function activateButton(bId) {
	var button = document.getElementById(bId);
	button.disabled=null;
	button.style.borderColor='#000';
	button.style.color='#000';
	}