// display.js | ver 1.1
// JavaScript Font Format Setter
//
// Originally inspired by the persistant font settings in sites such as
// FanFiction.net and FanficAuthors.net.
//
// Programming resources:
// The free tutorials available at W3Schools.
// http://www.w3schools.com/
// The how-to at Alternative Style: Working With Alternate Style Sheets by Paul Sowden.
// http://www.alistapart.com/stories/alternate/
// Browser compatablility issues from QuirksMode by Peter-Paul Koch.
// http://www.quirksmode.org/
// The getElementById workaround from:
// The JavaScript Source!! http://javascript.internet.com
// Created by: Ultimater :: http://ultimiacian.tripod.com/
// And many, many thanks go to Google for performing so many, many searches!
// http://www.google.com/


// This first part isn't a function; it runs as soon as this file loads.
// Downside: page display is held up until this javascript module loads.


// This 'if' statement is supposed to allow older browsers to still use this javascript.

if(!document.getElementById){
  if(document.all)
  document.getElementById=function(){
    if(typeof document.all[arguments[0]]!="undefined")
    return document.all[arguments[0]]
    else
    return null
  }
  else if(document.layers)
  document.getElementById=function(){
    if(typeof document[arguments[0]]!="undefined")
    return document[arguments[0]]
    else
    return null
  }
};

  var today=new Date();
  var EndDate=new Date(today.getTime()+730*24*60*60*1000); // plus two years
  var FontCode=6;                        // Default font-face code for new visitors
  var FontSize=12;                       // Default font-size for new visitors
  var TxtWidth=60;                       // Default width for new visitors
  var LineHite='normal';                 // Default line height for new visitors
  var PageStyle='Amber';                 // Default style for new visitors
  var BackColor='#000000';
  var ForeColor='#DDDDBB';
  var DefaultBackColor='#000000';
  var DefaultForeColor='#DDDDBB';
  var PageJust='justify';                // Default text justification for new visitors
  var FontName=new Array(8);             // Array that will hold available font names

  var mt='mailto:';
  var yahoo='@yahoo.com';
  var HR='howardrussell2000';
  var EmailWebMaster=mt+HR+yahoo;

// the next three lines check to see if the variables are already stored in local cookies
// if they are, then those values are used instead

  if(parseInt(GetCookie('HowardFontSize'))>0){FontSize=GetCookie('HowardFontSize');};
  if(parseInt(GetCookie('HowardFontCode'))>0){FontCode=GetCookie('HowardFontCode');};
  if(parseInt(GetCookie('HowardTxtWidth'))>0){TxtWidth=GetCookie('HowardTxtWidth');};
  if(GetCookie('HowardLineHite').length>0){LineHite=GetCookie('HowardLineHite');};
  if(GetCookie('HowardPageStyle').length>0){PageStyle=GetCookie('HowardPageStyle');};
  if(GetCookie('HowardBackColor').length>0){BackColor=GetCookie('HowardBackColor');};
  if(GetCookie('HowardForeColor').length>0){ForeColor=GetCookie('HowardForeColor');};
  if(GetCookie('HowardDefaultBackColor').length>0){DefaultBackColor=GetCookie('HowardDefaultBackColor');};
  if(GetCookie('HowardDefaultForeColor').length>0){DefaultForeColor=GetCookie('HowardDefaultForeColor');};
  if(GetCookie('HowardJustify').length>0){PageJust=GetCookie('HowardJustify');};

  setCurrentStyle(PageStyle);

// The selects are written in JavaScript because they require JavaScript to work.
// If the browser can't use JavaScript, no useless controls are displayed.
// They won't even see a blank space showing that controls are missing.

  document.write("<form id=\"format\">");
  document.write("<div class=\"fsel\">");
  WriteFontChanger();
  WriteJustifySelector();
  WriteHeightSelector();
  document.write("<br>");
//  WriteStyleSelector();
  document.write("<select id=\"backchanger\" onChange=setCurrentBackColor(value)>");
  ColorSelector(BackColor,DefaultBackColor,'Back');
  document.write("</select>");
  document.write("<select id=\"forechanger\" onChange=setCurrentForeColor(value)>");
  ColorSelector(ForeColor,DefaultForeColor,'Text');
  document.write("</select>");
  WriteWidthSelector();
  document.write("</div>");
  document.write("<div class=\"ftxt\">Display and Print Settings<br>Use Print Preview to check before printing</div>");
  document.write("</form>");


// end of the execute-on-load segment
// below are functions


function WriteStyleSelector() // the style options are written to the HTML
{ var sel;
document.write("<select id=\"stylechanger\" onChange=ChangeByStyle(value)>");
sel='';
if(PageStyle=='Amber'){sel=' selected="selected"'};
document.write("<option value='Amber'"+sel+">Amber Theme ");
sel='';
if(PageStyle=='Grey'){sel=' selected="selected"'};
document.write("<option value='Grey'"+sel+">Grey Theme ");
document.write("</select>");
};

function WriteWidthSelector() // the width options only are written to the HTML
{ var i,sel;
document.write("<select id=\"widthchanger\" onChange=setCurrentWidth(value)>");
  for(i=50;i<=95;i=i+5)
   {sel='';
    if(TxtWidth==i){sel=' selected="selected"'};
    document.write("<option value='"+i+"'"+sel+">Width "+i+"% ");
  };
document.write("</select>");
};

function WriteFontChanger()   // this writes the font-size buttons and font-face selector
{ var i,sel;
document.write("<select id=\"sizechanger\" onChange=setCurrentSize(value)>");
  for(i=6;i<=30;i++)
   {
    sel='';
    if(FontSize==i){sel=' selected="selected"'};
    document.write("<option value='"+i+"'"+sel+">"+i+"px Font ");
   };
document.write("</select>");

document.write("<select id=\"fontchanger\" onChange=setCurrentFontCode(value)>");

FontName[2]='\'Comic Sans MS\',cursive';sel='';
if(FontCode==2){sel=' selected="selected"'};
document.write("<option value='2'"+sel+">Comic Sans ");

FontName[3]='\'Courier New\',courier,monospace';sel='';
if(FontCode==3){sel=' selected="selected"'};
document.write("<option value='3'"+sel+">Fixed Width ");

FontName[1]='Arial,Helvetica,sans-serif';sel='';
if(FontCode==1){sel=' selected="selected"'};
document.write("<option value='1'"+sel+">Sans-Serif ");

FontName[5]='\'Times New Roman\',times,serif';sel='';
if(FontCode==5){sel=' selected="selected"'};
document.write("<option value='5'"+sel+">Serif ");

FontName[6]='Verdana,sans-serif';sel='';
if(FontCode==6){sel=' selected="selected"'};
document.write("<option value='6'"+sel+">Verdana ");

document.write("</select>");
};

function WriteHeightSelector() // the line-height options only are written to the HTML
{ var i,sel;
document.write("<select id=\"heightchanger\" onChange=setCurrentHeight(value)>");
  sel='';
  if(LineHite=='normal'){sel=' selected="selected"'};
  document.write("<option value='normal'"+sel+">Single-Space ");
  sel='';
  if(LineHite=='1.5'){sel=' selected="selected"'};
  document.write("<option value='1.5'"+sel+">1.5 ");
  sel='';
  if(LineHite=='2'){sel=' selected="selected"'};
  document.write("<option value='2'"+sel+">Double-Space ");
  sel='';
  if(LineHite=='2.5'){sel=' selected="selected"'};
  document.write("<option value='2.5'"+sel+">2.5 ");
  sel='';
  if(LineHite=='3'){sel=' selected="selected"'};
  document.write("<option value='3'"+sel+">Triple-Space ");

document.write("</select>");
};


function WriteJustifySelector() // the justification options are written to the HTML
{ var sel;
document.write("<select id=\"justchanger\" onChange=setCurrentJustify(value)>");
sel='';
if(PageJust=='left'){sel=' selected="selected"'};
document.write("<option value='left'"+sel+">Left Justify ");
sel='';
if(PageJust=='justify'){sel=' selected="selected"'};
document.write("<option value='justify'"+sel+">Full Justify ");
sel='';
if(PageJust=='center'){sel=' selected="selected"'};
document.write("<option value='center'"+sel+">Centered ");

document.write("</select>");
};

function ColorSelector(value,defaultcolor,tag) // the style options are written to the HTML
{ var sel;
sel='';
if(value==defaultcolor){sel=' selected="selected"'};
document.write("<option value='default'"+sel+">Default "+tag+" ");
sel='';
if(value=='aqua'){sel=' selected="selected"'};
document.write("<option value='aqua'"+sel+">Aqua "+tag+" ");
sel='';
if(value=='black'){sel=' selected="selected"'};
document.write("<option value=black"+sel+">Black "+tag+" ");
sel='';
if(value=='blue'){sel=' selected="selected"'};
document.write("<option value='blue'"+sel+">Blue "+tag+" ");
sel='';
if(value=='fuchsia'){sel=' selected="selected"'};
document.write("<option value='fuchsia'"+sel+">Fuchsia "+tag+" ");
sel='';
if(value=='gray'){sel=' selected="selected"'};
document.write("<option value='gray'"+sel+">Grey "+tag+" ");
sel='';
if(value=='green'){sel=' selected="selected"'};
document.write("<option value='green'"+sel+">Green "+tag+" ");
sel='';
if(value=='lime'){sel=' selected="selected"'};
document.write("<option value='lime'"+sel+">Lime "+tag+" ");
sel='';
if(value=='maroon'){sel=' selected="selected"'};
document.write("<option value='maroon'"+sel+">Maroon "+tag+" ");
sel='';
if(value=='navy'){sel=' selected="selected"'};
document.write("<option value='navy'"+sel+">Navy "+tag+" ");
sel='';
if(value=='olive'){sel=' selected="selected"'};
document.write("<option value='olive'"+sel+">Olive "+tag+" ");
sel='';
if(value=='purple'){sel=' selected="selected"'};
document.write("<option value='purple'"+sel+">Purple "+tag+" ");
sel='';
if(value=='red'){sel=' selected="selected"'};
document.write("<option value='red'"+sel+">Red "+tag+" ");
sel='';
if(value=='silver'){sel=' selected="selected"'};
document.write("<option value='silver'"+sel+">Silver "+tag+" ");
sel='';
if(value=='teal'){sel=' selected="selected"'};
document.write("<option value='teal'"+sel+">Teal "+tag+" ");
sel='';
if(value=='white'){sel=' selected="selected"'};
document.write("<option value='white'"+sel+">White "+tag+" ");
sel='';
if(value=='yellow'){sel=' selected="selected"'};
document.write("<option value='yellow'"+sel+">Yellow "+tag+" ");
};

function GetCookieValue(offset)
{
  var endstr=document.cookie.indexOf(";",offset);
  if(endstr==-1){endstr=document.cookie.length;};
return unescape(document.cookie.substring(offset,endstr));
};

function GetCookie(name)
{
  var arg=name+"=";
  var alen=arg.length;
  var clen=document.cookie.length;
  var i=0;
  while(i<clen)
  {
    var j=i+alen;
    if(document.cookie.substring(i,j)==arg)
      {return GetCookieValue(j);};
    i=document.cookie.indexOf(" ",i)+1;
    if(i==0)
      {break;};
  };
  return-1;
};

function SetCookie(WhichCookie,CookieValue)
{
  document.cookie=WhichCookie+"="+escape(CookieValue)+";path=/;expires="+EndDate.toGMTString();
};

function setCurrentSize(value)
{
  SetCookie('HowardFontSize',value);
  document.getElementById('ChangeMe').style.fontSize=value+'px';
};

function setCurrentFontCode(value)
{
  SetCookie('HowardFontCode',value);
  document.getElementById('HeadFont').style.fontFamily=FontName[value];
  document.getElementById('ChangeMe').style.fontFamily=FontName[value];
};

function setCurrentWidth(value)
{
  SetCookie('HowardTxtWidth',value);
  document.getElementById('ChangeMe').style.width=value+'%';
};

function setCurrentHeight(value)
{
  SetCookie('HowardLineHite',value);
  document.getElementById('ChangeMe').style.lineHeight=value;
  setCurrentStyle(PageStyle);
};

function setCurrentJustify(value)
{
  SetCookie('HowardJustify',value);
  document.getElementById('ChangeMe').style.textclass=value;
};

function setCurrentBackColor(value)
{ var temp=value;
  if(value=='default'){temp=DefaultBackColor};
  SetCookie('HowardBackColor',temp);
  document.bgColor=temp;
};

function setCurrentForeColor(value)
{ var temp=value;
  if(value=='default'){temp=DefaultForeColor};
  SetCookie('HowardForeColor',temp);
  document.fgColor=temp;
};

function setCurrentStyle(value)
{
  var i,a;
  PageStyle=value;
  SetCookie('HowardPageStyle',value);
  for(i=0;(a=document.getElementsByTagName("link")[i]);i++)
    {
    if(a.getAttribute("rel").indexOf("style")!=-1 && a.getAttribute("title"))
      {
        a.disabled=true;
        if(a.getAttribute("title")==value){a.disabled=false;};
      }; // end if
    }; // end for
  setCurrentBackColor(BackColor);
  setCurrentForeColor(ForeColor);
};

function ChangeByStyle(value)
{
  switch (value)
  {
  case 'Amber':
    DefaultBackColor='#000000';
    DefaultForeColor='#EEDDBB';
    break
  case 'Grey':
    DefaultBackColor='#CCCCCC';
    DefaultForeColor='#000000';
    break
  };
  SetCookie('HowardDefaultBackColor',DefaultBackColor);
  SetCookie('HowardDefaultForeColor',DefaultForeColor);
  BackColor=DefaultBackColor;
  ForeColor=DefaultForeColor;
  setCurrentStyle(value);
  document.getElementById('backchanger').selectedIndex=0;
  document.getElementById('forechanger').selectedIndex=0;
};