ui: wire up kv

ui/index.html

@@ -77,7 +77,7 @@
             <div {{bind-attr class=":panel-bar item.isFolder:bg-gray:bg-light-gray" }}></div>
             <div class="panel-heading">
               <h3 class="panel-title">
-                {{item.key}}
+                {{item.keyWithoutParent}}
               </h3>
             </div>
           {{/link-to}}
@@ -109,7 +109,7 @@
                 <div {{ bind-attr class=":form-group newKey.keyValid:valid" }}>
                   <div class="input-group">
                     <span class="input-group-addon">{{topModel.parentKey}}</span>
-                    {{ input value=newKey.key class="form-control" required=true }}
+                    {{ input value=newKey.Key class="form-control" required=true }}
                   </div>
                 </div>
 
@@ -139,7 +139,7 @@
               <div {{bind-attr class=":panel-bar item.isFolder:bg-gray:bg-light-gray" }}></div>
               <div class="panel-heading">
                 <h3 class="panel-title">
-                  {{item.key}}
+                  {{item.keyWithoutParent}}
                 </h3>
               </div>
             {{/link-to}}
@@ -160,7 +160,7 @@
           <div {{ bind-attr class=":panel-bar isLoading:bg-orange:bg-green" }}></div>
             <div class="panel-heading">
               <h3 class="panel-title">
-                {{model.key}}
+                {{model.Key}}
               </h3>
             </div>
 

ui/javascripts/app/models.js

@@ -90,20 +90,26 @@ App.Node = Ember.Object.extend({
 //
 App.Key = Ember.Object.extend(Ember.Validations.Mixin, {
   validations: {
-    key: { presence: true },
-    value: { presence: true }
+    Key: { presence: true },
+    Value: { presence: true }
   },
 
-  keyValid: Ember.computed.empty('errors.key'),
-  valueValid: Ember.computed.empty('errors.value'),
+  keyValid: Ember.computed.empty('errors.Key'),
+  valueValid: Ember.computed.empty('errors.Value'),
+
+  keyWithoutParent: function() {
+    return (this.get('Key').replace(this.get('parentKey'), ''));
+  }.property('Key'),
 
   isFolder: function() {
-    return (this.get('key').slice(-1) == "/")
-  }.property('key'),
+    return (this.get('Key').slice(-1) == "/")
+  }.property('Key'),
 
   urlSafeKey: function() {
-    return this.get('key').replace(/\//g, "-")
-  }.property('key'),
+    console.log(this)
+
+    return this.get('Key').replace(/\//g, "-")
+  }.property('Key'),
 
   linkToRoute: function() {
     var key = this.get('urlSafeKey')
@@ -113,16 +119,16 @@ App.Key = Ember.Object.extend(Ember.Validations.Mixin, {
     } else {
       return 'kv.edit'
     }
-  }.property('key'),
+  }.property('Key'),
 
   keyParts: function() {
-    var key = this.get('key');
+    var key = this.get('Key');
 
     if (key.slice(-1) == "/") {
       key = key.substring(0, key.length - 1);
     }
     return key.split('/');
-  }.property('key'),
+  }.property('Key'),
 
   parentKey: function() {
     var parts = this.get('keyParts').toArray();
@@ -130,7 +136,7 @@ App.Key = Ember.Object.extend(Ember.Validations.Mixin, {
     parts.pop();
 
     return parts.join("/") + "/";
-  }.property('key'),
+  }.property('Key'),
 
   grandParentKey: function() {
     var parts = this.get('keyParts').toArray();
@@ -139,5 +145,5 @@ App.Key = Ember.Object.extend(Ember.Validations.Mixin, {
     parts.pop();
 
     return parts.join("/") + "/";
-  }.property('key')
+  }.property('Key')
 });

ui/javascripts/app/routes.js

@@ -89,13 +89,17 @@ App.KvIndexRoute = App.BaseRoute.extend({
 App.KvShowRoute = App.BaseRoute.extend({
   model: function(params) {
     var key = params.key.replace(/-/g, "/")
-    objs = [];
 
-    window.fixtures.keys_full[key].map(function(obj){
-     objs.push(App.Key.create({key: obj}));
+    return Ember.$.getJSON('/v1/kv/' + key + '?keys&seperator=' + '/').then(function(data) {
+
+      objs = [];
+
+      data.map(function(obj){
+       objs.push(App.Key.create({Key: obj}));
+      });
+
+      return objs;
     });
-
-    return objs
   },
 
   setupController: function(controller, model) {
@@ -107,20 +111,45 @@ App.KvShowRoute = App.BaseRoute.extend({
 
 App.KvEditRoute = App.BaseRoute.extend({
   model: function(params) {
-    var key = params.key.replace(/-/g, "/")
-    return App.Key.create().setProperties(window.fixtures.keys_full[key]);
+    var object = Ember.Object.create();
+    var keyName = params.key.replace(/-/g, "/")
+    var key = keyName;
+    var parentKey;
+
+    // Get the parent key
+    if (key.slice(-1) == "/") {
+      key = key.substring(0, key.length - 1);
+    }
+    parts = key.split('/');
+    parts.pop();
+    if (parts.length == 0) {
+      parentKey = ""
+    } else {
+      parentKey = parts.join("/") + "/";
+    }
+
+    var keyPromise = Ember.$.getJSON('/v1/kv/' + keyName).then(function(data) {
+      object.set('key', App.Key.create().setProperties(data[0]))
+      return object;
+    });
+
+    var keysPromise = Ember.$.getJSON('/v1/kv/' + parentKey + '?keys&seperator=' + '/').then(function(data) {
+      objs = [];
+      data.map(function(obj){
+       objs.push(App.Key.create({Key: obj}));
+      });
+      object.set('keys', objs);
+      return object;
+    });
+
+    return keysPromise.then(keyPromise);
   },
 
   setupController: function(controller, model) {
-    controller.set('content', model);
+    controller.set('content', model.get('key'));
+    controller.set('siblings', model.get('keys'));
 
     if (this.modelFor('kv.show') == undefined ) {
-      var key = model.get('parentKey')
-      objs = [];
-      window.fixtures.keys_full[key].map(function(obj){
-       objs.push(App.Key.create({key: obj}));
-      });
-      controller.set('siblings', objs);
     } else {
       controller.set('siblings', this.modelFor('kv.show'));
     }