switching to doc object for output JSON

Author: BigBlueHat

app.js

@@ -48,23 +48,13 @@ Vue.component('json-schema-property', {
 var app = new Vue({
   el: '#editor',
   data: {
-    schema: {}
+    schema: {},
+    doc: {}
   },
   computed: {
     output: {
       $get: function() {
-        var self = this;
-        var rv = {};
-        var keys = {};
-        if (self.schema && self.schema.properties) {
-          keys = Object.keys(self.schema.properties);
-          keys.forEach(function(key) {
-            rv[key] = self.schema.properties[key].value;
-          });
-          return JSON.stringify(rv, null, "\t");
-        } else {
-          return {};
-        }
+        return JSON.stringify(this.doc, null, "\t");
       }
     }
   },

index.html

@@ -18,7 +18,7 @@
           <form class="pure-form pure-form-aligned">
             <h1 v-if="schema.title">{{schema.title}}</h1>
             <div v-if="schema.description"><small>{{schema.description}}</small></div>
-            <div v-repeat="schema.properties" v-component="json-schema-property"></div>
+            <div v-repeat="schema.properties" v-component="json-schema-property" v-with="doc: doc"></div>
           </form>
       </div>
       <textarea id="schema"
@@ -33,7 +33,7 @@ <h1 v-if="schema.title">{{schema.title}}</h1>
   <script id="json-schema-property" type="text/vue-template+html">
     <div class="pure-control-group">
       <label for="{{$key}}">{{$key}}</label>
-      <input name="{{$key}}" v-model="value" type="{{type | input_type}}" />
+      <input name="{{$key}}" v-model="doc.{{$key}}" type="{{type | input_type}}" />
       <p class="pure-help-inline" v-if="description"><small>{{description}}</small></p>
     </div>
   </script>