Beautify Code button fixed for views and reducesBEAUTIFY

3 files changed, 21 insertions, 7 deletions

diff --git a/src/fauxton/app/addons/documents/assets/less/documents.less b/src/fauxton/app/addons/documents/assets/less/documents.less
index 38fd7922e..68fc58daa 100644
--- a/src/fauxton/app/addons/documents/assets/less/documents.less
+++ b/src/fauxton/app/addons/documents/assets/less/documents.less
@@ -19,4 +19,6 @@ tr.all-docs-item{
         top: 6px;
     }
 }
-
+button.beautify {
+	margin-top: 20px;
+}
diff --git a/src/fauxton/app/addons/documents/templates/view_editor.html b/src/fauxton/app/addons/documents/templates/view_editor.html
index 036aff904..bf31ba2f6 100644
--- a/src/fauxton/app/addons/documents/templates/view_editor.html
+++ b/src/fauxton/app/addons/documents/templates/view_editor.html
@@ -41,7 +41,7 @@ the License.
             <div class="js-editor" id="map-function"><%= langTemplates.map %></div>
             <% } else { %>
             <div class="js-editor" id="map-function"><%- ddoc.get('views')[viewName].map %></div>
-            <button class="beautify button hidden" type="button">beautify this code</button>
+            <button class="beautify beautify_map button hidden beautify-tooltip" type="button" data-toggle="tooltip" title="Reformat your minified code to make edits to it.">beautify this code</button>
             <% } %>
           </div>
 
@@ -64,6 +64,7 @@ the License.
             <div class="js-editor" id="reduce-function"><%= langTemplates.reduce %></div>
             <% } else { %>
             <div class="js-editor" id="reduce-function"><%- ddoc.get('views')[viewName].reduce %></div>
+            <button class="beautify beautify_reduce button hidden beautify-tooltip" type="button" data-toggle="tooltip" title="Reformat your minified code to make edits to it.">beautify this code</button>
             <% } %>
           </div>
 
diff --git a/src/fauxton/app/addons/documents/views.js b/src/fauxton/app/addons/documents/views.js
index 392cfc46c..dd1468dad 100644
--- a/src/fauxton/app/addons/documents/views.js
+++ b/src/fauxton/app/addons/documents/views.js
@@ -1249,7 +1249,8 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum
       "change select#reduce-function-selector": "updateReduce",
       "click button.preview": "previewView",
       "click #db-views-tabs-nav": 'toggleIndexNav',
-      "click .beautify":  "beautifyCode"
+      "click .beautify_map":  "beautifyCode",
+      "click .beautify_reduce":  "beautifyCode"
     },
 
     langTemplates: {
@@ -1591,6 +1592,11 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum
         couchJSHINT: true
       });
       this.reduceEditor.render();
+
+      if (this.reduceEditor.getLines() === 1){
+        this.$('.beautify_reduce').removeClass("hidden");
+        $('.beautify-tooltip').tooltip();
+      }
     },
 
     beforeRender: function () {
@@ -1639,6 +1645,8 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum
         this.$('#index').hide();
         this.$('#index-nav').parent().removeClass('active');
       }
+
+
     },
 
     showEditors: function () {
@@ -1665,12 +1673,15 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum
       this.reduceEditor && this.reduceEditor.editSaved();
 
       if (this.mapEditor.getLines() === 1){
-        this.$('.beautify').removeClass("hidden");
+        this.$('.beautify_map').removeClass("hidden");
+        $('.beautify-tooltip').tooltip();
       }
     },
-    beautifyCode: function(){
-      var beautifiedCode = beautify(this.mapEditor.getValue());
-      this.mapEditor.setValue(beautifiedCode);
+    beautifyCode: function(e){
+      e.preventDefault();
+      var targetEditor = $(e.currentTarget).hasClass('beautify_reduce')?this.reduceEditor:this.mapEditor;
+      var beautifiedCode = beautify(targetEditor.getValue());
+      targetEditor.setValue(beautifiedCode);
     },
     cleanup: function () {
       this.mapEditor && this.mapEditor.remove();