"use strict";

var iosocket = io.connect();

var tbdLabel = "To be determined",
  noTeam = "Kein Team";

// setup all my handlers
iosocket.on("clientrefresh", function() {
  location.reload();
});

iosocket.on("stateChange", function(state) {
  console.log(state);
  // basically the server tracks the state since it is the same for al clients
  // So we know that we HAVE to update at this point
  $("#team-container").bracket({
    init: state,
    decorator: {
      edit: function() {},
      render: render_fn
    },
    teamWidth: 130,
    scoreWidth: 20,
    matchMargin: 35,
    roundMargin: 40
  });
});

function render_fn(container, data, score, state) {
  switch (state) {
    case "empty-bye":
      container.append(noTeam);
      return;
    case "empty-tbd":
      container.append(tbdLabel);
      return;
    case "entry-no-score":
      console.log("no score"); // no return
    case "entry-default-win":
      console.log("default win"); // no return
    case "entry-complete":
      container.append(data);
      return;
  }
}

$(document).ready(function() {
  tbdLabel = $("#TBD").val();
  noTeam = $("#NoT").val();
  // get my state
  var context = "main";
  iosocket.emit("loadState", context);
});