ENode.toString() now uses ENode.toPrettyString(), the latter of which will indent the HTML based on the depth value given.

jst/jst.js

 
 
+var PRETTY_INDENTATION = "  ";
+
 
 class ENode{
   constructor(tag){
     this.__attribs.push([aname, aval]);
   }
 
-  toString(){
-    var r = "<" + this.__tag.toUpperCase();
+  toPrettyString(depth){
+    depth || (depth = 0);
+    var ind = "";
+    var strind = "";
+    var eol = "";
+    if (depth > -1){
+      if (depth > 0)
+        ind = PRETTY_INDENTATION + (new Array(depth)).join(PRETTY_INDENTATION);
+      strind = ind + PRETTY_INDENTATION;
+      eol = "\n";
+    }
+
+    var r = ind + "<" + this.__tag.toUpperCase();
     if (this.__attribs.length > 0){
       var attr = this.__attribs.reduce(function(a, at){
         a += ((a !== "") ? " " : "") + at[0].trim() + "=\"" + at[1] + "\"";
     }
 
     if (this.__children.length > 0){
-      r += ">";
+      r += ">" + eol;
+      var lcn = true // lcn = Last Child was Node;
       r += this.__children.reduce(function(a, c){
         if (c instanceof ENode){
-          a += c.toString() + "\n";
+          a += ((lcn === false) ? "\n" : "") + ((depth >= 0) ? c.toPrettyString(depth + 1) : c.toString());
+          lcn = true;
         } else {
-          a += c;
+          a += strind + c;
+          lcn = false;
         }
         return a;
       }, "");
-      r += "</" + this.__tag.toUpperCase() + ">";
+      r += ((lcn === false) ? eol : "") + ind + "</" + this.__tag.toUpperCase() + ">" + eol;
     } else {
-      r += " />";
+      r += " />" + eol;
     }
     return r;
   }
+
+  toString(){
+    return this.toPrettyString(-1);
+  }
 }
 
 
   button: el.bind(null, "button"),
   nav: el.bind(null, "nav"),
   canvas: el.bind(null, "canvas"),
-  caption: el.bind(null, "caption")
+  caption: el.bind(null, "caption"),
+  indentationChar: function(c){
+    if (type(c) === "string" && c.length > 0){
+      PRETTY_INDENTATION = c;
+    }
+    return PRETTY_INDENTATION;
+  }
 };