improved DefaultView code to show properties correctly

static/site.js

@@ -29,20 +29,27 @@ class DefaultView extends View{
     }
 
     render() {
-        Object.keys(this.object.json).forEach(
-            key => this.root.appendChild(this.getNode(key))
-        )
+        Object.keys(this.object.json).forEach(key => {
+            let node = this.getNode(key);
+            if (node) this.root.appendChild(node)
+        })
+        return this
     }
 
     getNode(name, value=null) {
         if (this.fields[name]) {
             return this.fields[name]
         }
+        console.log(name)
         value = value === null ? this.object.json[name] : value
 
         if (value instanceof StructuredNode) {
-            this.subviews[name] = new DefaultView(value)
-            this.fields[name] = this.subviews[name].root
+            this.subviews[name] = (new DefaultView(value)).render()
+            const wrap = document.createElement('div')
+            wrap.classList.add('wrapper')
+            wrap.innerHTML += '<b>' + name + ':</b>'
+            wrap.appendChild(this.subviews[name].root)
+            this.fields[name] = wrap
         } else if (value instanceof Array) {
             const elm = document.createElement('ul')
             value.forEach((elm, i) => {
@@ -52,6 +59,9 @@ class DefaultView extends View{
             })
             this.fields[name] = elm
         } else {
+            if (value === null)
+                return
+
             const elm = document.createElement('p')
             elm.innerHTML = `${name}: ${value}`
             this.fields[name] = elm

static/style.css

@@ -68,3 +68,9 @@ a:hover {
     text-decoration: underline;
 }
 
+
+.wrapper {
+    padding: 8px 0 8px 32px;
+    margin: 8px 0;
+    border-left: 8px solid #868686;
+}