1 files changed, 82 insertions, 0 deletions
diff --git a/third_party/jstemplate/tutorial_examples/08-transclude.html b/third_party/jstemplate/tutorial_examples/08-transclude.html
new file mode 100644
index 0000000..ebab76f
--- /dev/null
+++ b/third_party/jstemplate/tutorial_examples/08-transclude.html
@@ -0,0 +1,82 @@
+<html>
+<head><title>Outline Tree Using Jstemplates</title>
+  <script src="../util.js" type="text/javascript"></script>
+  <script src="../jsevalcontext.js" type="text/javascript"></script>
+  <script src="../jstemplate.js" type="text/javascript"></script>
+  <script type="text/javascript">
+    // Hierarchical data:
+    var tplData = 
+      { title: "Jstemplates", items: [
+        { title: "Using Jstemplates", items: [
+          { title: "The Jstemplates Module"},
+          { title: "Javascript Data"},
+          { title: "Template HTML"},
+          { title: "Processing Templates with Javascript Statements"}
+          ]
+        },
+        { title: "Template Processing Instructions", items: [
+          { title: "Processing Environment" },
+          { title: "Instruction Attributes", items: [
+            {title: "jscontent"}, {title: "jsselect"}, {title: "jsdisplay"}, 
+            {title: "transclude"},{title: "jsvalues"}, {title: "jsskip"}, {title: "jseval"}
+          ]}
+        ]}
+      ]};
+      
+    var PEG_NAME = 'peg';
+    var TEMPLATE_NAME = 'tpl';
+    
+    // Called by the body onload handler:
+    function jsinit() {
+      pegElement = domGetElementById(document, PEG_NAME);
+      loadData(pegElement, TEMPLATE_NAME, tplData);
+    }
+  
+    function loadData(peg, templateId, data) {
+      // Get a copy of the template:
+      var templateToProcess = jstGetTemplate(templateId);
+      
+      // Wrap our data in a context object:
+      var processingContext = new JsEvalContext(data);
+  
+      // Process the template
+      jstProcess(processingContext, templateToProcess);
+      
+      // Clear the element to which we'll attach the processed template:
+      peg.innerHTML = '';
+      
+      // Attach the template:
+            domAppendChild(peg, templateToProcess);
+    }
+    </script>
+    <link rel="stylesheet" type="text/css" href="css/maps2.deb.css"/>
+</head>
+<body onload="jsinit()">
+
+<!-- 
+This is the div to which the instantiated template will be attached.
+-->
+<div id="peg"></div>
+
+<!--
+A container to hide our template:
+-->
+<div style="display:none">
+<!-- 
+This is the template div. It will be copied and attached to the div above with:
+ var apt = jstGetTemplate('apt');
+ appendChild(panel, apt)
+-->
+  <div id="tpl">
+    <span jscontent="title">Outline heading</span>
+    <ul jsdisplay="items.length">
+      <li jsselect="items">
+        <!--Recursive tranclusion: -->
+        <div transclude="tpl"></div>
+      </li>
+    </ul>
+  </div>
+
+</div>
+</body>
+</html>