Add ability to edit query description (FED #22)

getredash · Jan 14, 2014 · aa7d066 · aa7d066
1 parent 4a15633
commit aa7d066
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 9 deletions.
diff --git a/rd_ui/app/scripts/directives.js b/rd_ui/app/scripts/directives.js
@@ -162,10 +162,16 @@ directives.directive('editInPlace', function () {
             value: '=',
             ignoreBlanks: '='
         },
-        template: '<span ng-click="edit()" ng-bind="value"></span><input ng-model="value"></input>',
+        template: function(tElement, tAttrs) {
+            var elType = tAttrs.editor || 'input';
+            var placeholder = tAttrs.placeholder || 'Click to edit';
+            return '<span ng-click="edit()" ng-bind="value"></span>' +
+                   '<span ng-click="edit()" ng-show="!value">' + placeholder + '</span>' +
+                   '<{elType} ng-model="value"></{elType}>'.replace('{elType}', elType);
+        },
         link: function ($scope, element, attrs) {
             // Let's get a reference to the input element, as we'll want to reference it.
-            var inputElement = angular.element(element.children()[1]);
+            var inputElement = angular.element(element.children()[2]);
 
             // This directive should have a set class so we can style it.
             element.addClass('edit-in-place');

diff --git a/rd_ui/app/styles/redash.css b/rd_ui/app/styles/redash.css
@@ -23,19 +23,26 @@ a.navbar-brand {
 }
 
 .edit-in-place span {
-  cursor: pointer;
+    cursor: pointer;
 }
 
-.edit-in-place input {
-  display: none;
+.edit-in-place input,
+.edit-in-place textarea {
+    display: none;
+}
+
+.edit-in-place textarea {
+    height: 80px;
+    width: 250px;
 }
 
 .edit-in-place.active span {
-  display: none;
+    display: none;
 }
 
-.edit-in-place.active input {
-  display: inline-block;
+.edit-in-place.active input,
+.edit-in-place.active textarea {
+    display: inline-block;
 }
 
 .delete-button {

diff --git a/rd_ui/app/views/queryfiddle.html b/rd_ui/app/views/queryfiddle.html
@@ -3,7 +3,20 @@
         <div class="panel panel-default">
             <div class="panel-heading">
                 <h3 class="panel-title">
-                    <span class="glyphicon glyphicon-pencil"></span> <edit-in-place ignore-blanks='true' value="query.name"></edit-in-place>
+                    <div class="row">
+                        <div class="col-lg-6">
+                            <p>
+                                <edit-in-place ignore-blanks='true' value="query.name"></edit-in-place>
+                            </p>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-lg-6">
+                            <p>
+                                <edit-in-place class="text-muted" editor="textarea" placeholder="No description" ignore-blanks='true' value="query.description"></edit-in-place>
+                            </p>
+                        </div>
+                    </div>
                 </h3>
             </div>
             <div class="panel-body">