function taxstyle() {
  var text = "";
  text += "table.taxman { border-collapse:collapse; border: 1px solid black;}";
  text += "table.taxcap { border-collapse:collapse; border:none }";
  text += "td.taxman { height: 40px; width: 40px; border: 1px solid black;";
  text += "   text-align: center; vertical-align:middle;"
  text += "   font: 18px Arial bold; }";
  text += "td.taxcap { height: 40px;";
  text += "   text-align: center; vertical-align:middle;";
  text += "   font: 18px Arial bold; }";
  return text;
}

function boardtext(n) {
  var text = "<table class=taxman><tr>";
  for (var i = 1; i <= n; i++) {
    if (i > 1 && i % 10 == 1) text += "</tr><tr>";
    text += "<td class=taxman id=n" + i +
            " onmouseover=mousein(" + i + ")" +
            " onmouseout=mouseout(" + i + ")" +
            " onclick=mouseclick(" + i + ")" +
            ">" + i + "</td>";
  };
  if (n % 10 != 0) {
    text += "<td colspan=" + (n % 10) + ">&nbsp;</td>";
  }
  text += "</tr></table>";
  return text;
}

function board(n) {
  var text = "<table class=taxcap>";
  text += "<tr>"
  text += "<td class=taxcap>Score:</td><td style=width:64px class=taxcap>";
  text += "<span id=taxscore>0</span></td>"
  text += "<td class=taxcap>Taxman:</td><td style=width:64px class=taxcap>";
  text += "<span id=tax>0</span></td>";
  text += "<td class=taxcap><input type=button value=Done onclick=done()>";
  text += " &nbsp; ";
  text += "<form style='display:inline' onsubmit='restart(); return false;'>";
  text += "<input type=submit value=Restart>";
  text += "<input type=text title='Board Size' id=newsize size=2 maxlength=3 ";
  text += " style='width:26px; text-align:right' value=" + n + ">";
  text += "</form>";
  text += "</td></tr>";
  text += "</table>";
  text += "<div id=boardslot>";
  text += boardtext(n);
  text += "</div>";
  return text;
}

function cell(n) {
  return document.getElementById("n" + n);
}

function scorecell() {
  return document.getElementById("taxscore");
}

function taxcell() {
  return document.getElementById("tax");
}

function newsizecell() {
  return document.getElementById("newsize");
}

function repaint() {
  document.getElementById("boardslot").innerHTML = boardtext(game.size);
}

hover = null;
function recolor() {
  var taxed = {};
  var highlight = null;
  if (hover !== null && game.legal(hover)) {
    highlight = hover;
    taxed = intersection(factors(hover), game.available);
  }
  for (var i = 1; i <= game.size; i++) {
    color = "none";
    if (i in game.taken) color = "lightblue";
    else if (!(i in game.available)) color = "pink";
    else if (highlight == i) color = "blue";
    else if (i in taxed) color = "red";
    cell(i).style.background = color;
  }
  scorecell().innerHTML = game.score;
  taxcell().innerHTML = game.tax;
}

function mousein(n) {
  hover = n;
  recolor();
}

function mouseout(n) {
  hover = null;
  recolor();
}

function mouseclick(n) {
  if (game.legal(n)) {
    game.move(n);
  }
  recolor();
}

function done() {
  game.finish();
  recolor();
}

function restart() {
  var size = parseInt(newsizecell().value);
  if (size > 1000) {
    size = 1000;
  }
  if (isNaN(size) || size < 1) {
    size = 20;
    newsizecell().value = size;
  }
  game = newgame(size);
  repaint();
  recolor();
}