templating.js

Handles creating new nodes based on DOM templates. Does some substitution based on specific class names.

• ¶

  /* This Source Code Form is subject to the terms of the Mozilla Public
   * License, v. 2.0. If a copy of the MPL was not distributed with this file,
   * You can obtain one at http://mozilla.org/MPL/2.0/. */
  define(["jquery", "util", "peers", "windowing", "session"], function ($, util, peers, windowing, session) {
    var assert = util.assert;
    var templating = util.Module("templating");
  
    templating.clone = function (templateId) {
      templateId = "#togetherjs-template-" + templateId;
      var template = $(templateId);
      assert(template.length, "No template found with id:", templateId);
      template = template.clone();
      template.attr("id", null);

• ¶

  FIXME: if called directly, doesn't emit new-element event:

      return template;
    };
  
    templating.sub = function (templateId, variables) {
      var template = templating.clone(templateId);
      variables = variables || {};
      util.forEachAttr(variables, function (value, attr) {

• ¶

  FIXME: do the substitution... somehow?

        var subs = template.find(".togetherjs-sub-" + attr).removeClass("togetherjs-sub-" + attr);
        if (subs.length) {
          if (typeof value == "string") {
            subs.text(value);
          } else if (value instanceof $) {
            subs.append(value);
          } else {
            assert(false, "Unknown variable value type:", attr, "=", value);
          }
        }
        var ifs = template.find(".togetherjs-if-" + attr).removeClass("togetherjs-sub-" + attr);
        if (! value) {
          ifs.hide();
        }
        ifs = template.find(".togetherjs-ifnot-" + attr).removeClass("togetherjs-ifnot-" + attr);
        if (value) {
          ifs.hide();
        }
        var attrName = "data-togetherjs-subattr-" + attr;
        var attrs = template.find("[" + attrName + "]");
        attrs.each(function (index, element) {
          assert(typeof value == "string");
          element = $(element);
          var subAttribute = element.attr(attrName);
          element.attr(attrName, null);
          element.attr(subAttribute, value);
        });
      });
      if (variables.peer) {
        variables.peer.view.setElement(template);
      }
      if (variables.date) {
        var date = variables.date;
        if (typeof date == "number") {
          date = new Date(date);
        }
        var ampm = "AM";
        var hour = date.getHours();
        if (hour > 12) {
          hour -= 12;
          ampm = "PM";
        }
        var minute = date.getMinutes();
        var t = hour + ":";
        if (minute < 10) {
          t += "0";
        }
        t += minute;
        template.find(".togetherjs-time").text(t);
        template.find(".togetherjs-ampm").text(ampm);
      }

• ¶

  FIXME: silly this is on session:

      session.emit("new-element", template);
      return template;
    };
  
    return templating;
  });