From 147cd0b7965b91ff5028b9c4bb17b59ce9b07996 Mon Sep 17 00:00:00 2001
From: Brian Ford <btford@umich.edu>
Date: Tue, 9 Dec 2014 14:32:45 -0800
Subject: [PATCH] feat(panel/scopes): allow changing model values

---
 panel/components/inspected-app/inspected-app.js | 12 ++++++++++--
 panel/components/json-tree/json-tree.js         | 11 ++++++++++-
 panel/scopes/scopes.html                        |  3 ++-
 panel/scopes/scopes.js                          |  3 +++
 4 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/panel/components/inspected-app/inspected-app.js b/panel/components/inspected-app/inspected-app.js
index 3d84660..451b1ed 100644
--- a/panel/components/inspected-app/inspected-app.js
+++ b/panel/components/inspected-app/inspected-app.js
@@ -17,8 +17,16 @@ function inspectedAppService($rootScope) {
     return invokeAngularHintMethod('unwatch', scopeId, path);
   };
 
-  function invokeAngularHintMethod(method, scopeId, path) {
-    var args = [parseInt(scopeId, 10), path || ''].map(JSON.stringify).join(',');
+  this.assign = function (scopeId, path, value) {
+    return invokeAngularHintMethod('assign', scopeId, path, value);
+  };
+
+  function invokeAngularHintMethod(method, scopeId, path, value) {
+    var args = [parseInt(scopeId, 10), path || ''].
+                  map(JSON.stringify).
+                  concat(value ? [value] : []).
+                  join(',');
+
     chrome.devtools.inspectedWindow.eval('angular.hint.' + method + '(' + args + ')');
   }
 
diff --git a/panel/components/json-tree/json-tree.js b/panel/components/json-tree/json-tree.js
index 85aa5f7..3f6e583 100644
--- a/panel/components/json-tree/json-tree.js
+++ b/panel/components/json-tree/json-tree.js
@@ -12,6 +12,7 @@ function batJsonTreeDirective() {
     terminal: true,
     scope: {
       batInspect: '&',
+      batAssign: '&',
       batModel: '='
     },
     link: jsonTreeLinkFn
@@ -89,9 +90,17 @@ function batJsonTreeDirective() {
             val = '"' + val + '"';
           }
           childElt = angular.element(
-            '<span class="console-formatted-' + (typeof val) + '">' +
+            '<span contentEditable="true" class="console-formatted-' + (typeof val) + '">' +
               val +
             '</span>');
+
+          // TODO: test this
+          childElt.on('blur', function () {
+            scope.batAssign({
+              path: fullPath,
+              value: childElt.text()
+            });
+          })
         }
 
         parentElt.append(childElt);
diff --git a/panel/scopes/scopes.html b/panel/scopes/scopes.html
index 444a3e5..3b00e4b 100644
--- a/panel/scopes/scopes.html
+++ b/panel/scopes/scopes.html
@@ -16,7 +16,8 @@
           <div class="section expanded">
             <bat-json-tree
                 bat-model="scopes[inspectedScope].models"
-                bat-inspect="inspect(path)"></bat-json-tree>
+                bat-inspect="inspect(path)"
+                bat-assign="assign(path, value)"></bat-json-tree>
           </div>
         </div>
       </div>
diff --git a/panel/scopes/scopes.js b/panel/scopes/scopes.js
index 3fb8565..7dde851 100644
--- a/panel/scopes/scopes.js
+++ b/panel/scopes/scopes.js
@@ -10,6 +10,9 @@ function ScopesController($scope, inspectedApp) {
   $scope.inspect = function (path) {
     inspectedApp.watch($scope.inspectedScope, path);
   };
+  $scope.assign = function (path, value) {
+    inspectedApp.assign($scope.inspectedScope, path, value);
+  };
 
   $scope.inspectedScope = null;