var OWC = {
  _makeHintButton: function makeHintButton(hints) {
    var hintButton = $('<div class="hint-button"></div>');
    hintButton.text($('#msg-show-first-hint').text());
    hintButton.click(
      function() {
        hints.find("p:hidden:first").fadeIn();
        if (hints.find("p:hidden").length)
          $(this).text($('#msg-show-another-hint').text());
        else
          $(this).fadeOut();
      });
    return hintButton;
  },

  load: function load(id) {
    var challenge = $("#challenge-" + id);
    var content = challenge.find(".content").clone();
    var current = $("#current-challenge");
    current.empty();
    current.append(content);

    var hints = $('<div class="hints"></div>');
    hints.append(challenge.find(".hints").clone());
    hints.find("p").hide();
    current.append(this._makeHintButton(hints));
    current.append(hints);

    var validatorCode = challenge.find(".validator").text();

    var validate = eval("(" + validatorCode + ")");

    function maybeDisplaySuccess() {
      if (validate(current)) {
        var success= $('<div class="success"></div>');
        success.text($('#msg-success').text());
        success.hide();
        current.append(success);
        success.slideDown("slow");
        window.clearInterval(intervalId);
      }
    }
    var intervalId = window.setInterval(maybeDisplaySuccess, 100);

    current.fadeIn();
  }
};

$(window).ready(
  function() {
    OWC.load(1);
  });