Add preview to the json generator

x4base · May 5, 2016 · a9d71ac · a9d71ac
1 parent 95a2c1e
commit a9d71ac
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 5 deletions.
diff --git a/caravel/assets/javascripts/datasource.js b/caravel/assets/javascripts/datasource.js
@@ -3,7 +3,8 @@ var jsonGenerator = require("./modules/json_generator");
 
 $(document).ready(function () {
     var $modal = $('#json_gen_modal');
-    $('#convertButton').click(function () {
+
+    var getJsonOrWarn = function () {
         var expression = $('#expression').val().trim();
         var $alert = $modal.find('#errorMsg');
         $alert
@@ -12,15 +13,29 @@ $(document).ready(function () {
             .html("");
         try {
             var parse_tree = jsonGenerator.parse(expression);
-            $('#json').val(JSON.stringify(parse_tree));
-
-            $(this).closest('.modal').modal('hide');
+            return JSON.stringify(parse_tree);
         } catch (e) {
             $alert
                 .show()
                 .html(e.message);
         }
+        return null;
+    };
+
+    $('#convertButton').click(function () {
+        var json = getJsonOrWarn();
+        if (json) {
+            $('#json').val(json);
+            $(this).closest('.modal').modal('hide');
+        }
     });
+
+    $('#previewButton').click(function () {
+        var $preview = $modal.find('#preview');
+        var json = getJsonOrWarn();
+        $preview.html(json || "");
+    });
+
     $modal.on('shown.bs.modal', function () {
         $('#expression').focus();
     });

diff --git a/caravel/assets/javascripts/modules/json_generator.js b/caravel/assets/javascripts/modules/json_generator.js
@@ -71,6 +71,9 @@ var convertArithmetic = function (node) {
 
 var parse = function (expression) {
     expression = expression.trim().replace('\n', '');
+    if (!expression) {
+        throw new Error("Please enter the expression");
+    }
     var parse_tree = jsep(expression);
     var converterMap = {
         CallExpression: convertFuncCall,

diff --git a/caravel/templates/caravel/models/datasource/edit.html b/caravel/templates/caravel/models/datasource/edit.html
@@ -15,12 +15,17 @@ <h4 class="modal-title" id="myModalLabel">JSON Generator</h4>
                 </div>
                 <div class="modal-body">
                     <textarea id="expression" rows="5" cols="60"></textarea>
+                    <p><strong>Preview:</strong></p>
+                    <div class="" id="preview">(Please click the preview button)</div>
                     <div class="alert alert-danger hidden" id="errorMsg"></div>
                 </div>
                 <div class="modal-footer">
                     <button type="button" class="btn btn-default" data-dismiss="modal">
                         Close
                     </button>
+                    <button type="button" class="btn btn-default" id="previewButton">
+                        Preview
+                    </button>
                     <button type="button" class="btn btn-default" id="convertButton">
                         Convert to Json
                     </button>

diff --git a/caravel/views.py b/caravel/views.py
@@ -182,7 +182,8 @@ class DruidMetricInlineView(CompactCRUDMixin, CaravelModelView):  # noqa
             "(http://druid.io/docs/latest/querying/post-aggregations.html)",
             True),
         'json': utils.markdown(
-            "You can also use the [generator](javascript:showJsonGenModal()) to generate json",
+            "You can also use the "
+            "[generator](javascript:showJsonGenModal()) to generate json",
             True),
     }
 appbuilder.add_view_no_menu(DruidMetricInlineView)