A couple of Futon improvements:

 * JSON strings are now displayed as-is in the document view, without the escaping of new-lines and quotes. That dramatically improves readability of multi-line strings.
 * Same goes for editing of JSON string values. When a change to a field value is submitted, and the value is not valid JSON it is assumed to be a string. This improves editing of multi-line strings a lot.
 * Hitting tab in textareas no longer moves focus to the next form field, but simply inserts a tab character at the current caret position.
 * Fixed some font declarations.


git-svn-id: https://svn.apache.org/repos/asf/couchdb/trunk@889013 13f79535-47bb-0310-9956-ffa450edef68

1 files changed, 23 insertions, 14 deletions

diff --git a/share/www/script/futon.browse.js b/share/www/script/futon.browse.js
index e962ee9c..d5b860e2 100644
--- a/share/www/script/futon.browse.js
+++ b/share/www/script/futon.browse.js
@@ -189,7 +189,8 @@
                 }
               }, 100);
             }
-            $("#viewcode textarea").bind("input", updateDirtyState);
+            $("#viewcode textarea").enableTabInsertion()
+              .bind("input", updateDirtyState);
             if ($.browser.msie || $.browser.safari) {
               $("#viewcode textarea").bind("paste", updateDirtyState)
                                      .bind("change", updateDirtyState)
@@ -720,7 +721,7 @@
           $(this).html($("<pre></pre>").html($.futon.formatJSON(page.doc, {html: true})))
             .makeEditable({allowEmpty: false,
               createInput: function(value) {
-                return $("<textarea rows='8' cols='80' spellcheck='false'></textarea>");
+                return $("<textarea rows='8' cols='80' spellcheck='false'></textarea>").enableTabInsertion();
               },
               prepareInput: function(input) {
                 $(input).makeResizable({vertical: true});
@@ -985,10 +986,10 @@
           return;
         }
 
-        row.find("td").makeEditable({allowEmpty: true,
+        row.find("td").makeEditable({acceptOnBlur: false, allowEmpty: true,
           createInput: function(value) {
             if ($("dl", this).length > 0 || $("code", this).text().length > 60) {
-              return $("<textarea rows='8' cols='40' spellcheck='false'></textarea>");
+              return $("<textarea rows='1' cols='40' spellcheck='false'></textarea>");
             }
             return $("<input type='text' spellcheck='false'>");
           },
@@ -998,12 +999,17 @@
           },
           prepareInput: function(input) {
             if ($(input).is("textarea")) {
-              $(input).makeResizable({vertical: true});
+              var height = Math.min(input.scrollHeight, document.body.clientHeight - 100);
+              $(input).height(height).makeResizable({vertical: true}).enableTabInsertion();
             }
           },
           accept: function(newValue) {
             var fieldName = row.data("name");
-            doc[fieldName] = JSON.parse(newValue);
+            try {
+              doc[fieldName] = JSON.parse(newValue);
+            } catch (err) {
+              doc[fieldName] = newValue;
+            }
             page.isDirty = true;
             if (fieldName == "_id") {
               page.docId = page.doc._id = doc[fieldName];
@@ -1011,7 +1017,11 @@
             }
           },
           populate: function(value) {
-            return $.futon.formatJSON(doc[row.data("name")]);
+            value = doc[row.data("name")];
+            if (typeof(value) == "string") {
+              return value;
+            }
+            return $.futon.formatJSON(value);
           },
           validate: function(value) {
             $("div.error", this).remove();
@@ -1024,12 +1034,7 @@
               }
               return true;
             } catch (err) {
-              var msg = err.message;
-              if (msg == "parseJSON" || msg == "JSON.parse") {
-                msg = "Please enter a valid JSON value (for example, \"string\").";
-              }
-              $("<div class='error'></div>").text(msg).appendTo(this);
-              return false;
+              return true;
             }
           }
         });
@@ -1046,7 +1051,11 @@
             }
             return list;
           } else {
-            return $($.futon.formatJSON(val, {html: true}));
+            var html = $.futon.formatJSON(val, {
+              html: true,
+              escapeStrings: false
+            });
+            return $(html);
           }
         }
         var elem = render(value);