const EVENT_TEMPLATES_LOADED = "templates:loaded";

const templateNames = [
  "class",
  "home",
  "species"
];

const partialNames = [
  "nav"
];

var templates = {};
var $content = null;

function checkLoad($target) {
  if (Object.keys(templates).length === templateNames.length + partialNames.length) {
    $target.trigger(EVENT_TEMPLATES_LOADED);
  }
}

$(document).ready(function () {
  $content = $("#content");

  templateNames.forEach(function (name) {
    const path = "templates/" + name + ".hbs";

    $.get(path, function (data) {
      templates[name] = Handlebars.compile(data);
      checkLoad($content);
    }, "html");
  });

  partialNames.forEach(function (name) {
    const path = "templates/" + name + ".hbs";
    $.get(path, function (data) {
      templates[name] = Handlebars.compile(data);
      Handlebars.registerPartial(name, templates[name]);
      checkLoad($content);
    }, "html");
  });

  $content.on(EVENT_TEMPLATES_LOADED, {}, function () {
    $(this).html(templates.home());
  });
});