瀏覽代碼

HUE-7099 [notebook] Display variables on top

Romain Rigaux 8 年之前
父節點
當前提交
7a15f4ef4d

+ 3 - 5
desktop/libs/notebook/src/notebook/static/notebook/js/notebook.ko.js

@@ -2661,7 +2661,7 @@ var EditorViewModel = (function() {
         self.selectedNotebook().fetchHistory(); // Js error if notebook did not have snippets
       }
     });
-    self.preEditorTogglingSnippet = null;
+    self.preEditorTogglingSnippet = ko.observable();
     self.postEditorTogglingSnippets = {};
     self.toggleEditorMode = function() {
       var _notebook = self.selectedNotebook();
@@ -2669,7 +2669,7 @@ var EditorViewModel = (function() {
 
       if (self.editorType() != 'notebook') {
         self.editorType('notebook');
-        self.preEditorTogglingSnippet = _notebook.snippets()[0];
+        self.preEditorTogglingSnippet(_notebook.snippets()[0]);
         // Split statements
         _notebook.type('notebook');
         _notebook.snippets()[0].statementsList().forEach(function (sql_statement) {
@@ -2686,7 +2686,7 @@ var EditorViewModel = (function() {
       } else {
         self.editorType(options.editor_type);
         // Revert to one statement
-        _newSnippets.push(self.preEditorTogglingSnippet);
+        _newSnippets.push(self.preEditorTogglingSnippet());
         _notebook.type('query-' + options.editor_type);
       }
       _notebook.snippets(_newSnippets);
@@ -2696,7 +2696,6 @@ var EditorViewModel = (function() {
       _notebook.isPresentation(! _notebook.isPresentation());
 
       self.isEditing(! self.isEditing());
-      //self.isFullscreenMode(! self.isFullscreenMode());
       self.isPresentationMode(! self.isPresentationMode());
 
       if (options.editor_type != 'notebook') {
@@ -2715,7 +2714,6 @@ var EditorViewModel = (function() {
 
     self.combinedContent = ko.observable();
     self.isPresentationMode = ko.observable(false);
-    //self.isFullscreenMode = ko.observable(false);
     self.successUrl = ko.observable(options.success_url); // Deprecated
     self.isOptimizerEnabled = ko.observable(options.is_optimizer_enabled);
     self.isNavigatorEnabled = ko.observable(options.is_navigator_enabled);

+ 21 - 11
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -383,8 +383,13 @@ ${ sqlSyntaxDropdown.sqlSyntaxDropdown() }
 
     <!-- ko if: $root.selectedNotebook() -->
       Title            | buttons
-      <br>
-      Variables
+
+      <div class="clearfix"></div>
+
+      <!-- ko if: $root.preEditorTogglingSnippet -->
+        <!-- ko template: { if: $root.isPresentationMode(), name: 'snippet-variables', data: $root.preEditorTogglingSnippet }--><!-- /ko -->
+      <!-- /ko -->
+
     <!-- /ko -->
   </div>
 </%def>
@@ -1139,19 +1144,24 @@ ${ sqlSyntaxDropdown.sqlSyntaxDropdown() }
     </div>
 
     <div class="clearfix"></div>
-    <ul data-bind="foreach: variables" class="unstyled inline">
-      <li>
-        <div class="input-prepend margin-top-10">
-          <span class="muted add-on" data-bind="text: name"></span>
-          <input class="input-medium" type="text" data-bind="value: value, attr: { placeholder: defaultValue() || '${ _ko('Variable value') }' }, valueUpdate: 'afterkeydown', autogrowInput: { minWidth: 150, maxWidth: 270, comfortZone: 15 }, event: { 'keypress': function (context, e){ if (e.ctrlKey && e.which === 13) { $parent.ace().commands.commands['execute'].exec(); } return true; } }">
-        </div>
-        </div>
-      </li>
-    </ul>
+    <!-- ko template: { if: ! $root.isPresentationMode(), name: 'snippet-variables' }--><!-- /ko -->
   </div>
   <div class="clearfix"></div>
 </script>
 
+
+<script type="text/html" id="snippet-variables">
+  <ul data-bind="foreach: variables" class="unstyled inline">
+    <li>
+      <div class="input-prepend margin-top-10">
+        <span class="muted add-on" data-bind="text: name"></span>
+        <input class="input-medium" type="text" data-bind="value: value, attr: { placeholder: defaultValue() || '${ _ko('Variable value') }' }, valueUpdate: 'afterkeydown', autogrowInput: { minWidth: 150, maxWidth: 270, comfortZone: 15 }, event: { 'keypress': function (context, e){ if (e.ctrlKey && e.which === 13) { $parent.ace().commands.commands['execute'].exec(); } return true; } }">
+      </div>
+    </li>
+  </ul>
+</script>
+
+
 <script type="text/html" id="snippet-chart-settings${ suffix }">
   <div>
     <!-- ko if: chartType() != '' && chartType() == ko.HUE_CHARTS.TYPES.TIMELINECHART -->