Hogan.js nested template inheritance test.

hogan-3.0.0.min.js

/**
* @preserve Copyright 2012 Twitter, Inc.
* @license http://www.apache.org/licenses/LICENSE-2.0.txt
*/
var Hogan={};(function(e,t){function n(e,t,n){var r,i;return t&&typeof t=="object"&&(t[e]!=null?r=t[e]:n&&t.get&&typeof t.get=="function"&&(r=t.get(e))),r}function r(e,t,n,r,i,s){function o(){}function u(){}o.prototype=e,u.prototype=e.subs;var a,f=new o;f.subs=new u,f.subsText={},f.ib(),r=r||{},f.stackSubs=r;for(a in t)r[a]||(r[a]=t[a]),f.subsText[a]=s;for(a in r)f.subs[a]=r[a];i=i||{},f.stackPartials=i;for(a in n)i[a]||(i[a]=n[a]);for(a in i)f.partials[a]=i[a];return f}function l(e){return String(e===null||e===undefined?"":e)}function c(e){return e=l(e),f.test(e)?e.replace(i,"&amp;").replace(s,"&lt;").replace(o,"&gt;").replace(u,"&#39;").replace(a,"&quot;"):e}e.Template=function(e,t,n,r){e=e||{},this.r=e.code||this.r,this.c=n,this.options=r||{},this.text=t||"",this.partials=e.partials||{},this.subs=e.subs||{},this.ib()},e.Template.prototype={r:function(e,t,n){return""},v:c,t:l,render:function(t,n,r){return this.ri([t],n||{},r)},ri:function(e,t,n){return this.r(e,t,n)},ep:function(e,t){var n=this.partials[e],i=t[n.name];if(n.instance&&n.base==i)return n.instance;if(typeof i=="string"){if(!this.c)throw new Error("No compiler available.");i=this.c.compile(i,this.options)}return i?(this.partials[e].base=i,n.subs&&(this.activeSub===undefined&&(t.stackText=this.text),i=r(i,n.subs,n.partials,this.stackSubs,this.stackPartials,t.stackText||this.text)),this.partials[e].instance=i,i):null},rp:function(e,t,n,r){var i=this.ep(e,n);return i?i.ri(t,n,r):""},rs:function(e,t,n){var r=e[e.length-1];if(!h(r)){n(e,t,this);return}for(var i=0;i<r.length;i++)e.push(r[i]),n(e,t,this),e.pop()},s:function(e,t,n,r,i,s,o){var u;return h(e)&&e.length===0?!1:(typeof e=="function"&&(e=this.ms(e,t,n,r,i,s,o)),u=!!e,!r&&u&&t&&t.push(typeof e=="object"?e:t[t.length-1]),u)},d:function(e,t,r,i){var s,o=e.split("."),u=this.f(o[0],t,r,i),a=this.options.modelGet,f=null;if(e==="."&&h(t[t.length-2]))u=t[t.length-1];else for(var l=1;l<o.length;l++)s=n(o[l],u,a),s!=null?(f=u,u=s):u="";return i&&!u?!1:(!i&&typeof u=="function"&&(t.push(f),u=this.mv(u,t,r),t.pop()),u)},f:function(e,t,r,i){var s=!1,o=null,u=!1,a=this.options.modelGet;for(var f=t.length-1;f>=0;f--){o=t[f],s=n(e,o,a);if(s!=null){u=!0;break}}return u?(!i&&typeof s=="function"&&(s=this.mv(s,t,r)),s):i?!1:""},ls:function(e,t,n,r,i){var s=this.options.delimiters;return this.options.delimiters=i,this.b(this.ct(l(e.call(t,r)),t,n)),this.options.delimiters=s,!1},ct:function(e,t,n){if(this.options.disableLambda)throw new Error("Lambda features disabled.");return this.c.compile(e,this.options).render(t,n)},b:t?function(e){this.buf.push(e)}:function(e){this.buf+=e},fl:t?function(){var e=this.buf.join("");return this.buf=[],e}:function(){var e=this.buf;return this.buf="",e},ib:function(){this.buf=t?[]:""},ms:function(e,t,n,r,i,s,o){var u,a=t[t.length-1],f=e.call(a);return typeof f=="function"?r?!0:(u=this.activeSub&&this.subsText[this.activeSub]?this.subsText[this.activeSub]:this.text,this.ls(f,a,n,u.substring(i,s),o)):f},mv:function(e,t,n){var r=t[t.length-1],i=e.call(r);return typeof i=="function"?this.ct(l(i.call(r)),r,n):i},sub:function(e,t,n,r){var i=this.subs[e];i&&(this.activeSub=e,i(t,n,this,r),this.activeSub=!1)}};var i=/&/g,s=/</g,o=/>/g,u=/\'/g,a=/\"/g,f=/[&<>\"\']/,h=Array.isArray||function(e){return Object.prototype.toString.call(e)==="[object Array]"}})(typeof exports!="undefined"?exports:Hogan),function(e){function o(e){e.n.substr(e.n.length-1)==="}"&&(e.n=e.n.substring(0,e.n.length-1))}function u(e){return e.trim?e.trim():e.replace(/^\s*|\s*$/g,"")}function a(e,t,n){if(t.charAt(n)!=e.charAt(0))return!1;for(var r=1,i=e.length;r<i;r++)if(t.charAt(n+r)!=e.charAt(r))return!1;return!0}function l(t,n,r,i){var s=[],o=null,u=null,a=null;u=r[r.length-1];while(t.length>0){a=t.shift();if(!(!u||u.tag!="<"||a.tag in f))throw new Error("Illegal content in < super tag.");if(e.tags[a.tag]<=e.tags.$||c(a,i))r.push(a),a.nodes=l(t,a.tag,r,i);else{if(a.tag=="/"){if(r.length===0)throw new Error("Closing tag without opener: /"+a.n);o=r.pop();if(a.n!=o.n&&!h(a.n,o.n,i))throw new Error("Nesting error: "+o.n+" vs. "+a.n);return o.end=a.i,s}a.tag=="\n"&&(a.last=t.length==0||t[0].tag=="\n")}s.push(a)}if(r.length>0)throw new Error("missing closing tag: "+r.pop().n);return s}function c(e,t){for(var n=0,r=t.length;n<r;n++)if(t[n].o==e.n)return e.tag="#",!0}function h(e,t,n){for(var r=0,i=n.length;r<i;r++)if(n[r].c==e&&n[r].o==t)return!0}function p(e){var t=[];for(var n in e)t.push('"'+m(n)+'": function(c,p,t,i) {'+e[n]+"}");return"{ "+t.join(",")+" }"}function d(e){var t=[];for(var n in e.partials)t.push('"'+m(n)+'":{name:"'+m(e.partials[n].name)+'", '+d(e.partials[n])+"}");return"partials: {"+t.join(",")+"}, subs: "+p(e.subs)}function m(e){return e.replace(s,"\\\\").replace(n,'\\"').replace(r,"\\n").replace(i,"\\r")}function g(e){return~e.indexOf(".")?"d":"f"}function y(e,t){var n="<"+(t.prefix||""),r=n+e.n+v++;return t.partials[r]={name:e.n,partials:{}},t.code+='t.b(t.rp("'+m(r)+'",c,p,"'+(e.indent||"")+'"));',r}function b(e,t){t.code+="t.b(t.t(t."+g(e.n)+'("'+m(e.n)+'",c,p,0)));'}function w(e){return"t.b("+e+");"}var t=/\S/,n=/\"/g,r=/\n/g,i=/\r/g,s=/\\/g;e.tags={"#":1,"^":2,"<":3,$:4,"/":5,"!":6,">":7,"=":8,_v:9,"{":10,"&":11,_t:12},e.scan=function(r,i){function S(){v.length>0&&(m.push({tag:"_t",text:new String(v)}),v="")}function x(){var n=!0;for(var r=b;r<m.length;r++){n=e.tags[m[r].tag]<e.tags._v||m[r].tag=="_t"&&m[r].text.match(t)===null;if(!n)return!1}return n}function T(e,t){S();if(e&&x())for(var n=b,r;n<m.length;n++)m[n].text&&((r=m[n+1])&&r.tag==">"&&(r.indent=m[n].text.toString()),m.splice(n,1));else t||m.push({tag:"\n"});g=!1,b=m.length}function N(e,t){var n="="+E,r=e.indexOf(n,t),i=u(e.substring(e.indexOf("=",t)+1,r)).split(" ");return w=i[0],E=i[i.length-1],r+n.length-1}var s=r.length,f=0,l=1,c=2,h=f,p=null,d=null,v="",m=[],g=!1,y=0,b=0,w="{{",E="}}";i&&(i=i.split(" "),w=i[0],E=i[1]);for(y=0;y<s;y++)h==f?a(w,r,y)?(--y,S(),h=l):r.charAt(y)=="\n"?T(g):v+=r.charAt(y):h==l?(y+=w.length-1,d=e.tags[r.charAt(y+1)],p=d?r.charAt(y+1):"_v",p=="="?(y=N(r,y),h=f):(d&&y++,h=c),g=y):a(E,r,y)?(m.push({tag:p,n:u(v),otag:w,ctag:E,i:p=="/"?g-w.length:y+E.length}),v="",y+=E.length-1,h=f,p=="{"&&(E=="}}"?y++:o(m[m.length-1]))):v+=r.charAt(y);return T(g,!0),m};var f={_t:!0,"\n":!0,$:!0,"/":!0};e.stringify=function(t,n,r){return"{code: function (c,p,i) { "+e.wrapMain(t.code)+" },"+d(t)+"}"};var v=0;e.generate=function(t,n,r){v=0;var i={code:"",subs:{},partials:{}};return e.walk(t,i),r.asString?this.stringify(i,n,r):this.makeTemplate(i,n,r)},e.wrapMain=function(e){return'var t=this;t.b(i=i||"");'+e+"return t.fl();"},e.template=e.Template,e.makeTemplate=function(e,t,n){var r=this.makePartials(e);return r.code=new Function("c","p","i",this.wrapMain(e.code)),new this.template(r,t,this,n)},e.makePartials=function(e){var t,n={subs:{},partials:e.partials,name:e.name};for(t in n.partials)n.partials[t]=this.makePartials(n.partials[t]);for(t in e.subs)n.subs[t]=new Function("c","p","t","i",e.subs[t]);return n},e.codegen={"#":function(t,n){n.code+="if(t.s(t."+g(t.n)+'("'+m(t.n)+'",c,p,1),'+"c,p,0,"+t.i+","+t.end+',"'+t.otag+" "+t.ctag+'")){'+"t.rs(c,p,"+"function(c,p,t){",e.walk(t.nodes,n),n.code+="});c.pop();}"},"^":function(t,n){n.code+="if(!t.s(t."+g(t.n)+'("'+m(t.n)+'",c,p,1),c,p,1,0,0,"")){',e.walk(t.nodes,n),n.code+="};"},">":y,"<":function(t,n){var r={partials:{},code:"",subs:{},inPartial:!0};e.walk(t.nodes,r);var i=n.partials[y(t,n)];i.subs=r.subs,i.partials=r.partials},$:function(t,n){var r={subs:{},code:"",partials:n.partials,prefix:t.n};e.walk(t.nodes,r),n.subs[t.n]=r.code,n.inPartial||(n.code+='t.sub("'+m(t.n)+'",c,p,i);')},"\n":function(e,t){t.code+=w('"\\n"'+(e.last?"":" + i"))},_v:function(e,t){t.code+="t.b(t.v(t."+g(e.n)+'("'+m(e.n)+'",c,p,0)));'},_t:function(e,t){t.code+=w('"'+m(e.text)+'"')},"{":b,"&":b},e.walk=function(t,n){var r;for(var i=0,s=t.length;i<s;i++)r=e.codegen[t[i].tag],r&&r(t[i],n);return n},e.parse=function(e,t,n){return n=n||{},l(e,"",[],n.sectionTags||[])},e.cache={},e.cacheKey=function(e,t){return[e,!!t.asString,!!t.disableLambda,t.delimiters,!!t.modelGet].join("||")},e.compile=function(t,n){n=n||{};var r=e.cacheKey(t,n),i=this.cache[r];return i?i:(i=this.generate(this.parse(this.scan(t,n.delimiters),t,n),t,n),this.cache[r]=i)}}(typeof exports!="undefined"?exports:Hogan)

test.html

<!DOCTYPE html>
<meta charset="utf-8">
<style>
  .cell {float:left; box-sizing:border-box; padding:10px; background:rgba(0,0,0,0.3);}
  .cell-size1of2 {width:50%;}
  .cell-size1of3 {width:33.333%;}
  .cell-big {font-size:2em;}
</style>
<script src="hogan-3.0.0.min.js"></script>

<div id="output"></div>

<script type="text/mustache" id="grid">
  <div class="grid {{$grid_classes}}{{/grid_classes}}">
    {{$grid_content}}{{/grid_content}}
  </div>
</script>

<script type="text/mustache" id="cell">
  <div class="cell {{$cell_classes}}{{/cell_classes}}">
    {{$cell_content}}{{/cell_content}}
  </div>
</script>

<script type="text/mustache" id="nested">
  {{<grid}}
    {{$grid_content}}

      {{<cell}}
        {{$cell_classes}}cell-size1of2{{/cell_classes}}
        {{$cell_content}}

          {{<grid}}
            {{$grid_content}}
              {{#cells}}

                {{<cell}}
                  {{$cell_classes}}cell-big cell-size1of3{{/cell_classes}}
                  {{$cell_content}}{{text}}{{/cell_content}}
                {{/cell}}

              {{/cells}}
            {{/grid_content}}
          {{/grid}}

        {{/cell_content}}
      {{/cell}}

    {{/grid_content}}
  {{/grid}}
</script>

<script>
var data = {
  cells: [
    { text: "1" },
    { text: "2" },
    { text: "3" }
  ]
};

var gridTemplate = document.getElementById('grid').innerHTML;
var cellTemplate = document.getElementById('cell').innerHTML;
var nestedTemplate = document.getElementById('nested').innerHTML;
var template = Hogan.compile(nestedTemplate);
var output = template.render(data, {
  "grid": gridTemplate,
  "cell": cellTemplate
});

document.querySelector('#output').innerHTML = output;
</script>