ui: properly nest kv resources

ui/index.html

@@ -65,8 +65,8 @@
   <script type="text/x-handlebars" data-template-name="kv/show">
     <a {{action 'linkToKey' parent }}>{{parent}}</a>
 
-    <div class="row">
-      <div class="col-md-5">
+    <div class="col-md-5">
+      <div class="row">
 
         {{#each item in model }}
           <div {{action 'linkToKey' item.key }} class="panel panel-link panel-short">
@@ -89,20 +89,23 @@
   <script type="text/x-handlebars" data-template-name="kv/edit">
     <a {{action 'linkToKey' parent }}>{{parent}}</a>
 
-    <div class="col-md-5">
-      <div class="row">
-          <div {{action 'linkToKey' model.key }} class="panel panel-link panel-short">
-            <div {{bind-attr class=":panel-bar model.isFolder:bg-gray:bg-light-gray" }}></div>
-            <div class="panel-heading">
-              <h3 class="panel-title">
-                {{model.key}}
-              </h3>
+      <div class="col-md-5">
+        <div class="row">
+          {{#each item in siblings }}
+            <div {{action 'linkToKey' item.key }} class="panel panel-link panel-short">
+              <div {{bind-attr class=":panel-bar item.isFolder:bg-gray:bg-light-gray" }}></div>
+              <div class="panel-heading">
+                <h3 class="panel-title">
+                  {{item.key}}
+                </h3>
+              </div>
             </div>
-          </div>
-      </div>
+          {{/each}}
 
+        </div>
     </div>
 
+
     <div class="col-md-5 col-md-offset-1">
       {{ input value=model.value class="form-control"}}
     </div>

ui/javascripts/app/models.js

@@ -87,9 +87,12 @@ App.Key = Ember.Object.extend({
 
   parentKeys: function() {
     var parts = this.get('key').split('/')
-    parts.pop()
+
     console.log(parts)
+    part = parts.slice(2)
+
+    console.log(part)
 
-    return parts
+    return '/'
   }.property('parentKey')
 });

ui/javascripts/app/router.js

@@ -12,9 +12,10 @@ App.Router.map(function() {
     this.resource("nodes", { path: "/nodes" }, function() {
       this.route("show", { path: "/:name" });
     });
-    this.resource("kv", { path: "/kv" });
-    this.resource("kv.show", { path: "/kv/:key" });
-    this.resource("kv.edit", { path: "/kv/:key/edit" });
+    this.resource("kv", { path: "/kv" }, function(){
+      this.route("show", { path: "/:key" });
+      this.route("edit", { path: "/:key/edit" });
+    })
   });
 
   this.route("index", { path: "/" });

ui/javascripts/app/routes.js

@@ -91,8 +91,11 @@ App.KvEditRoute = App.BaseRoute.extend({
     var key = params.key.replace(/-/g, "/")
     return App.Key.create().setProperties(window.fixtures.keys_full[key]);
   },
+
   setupController: function(controller, model) {
     controller.set('content', model);
+    controller.set('siblings', this.modelFor('kv.show'));
+    console.log(this.modelFor('kv.show'))
     controller.set('parent', model.get('parentKeys'));
   }
 });

ui/javascripts/fixtures.js

@@ -303,10 +303,15 @@ fixtures.keys_full = {
     'key': 'web/foo/bar',
     'value': 'baz'
   },
+  "web/foo/baz": {
+    'key': 'web/foo/baz',
+    'value': 'test'
+  },
   "web/": [
     "web/foo/"
   ],
   "web/foo/": [
-    "web/foo/bar"
+    "web/foo/bar",
+    "web/foo/baz"
   ]
 };