function g(a) {return document.getElementById(a);}

function saveStates() {
  try {
    widget.setPreferenceForKey(g('fontName').value,'CHM_fontName');
    widget.setPreferenceForKey(g('charsToCopy').value,'CHM_chars');
    widget.setPreferenceForKey(g('charSelect').selectedIndex,'CHM_select');
  }
  catch (e) {
  }
}

function loadStates() {
  try {
    g('fontName').value=widget.preferenceForKey('CHM_fontName')||'sans-serif';
    g('charsToCopy').value=widget.preferenceForKey('CHM_chars')||'';
    g('charSelect').selectedIndex=parseInt(widget.preferenceForKey('CHM_select'))||'';
    charMap(g('charSelect').value);
    changeFont();
  }
  catch (e) {
    g('mainBody').style.marginTop="3em";
    document.getElementsByTagName('html')[0].style.backgroundImage="url('tan3.png')";
  }
}

function charMap(a) {
  var range=a.split("-"); // Dash delimits digits.
  
  // No character range selected.
  if (range.length<2) {
    g('specialCharTest').innerHTML="<strong>Preview Area</strong>";
    return;
  }
  
  var c1=parseInt(range[0]);
  var c2=parseInt(range[1]);
  var temp="<table id='charTable' style='font-family:"+g('fontName').value+";'><tr>";
  var row=-1;
  for (i=c1; i<=c2; i++) {
    row++;
    if (row>4) {
      temp+="</tr><tr>";
      row=0;
    }
    temp+="<td onclick='g(\"charsToCopy\").value+=this.innerHTML;saveStates();'>&#"+i+";</td>";
  }
  temp+="</tr></table>";
  g('specialCharTest').innerHTML=temp;
  saveStates();
}

function changeFont() {
  g('charsToCopy').style.fontFamily=g('fontName').value||'sans-serif';
  if (g('charTable')) {
    g('charTable').style.fontFamily=g('fontName').value||'sans-serif';
  }
  saveStates();
}