skits.js

(function() {
  var delgator, getQuestion, getScenario, loadMask;

  delgator = function(state) {
    return $.each(state.addedKeys, function(index, key) {
      console.log("Added keys", index, key);
      console.log("Executing " + key.key + "(" + key.value + ")");
      return eval("" + key.key + "(" + key.value + ")");
    });
  };

  getQuestion = function(scenario_id, text_language, answer_language) {
    return $.getJSON("/scenarios/" + scenario_id + "/questions/random", {
      text_language: text_language,
      answer_language: answer_language
    }, function(data) {
      return $("#message").html("<p>" + data["text"] + "</p>");
    });
  };

  getScenario = function(scenario_id) {
    $(".prop-container").html('');
    $("#scenario-tools").html('');
    $.getJSON("/scenarios/" + scenario_id + "/show_scene", {}, function(data) {
      $("#scene").hide("slide", {
        direction: "left"
      }, 1000);
      $("#scene").html("<img src=" + data["image"]["url"] + " id='scene-image' />");
      $("#scene-image").load(function() {
        return $("#scene").show("slide", {
          direction: "right"
        }, 1000, function() {
          $(".prop-container").html('');
          return $.getJSON("/scenarios/" + scenario_id + "/props/", {}, function(data) {
            return $.each(data, function(index, prop) {
              $(".prop-container").append("<img src='" + prop.image.url + "' id='" + prop.name + "' class='prop' style='top:" + prop.y + "px; left:" + prop.x + "px;'/>");
              $("#" + prop.name).show("bounce", {
                times: 0
              }, "fast");
              return $("#" + prop.name).draggable(true, {
                containment: "parent"
              });
            });
          });
        });
      });
      $("#scenario-tools").append("<li><a id='random-question' href='#load-question'>Random Question</a></li>");
      return $("#scenario-tools").append("<li class='divider-vertical'></li>");
    });
    $.getJSON("/scenarios/" + scenario_id + "/masks/", {}, function(data) {
      return $.each(data, function(index, mask) {
        return $("#scenario-tools").append("<li><a id='load-mask' href='#load-mask' data-id=" + mask["id"] + ">Load " + mask["name"] + "</a></li>");
      });
    });
    if ($(".inner-curtain").is(":visible")) {
      $(".left-curtain").hide("slide", {
        direction: "left"
      }, 2000);
      $(".right-curtain").hide("slide", {
        direction: "right"
      }, 2000);
    }
    return $(".infotainment .exclamation #text").html("<span>Loaded!</span>");
  };

  loadMask = function(scenario_id, mask_id) {
    console.log("loading mask");
    return $.getJSON("/scenarios/" + scenario_id + "/masks/" + mask_id, {}, function(data) {
      var image;
      console.log("data fetched", data);
      window.overlay = null;
      image = gapi.hangout.av.effects.createImageResource(data.image.url);
      console.log("Image resource", image);
      window.overlay = image.createFaceTrackingOverlay({
        'trackingFeature': data.track,
        'rotateWithFace': data.rotate_with_face,
        'scaleWithFace': data.scale_with_face,
        'scale': data.scale,
        'rotation': data.rotation,
        'offset': {
          'x': data.x_offset,
          'y': data.y_offset
        }
      });
      console.log("overlay", overlay);
      return window.overlay.setVisible(true);
    });
  };

  $(function() {
    gapi.hangout.onApiReady.add(function() {
      return gapi.hangout.data.onStateChanged.add(function(data) {
        window.state = data;
        console.log("change!", data);
        return delgator(data);
      });
    });
    $("#load-scenario").click(function() {
      var scenario_id;
      window.scenario_id = $(this).data("id");
      scenario_id = $(this).data("id");
      return gapi.hangout.data.setValue("getScenario", scenario_id.toString());
    });
    $(document).on("click", "#random-question", function() {
      return getQuestion(window.scenario_id, "English", "English");
    });
    return $(document).on("click", "#load-mask", function() {
      return loadMask(window.scenario_id, $(this).data("id"));
    });
  });

}).call(this);