<!--//accessibility style switcher SUBTLE
//hidden from view until shift+tab selected.
//adapted from http://www.alistapart.com/articles/n4switch


/***
*  What we need is a plan.

first declare showtabs false.

detect cookie

if no, set default style (ie. ignore) and set tabs to false

read cookie.
index of style (default for now)
substring

indexof('showtab')
 get substring. True or false---could be literally T or F
 ---or maybe -1 and 1 



match each to list.
docwrite <links accordingly>


write cookie


onload function to reset checkboxes and selected option
*
*

**/











var tabs=false;
var vis=false;
var newStyle;
var access = false ; //toggles the option panel
var openHeight ="11em"; //  11em"; 
var closeHeight ="1px";
var openWidth ="11.5em"; //"11.5em";
var closeWidth ="1px";

var bgOn = "white";       // #cac
var colorOn = "black";
var bgOff ; // declared - not defined until loadDisplayOptions ruuns
var colorOff;
var selectColor = "#eeddff"; //current choice in displayoptions

//problem, it always starts with cutout background and link color
// on reclosing, it changes to current bg, but keeps the cutout link color
// hard to see.   where is the initial coded?  same as ac jump links. hmm








//if true then true, if false or NO COOKIE then false
//tabs = (document.cookie.indexOf('showTab=true') != -1) ? true  : false ;
tabs = false;
//vis = (document.cookie.indexOf('highVis=true') != -1) ? true  : false ;

//read cookie style
var i = document.cookie.indexOf("style");
var namestart = (i+6) ;                  //(document.cookie.indexOf("=", i) + 1);
var nameend = document.cookie.indexOf(";", i);
if (nameend == -1) {nameend = document.cookie.length;} //but it's not.
newStyle = document.cookie.substring(namestart, nameend);



//checks if style is set, and loads exclusive sets-

if (newStyle=="lil") //or don't define, to make it the default
{
 document.write('<link rel="StyleSheet" href="css/lilac.css" type="text/css" title="HM - Lilac JS" />\n');
 document.write('<!--[if IE]><link rel="StyleSheet" href="css/lilacie.css" type="text/css" /><![endif]-->\n');
 document.write('<!--[if lte IE 6]><link rel="StyleSheet" href="css/lilacie6.css" type="text/css" /><![endif]-->\n');
}

else if (newStyle=="cop") 
{
document.write('<link rel="StyleSheet" href="css/purplecutout.css" type="text/css" title="Cut-Out" />\n');
document.write('<!--[if IE]><link rel="StyleSheet" href="css/purplecutoutie.css" type="text/css" /><![endif]-->\n');
document.write('<!--[if lte IE 6]><link rel="StyleSheet" href="css/purplecutoutie6.css" type="text/css" /><![endif]-->\n');
}

else if (newStyle=="dkp") //dark purple silk
{
document.write('<link rel="StyleSheet" href="css/centerlayout.css" type="text/css"  />\n');
document.write('<!--[if IE]><link rel="StyleSheet" href="css/centerlayoutie.css" type="text/css" /><![endif]-->\n'); 
/** combine IE v IE7 css use codes for 6 vs the other.**/
//darkpurple
document.write('<link rel="StyleSheet" href="css/darkpurple.css" type="text/css" title="Dark Purple Silk" />\n');
document.write('<!--[if IE]><link rel="StyleSheet" href="css/darkpurpleie.css" type="text/css"  /><![endif]-->\n');
}

else if (newStyle=="spr") //springtime
{
document.write('<link rel="StyleSheet" href="css/centerlayout.css" type="text/css"  />\n');
document.write('<!--[if IE]><link rel="StyleSheet" href="css/centerlayoutie.css" type="text/css" /><![endif]-->\n'); 
/** combine IE v IE7 css use codes for 6 vs the other.**/

document.write('<link rel="StyleSheet" href="css/spring.css" type="text/css" title="Spring Time" />\n');
document.write('<!--[if IE]><link rel="StyleSheet" href="css/springie.css" type="text/css"  title="Spring Time" /><![endif]-->\n');
}
else if (newStyle=="hiv")  //High Visibility contrast
{
document.write('<link rel="StyleSheet" href="css/highviscutout.css" type="text/css" title="high contrast" />\n');
}

else if (newStyle=="nun")
{
/** No Styling CSS -  still have inline style tags**/
//need to turn off notabs 
tabs = true;
}

/*Default. should be the same as the noscript option*/
else 
{
 document.write('<link rel="StyleSheet" href="css/lilac.css" type="text/css" title="HM - Lilac JS" />\n');
 document.write('<!--[if IE]><link rel="StyleSheet" href="css/lilacie.css" type="text/css" /><![endif]-->\n');
 document.write('<!--[if lte IE 6]><link rel="StyleSheet" href="css/lilacie6.css" type="text/css" /><![endif]-->\n');
}




//individual tack-ons

if (!tabs) {
	document.write('<link rel="stylesheet" type="text/css" href="css/notab.css" />\n');
	} //default is on
	


//why am i duplicating a close form on the relod command?
function closeIt() {
	document.getElementById('access').style.background = bgOff;
	document.displayOptions.style.color = colorOff;
	document.getElementById('access').style.height = closeHeight;
	document.getElementById('access').style.width = closeWidth;	
	document.getElementById('access').style.border = 0;	
	document.getElementById('access').style.borderPadding = 0;	
	document.displayOptions.style.overflow = "hidden";	
	document.displayOptions.style.display = "none";
}

//resets forms to the cookie settings, - onLoad.
//for SUBTLE hides the window.  

function realignForms() {
 closeIt();
 }




/* called when changes made to display options.*/
function chooseStyle() {

//  figure out how to find selected.
	var selectedIndex = document.displayOptions.styleSelect.selectedIndex;
	newStyle = document.displayOptions.styleSelect.options[selectedIndex].value ;

//	tabs = document.displayOptions.showTab.checked ;
//	vis = document.displayOptions.highVis.checked;

	var expdate = new Date();
	expdate.setTime(expdate.getTime() + (1000*3600*24*365)); //millisec * mi*hrs*days=1year
  
	document.cookie = 'style=' + newStyle + '; path=/'; 
	document.cookie = 'showTab=' + tabs + '; path=/';
	document.cookie = 'highVis=' + vis + ';  expires=' + expdate.toGMTString() + '; path=/'; 

//refreshes to affect changes - still jumps to hashes though. clear them out, but you need the search string too
//so, pathname + searchsting, will skip hash? hashes are the anchor tabs, yes

var nohash = window.location.protocol + "//" +
	window.location.hostname + 
	window.location.pathname + 
	window.location.search;
window.location.replace(nohash);


//window.location.reload();
  
}







//generate options access(!) panel
function loadDisplayOptions(){
	document.write('<div id="access"><a href="#" onClick="showDisplayOptions(this);return false;" ');
	document.write('onMouseOver="window.status = \'Display Options\'; return true;" '); 
    document.write('onFocus    ="window.status = \'Display Options\'; return true;" '); 
    document.write('onMouseOut ="window.status = \'\'; return true;" ');
    document.write('onBlur     ="window.status = \'\'; return true;" ');
	document.write('>Display&nbsp;Options</a> &nbsp;\n');
//that's one big link. . . n/a in FF
	
	document.write('<form name="displayOptions" style="display:none" action="">\n');
	document.write('<select name="styleSelect" >\n');
/*	document.write('<option value="def">Default </option>\n'); */
	document.write('<option value="lil">Lilac</option>\n');
	document.write('<option value="cop">Cutout</option>\n');
	document.write('<option value="dkp">Purple Silk</option>\n');
	document.write('<option value="hiv">High Contrast</option>\n');
	document.write('<option value="nun">No Styling</option>\n');
	document.write('</select><br />\n');

	//document.write('<input type="checkbox" name="showTab" />Skip-to Tabs<br />\n');
	document.write('<input type="button" name="changes" value="Change Display" onclick="chooseStyle()" />\n');
	document.write('Requires cookies <br /></form></div>');

// set current style defaults
   bgOff = document.getElementById('access').style.backgroundColor;
   colorOff = document.getElementById('access').style.color;

//compare newStyle to option value. if match, then background grey.
//loop through all the select options

//document.displayOptions.styleSelect.selectedIndex;
 for(var i=0 ; i<document.displayOptions.styleSelect.length ; i++)
 {  
  if (newStyle == document.displayOptions.styleSelect.options[i].value) {
  document.displayOptions.styleSelect.options[i].selected = "selected";
  document.displayOptions.styleSelect.options[i].style.backgroundColor = selectColor;
  }
 }  //end for

}  //END loaddisplayoptions






//called by access panel

function showDisplayOptions(whereamI){
	
if (!access) { //if closed, open.
	document.getElementById('access').style.backgroundColor = bgOn;
	document.getElementById('access').style.color = colorOn;	
	document.getElementById('access').style.height = openHeight;	
	document.getElementById('access').style.width = openWidth;	
	document.getElementById('access').style.color = colorOn;	
	document.displayOptions.style.display = "block";


	}
else { //close it
	closeIt();

	}

access = (access) ? false : true ; //switch it.


} //end function showDisplayOptions

//-->