buttons = new Array(
                    make_image("timg/eefire.big.gif", "Fire"),
                    make_image("timg/eenature.big.gif", "Nature"),
                    make_image("timg/eeearth.big.gif", "Earth"),
                    make_image("timg/eelight.big.gif", "Light"),
                    make_image("timg/eedarkness.big.gif", "Darkness"),
                    make_image("timg/eewater.big.gif", "Water"),
                    make_image("timg/pure.gif", "Pure")
                    );
eles = new Array("f", "n", "e", "l", "d", "w", "p", "$");
oldtext = ""

function make_image(url, alt) {
  var node = document.createElement("img");
  node.setAttribute("src", url);
  node.setAttribute("alt", alt);
  return node;
}

function addButtonEvent(button, i) {
  Events.addEvent(button, "click", function() { add(i); });
}

window.onload = function() {
  var text = document.createElement("p");
  text.appendChild(document.createTextNode("Click on an element to add it to " +
                                           "your build. If you click on an " +
                                           "element in your build it will be " +
                                           "removed."));
  $("buildform").parentNode.insertBefore(text, $("buildform"));
  
  var elements = document.createElement("p");
  for (var i = 0; i < buttons.length; i++) {
    elements.appendChild(buttons[i]);
    addButtonEvent(buttons[i], i); // because javascript closures suck...
  }
  $("buildform").parentNode.insertBefore(elements, $("buildform"));
  
  var line = document.createElement("p");
  line.appendChild(document.createTextNode("Your build: "));
  $("buildform").parentNode.insertBefore(line, $("buildform"));
  
  Events.addEvent($("btxt"), "change", sync);
  Events.addEvent($("btxt"), "keyup", sync);
  Events.addEvent($("btxt"), "mouseup", sync);
  sync();
  
  var headers = document.getElementsByTagName("h3");
  var levellist = document.createElement("p");
  if (headers.length > 0) {
    levellist.appendChild(document.createTextNode("At wave: "));
    headers[0].parentNode.parentNode.insertBefore(levellist,
                                                  headers[0].parentNode);
  }
  for (var i = 0; i < headers.length; i++) {
    var link = document.createElement("a");
    link.appendChild(document.createTextNode("[" + ((i + 1) * 5) + "] "));
    link.setAttribute("href", "javascript:show('" +
                      headers[i].parentNode.getAttribute("id") + "')");
    link.setAttribute("id",
                      "button_" + headers[i].parentNode.getAttribute("id"));
    
    levellist.appendChild(link);
    hide(headers[i].parentNode.getAttribute("id"));
  }
}

function show(id) {
  $(id).style.display = "block";
  
  var button = $("button_" + id);
  button.setAttribute("href", "javascript:hide('" + id + "')");
  button.style.fontWeight = "bold";
}

function hide(id) {
  $(id).style.display = "none";
  
  var button = $("button_" + id);
  button.setAttribute("href", "javascript:show('" + id + "')");
  button.style.fontWeight = "normal";
}

function add(i) {
  var txt = $("btxt");
  txt.value += eles[i];
  sync();
}

function del(id, pos) {
  var txt = $("btxt");
  var text = txt.value;
  var before = text.substr(0, pos);
  var after = text.substr(pos + 1);
  txt.value = before + after;
  
  sync();
}

function realAdd(i) {
  var line = $("buildform").previousSibling;
  var txt = $("btxt");
  var id = "id_" + new Date().getTime() + "_" + Math.floor(Math.random()*10001);
  
  var twin = make_image(buttons[i].getAttribute("src"),
                        buttons[i].getAttribute("alt"));
  twin.setAttribute("id", id);
  
  line.appendChild(twin);
  var pos = txt.value.length;
  txt.value += eles[i];
  Events.addEvent(twin, "click", function() { del(id, pos); });
}

function sync() {
  var txt = $("btxt");
  var text = txt.value.toLowerCase();
  var line = $("buildform").previousSibling;
  var counts = new Array(0, 0, 0, 0, 0, 0, 0, 0);
  var total = 0;
  
  if (oldtext != text) {
    // clear everything
    txt.value = "";
    while (line.lastChild != line.firstChild) {
      line.removeChild(line.lastChild);
    }
   
    // and fill again
    for (i = 0; i < text.length; i++) {
      var ch = text.charAt(i);
      for (j = 0; j < eles.length; j++) {
        if (ch == eles[j]) {
          counts[j]++;
          total++;
          if (((j < 6 && counts[j] <= 3) || ((j == 6 && counts[j] <= 2) || (j == 7 && counts[j] <=2 ))) && total <= 11 && (j != 6 || counts[0] >= 3 || counts[1] >= 3 || counts[2] >= 3 || counts[3] >= 3 || counts[4] >= 3 || counts[5] >= 3 || (counts[0] >= 1 && counts[1] >= 1 && counts[2] >= 1 && counts[3] >= 1 && counts[4] >= 1 && counts[5] >= 1))) {
          //if (counts[j] <= 3 && total <= 11) {
            realAdd(j);
          }
          break;
        }
      }
    }
    
    // save old text
    oldtext = txt.value
  }
}