Browse Source

[spark] Fix snippet type switch

When the snippet specific properties were introduced it broke the snippet type switch. With this commit it will update the properties of the snippet to match the type, it will also keep any previous properties for the snippet type in case the user changes his mind and switches back to the initial type.
Johan Ahlen 10 years ago
parent
commit
c720f3c1d2

+ 54 - 33
apps/spark/src/spark/static/spark/js/spark.ko.js

@@ -119,7 +119,40 @@ var TYPE_ACE_EDITOR_MAP = {
   'python': 'ace/mode/python',
   'python': 'ace/mode/python',
   'scala': 'ace/mode/scala',
   'scala': 'ace/mode/scala',
   'pig': 'ace/mode/pig'
   'pig': 'ace/mode/pig'
-}
+};
+
+var getDefaultSnippetProperties = function (snippetType) {
+  var properties = {};
+
+  if (snippetType == 'jar' || snippetType == 'py') {
+    properties['driverCores'] = '';
+    properties['executorCores'] = '';
+    properties['numExecutors'] = '';
+    properties['queue'] = '';
+    properties['archives'] = [];
+  };
+
+  if (snippetType == 'jar') {
+    properties['app_jar'] = '';
+    properties['class'] = '';
+    properties['arguments'] = [];
+  }
+  else if (snippetType == 'py') {
+    properties['py_file'] = '';
+    properties['arguments'] = [];
+  }
+  else if (snippetType == 'hive') {
+    properties['settings'] = [];
+    properties['files'] = [];
+  }
+  else if (snippetType == 'pig') {
+    properties['parameters'] = [];
+    properties['hadoop_properties'] = [];
+    properties['files'] = [];
+  }
+
+  return properties;
+};
 
 
 var Snippet = function (vm, notebook, snippet) {
 var Snippet = function (vm, notebook, snippet) {
   var self = this;
   var self = this;
@@ -139,7 +172,26 @@ var Snippet = function (vm, notebook, snippet) {
   self.codemirrorSize = ko.observable(typeof snippet.codemirrorSize != "undefined" && snippet.codemirrorSize != null ? snippet.codemirrorSize : 100);
   self.codemirrorSize = ko.observable(typeof snippet.codemirrorSize != "undefined" && snippet.codemirrorSize != null ? snippet.codemirrorSize : 100);
   // self.statement_raw.extend({ rateLimit: 150 }); // Should prevent lag from typing but currently send the old query when using the key shortcut
   // self.statement_raw.extend({ rateLimit: 150 }); // Should prevent lag from typing but currently send the old query when using the key shortcut
   self.status = ko.observable(typeof snippet.status != "undefined" && snippet.status != null ? snippet.status : 'loading');
   self.status = ko.observable(typeof snippet.status != "undefined" && snippet.status != null ? snippet.status : 'loading');
-  self.properties = ko.mapping.fromJS(typeof snippet.properties != "undefined" && snippet.properties != null ? snippet.properties : {});
+
+  self.properties = ko.observable(ko.mapping.fromJS(typeof snippet.properties != "undefined" && snippet.properties != null ? snippet.properties : getDefaultSnippetProperties(self.type())));
+  self.hasProperties = ko.computed(function() {
+    return Object.keys(ko.mapping.toJS(self.properties())).length > 0;
+  });
+
+  var previousProperties = {};
+  self.type.subscribe(function(oldValue) {
+    previousProperties[oldValue] = self.properties();
+  }, null, "beforeChange");
+
+  self.type.subscribe(function (newValue) {
+    self.aceEditorMode(TYPE_ACE_EDITOR_MAP[newValue]);
+    if (typeof previousProperties[newValue] != "undefined") {
+      self.properties(previousProperties[newValue]);
+    } else {
+      self.properties(ko.mapping.fromJS(getDefaultSnippetProperties(newValue)));
+    }
+  });
+
   self.variables = ko.observableArray([]);
   self.variables = ko.observableArray([]);
   self.variableNames = ko.computed(function () {
   self.variableNames = ko.computed(function () {
     var matches = [];
     var matches = [];
@@ -697,40 +749,9 @@ var Notebook = function (vm, notebook) {
   };
   };
 
 
   self.newSnippet = function () {
   self.newSnippet = function () {
-    var properties = {};
-
-    var addSparkYarnProperties = function() {
-      properties['driverCores'] = '';
-      properties['executorCores'] = '';
-      properties['numExecutors'] = '';
-      properties['queue'] = '';
-      properties['archives'] = [];
-    };
 
 
-    if (self.selectedSnippet() == 'jar') {
-      properties['app_jar'] = '';
-      properties['class'] = '';
-      properties['arguments'] = [];
-      addSparkYarnProperties();
-    }
-    else if (self.selectedSnippet() == 'py') {
-      properties['py_file'] = '';
-      properties['arguments'] = [];
-      addSparkYarnProperties();
-    }
-    else if (self.selectedSnippet() == 'hive') {
-      properties['settings'] = [];
-      properties['files'] = [];
-    }
-    else if (self.selectedSnippet() == 'pig') {
-      properties['parameters'] = [];
-      properties['hadoop_properties'] = [];
-      properties['files'] = [];
-    }
-	
     var _snippet = new Snippet(vm, self, {
     var _snippet = new Snippet(vm, self, {
       type: self.selectedSnippet(),
       type: self.selectedSnippet(),
-      properties: properties,
       result: {}
       result: {}
     });
     });
     self.snippets.push(_snippet);
     self.snippets.push(_snippet);

+ 12 - 12
apps/spark/src/spark/templates/editor_components.mako

@@ -340,7 +340,7 @@ from django.utils.translation import ugettext as _
         <div class="hover-actions inline pull-right" style="font-size: 15px;">
         <div class="hover-actions inline pull-right" style="font-size: 15px;">
           <a href="javascript:void(0)" class="move-widget"><i class="fa fa-arrows"></i></a>
           <a href="javascript:void(0)" class="move-widget"><i class="fa fa-arrows"></i></a>
           <a href="javascript:void(0)" data-bind="click: function(){ codeVisible(! codeVisible()) }"><i class="fa" data-bind="css: {'fa-compress' : codeVisible, 'fa-expand' : ! codeVisible() }"></i></a>
           <a href="javascript:void(0)" data-bind="click: function(){ codeVisible(! codeVisible()) }"><i class="fa" data-bind="css: {'fa-compress' : codeVisible, 'fa-expand' : ! codeVisible() }"></i></a>
-          <a href="javascript:void(0)" data-bind="click: function(){ settingsVisible(! settingsVisible()) }, visible: Object.keys(ko.mapping.toJS(properties)).length > 0, css: { 'blue' : settingsVisible }"><i class="fa fa-cog"></i></a>
+          <a href="javascript:void(0)" data-bind="click: function(){ settingsVisible(! settingsVisible()) }, visible: hasProperties, css: { 'blue' : settingsVisible }"><i class="fa fa-cog"></i></a>
           <a href="javascript:void(0)" data-bind="click: function(){ remove($parent, $data); window.setTimeout(redrawFixedHeaders, 100);}"><i class="fa fa-times"></i></a>
           <a href="javascript:void(0)" data-bind="click: function(){ remove($parent, $data); window.setTimeout(redrawFixedHeaders, 100);}"><i class="fa fa-times"></i></a>
         </div>
         </div>
       </h2>
       </h2>
@@ -432,13 +432,13 @@ from django.utils.translation import ugettext as _
     </div>
     </div>
     <div class="snippet-settings-body">
     <div class="snippet-settings-body">
       <form class="form-horizontal">
       <form class="form-horizontal">
-        <!-- ko template: { if: typeof properties.driverCores != 'undefined', name: 'property', data: { type: 'number', label: '${ _('Driver Cores') }', value: properties.driverCores, title: '${ _('Number of cores used by the driver, only in cluster mode (Default: 1)') }'}} --><!-- /ko -->
-        <!-- ko template: { if: typeof properties.executorCores != 'undefined', name: 'property', data: { type: 'number', label: '${ _('Executor Cores') }', value: properties.executorCores, title: '${ _('Number of cores per executor (Default: 1)') }' }} --><!-- /ko -->
-        <!-- ko template: { if: typeof properties.numExecutors != 'undefined', name: 'property', data: { type: 'number', label: '${ _('Executors') }', value: properties.numExecutors, title: '${ _('Number of executors to launch (Default: 2)') }' }} --><!-- /ko -->
-        <!-- ko template: { if: typeof properties.queue != 'undefined', name: 'property', data: { type: 'string', label: '${ _('Queue') }', value: properties.queue, title: '${ _('The YARN queue to submit to (Default: default)') }' }} --><!-- /ko -->
-        <!-- ko template: { if: typeof properties.archives != 'undefined', name: 'property', data: { type: 'csv-hdfs-files', label: '${ _('Archives') }', value: properties.archives, title: '${ _('The YARN queue to submit to (Default: default)') }', placeholder: '${ _('e.g. archive.dat') }'}} --><!-- /ko -->
-        <!-- ko template: { if: typeof properties.files != 'undefined', name: 'property', data: { type: 'csv-hdfs-files', label: '${ _('Files') }', value: properties.files, title: '${ _('The YARN queue to submit to (Default: default)') }', placeholder: '${ _('e.g. file.dat') }'}} --><!-- /ko -->
-        <!-- ko template: { if: typeof properties.settings != 'undefined', name: 'property', data: { type: 'csv', label: '${ _('Settings') }', value: properties.settings, title: '${ _('The YARN queue to submit to (Default: default)') }', placeholder: '${ _('e.g. foo') }'}} --><!-- /ko -->
+        <!-- ko template: { if: typeof properties().driverCores != 'undefined', name: 'property', data: { type: 'number', label: '${ _('Driver Cores') }', value: properties().driverCores, title: '${ _('Number of cores used by the driver, only in cluster mode (Default: 1)') }'}} --><!-- /ko -->
+        <!-- ko template: { if: typeof properties().executorCores != 'undefined', name: 'property', data: { type: 'number', label: '${ _('Executor Cores') }', value: properties().executorCores, title: '${ _('Number of cores per executor (Default: 1)') }' }} --><!-- /ko -->
+        <!-- ko template: { if: typeof properties().numExecutors != 'undefined', name: 'property', data: { type: 'number', label: '${ _('Executors') }', value: properties().numExecutors, title: '${ _('Number of executors to launch (Default: 2)') }' }} --><!-- /ko -->
+        <!-- ko template: { if: typeof properties().queue != 'undefined', name: 'property', data: { type: 'string', label: '${ _('Queue') }', value: properties().queue, title: '${ _('The YARN queue to submit to (Default: default)') }' }} --><!-- /ko -->
+        <!-- ko template: { if: typeof properties().archives != 'undefined', name: 'property', data: { type: 'csv-hdfs-files', label: '${ _('Archives') }', value: properties().archives, title: '${ _('The YARN queue to submit to (Default: default)') }', placeholder: '${ _('e.g. archive.dat') }'}} --><!-- /ko -->
+        <!-- ko template: { if: typeof properties().files != 'undefined', name: 'property', data: { type: 'csv-hdfs-files', label: '${ _('Files') }', value: properties().files, title: '${ _('The YARN queue to submit to (Default: default)') }', placeholder: '${ _('e.g. file.dat') }'}} --><!-- /ko -->
+        <!-- ko template: { if: typeof properties().settings != 'undefined', name: 'property', data: { type: 'csv', label: '${ _('Settings') }', value: properties().settings, title: '${ _('The YARN queue to submit to (Default: default)') }', placeholder: '${ _('e.g. foo') }'}} --><!-- /ko -->
       </form>
       </form>
     </div>
     </div>
     <a class="pointer demi-modal-chevron" data-bind="click: function() { settingsVisible(! settingsVisible()) }"><i class="fa fa-chevron-up"></i></a>
     <a class="pointer demi-modal-chevron" data-bind="click: function() { settingsVisible(! settingsVisible()) }"><i class="fa fa-chevron-up"></i></a>
@@ -618,13 +618,13 @@ from django.utils.translation import ugettext as _
       <div class="control-group">
       <div class="control-group">
         <label class="control-label">${_('Path')}</label>
         <label class="control-label">${_('Path')}</label>
         <div class="controls">
         <div class="controls">
-          <input type="text" class="input-xxlarge filechooser-input" data-bind="value: properties.app_jar, valueUpdate:'afterkeydown', filechooser: properties.app_jar" placeholder="${ _('Path to application jar, e.g. hdfs://localhost:8020/user/hue/oozie-examples.jar') }"/>
+          <input type="text" class="input-xxlarge filechooser-input" data-bind="value: properties().app_jar, valueUpdate:'afterkeydown', filechooser: properties().app_jar" placeholder="${ _('Path to application jar, e.g. hdfs://localhost:8020/user/hue/oozie-examples.jar') }"/>
         </div>
         </div>
       </div>
       </div>
       <div class="control-group">
       <div class="control-group">
         <label class="control-label">${_('Class')}</label>
         <label class="control-label">${_('Class')}</label>
         <div class="controls">
         <div class="controls">
-          <input type="text" class="input-xxlarge" data-bind="value: properties.class" placeholder="${ _('Class name of application, e.g. org.apache.oozie.example.SparkFileCopy') }"/>
+          <input type="text" class="input-xxlarge" data-bind="value: properties().class" placeholder="${ _('Class name of application, e.g. org.apache.oozie.example.SparkFileCopy') }"/>
         </div>
         </div>
       </div>
       </div>
       <!-- /ko -->
       <!-- /ko -->
@@ -632,11 +632,11 @@ from django.utils.translation import ugettext as _
       <div class="control-group">
       <div class="control-group">
         <label class="control-label">${_('Path')}</label>
         <label class="control-label">${_('Path')}</label>
         <div class="controls">
         <div class="controls">
-          <input type="text" class="input-xxlarge" data-bind="value: properties.py_file, valueUpdate:'afterkeydown', filechooser: properties.py_file" placeholder="${ _('Path to python file, e.g. script.py') }"/>
+          <input type="text" class="input-xxlarge" data-bind="value: properties().py_file, valueUpdate:'afterkeydown', filechooser: properties().py_file" placeholder="${ _('Path to python file, e.g. script.py') }"/>
         </div>
         </div>
       </div>
       </div>
       <!-- /ko -->
       <!-- /ko -->
-      <!-- ko template: { if: typeof properties.arguments != 'undefined', name: 'property', data: { type: 'csv', label: '${ _('Arguments') }', value: properties.arguments, title: '${ _('The YARN queue to submit to (Default: default)') }', placeholder: '${ _('e.g. -foo=bar') }', inline: false }} --><!-- /ko -->
+      <!-- ko template: { if: typeof properties().arguments != 'undefined', name: 'property', data: { type: 'csv', label: '${ _('Arguments') }', value: properties().arguments, title: '${ _('The YARN queue to submit to (Default: default)') }', placeholder: '${ _('e.g. -foo=bar') }', inline: false }} --><!-- /ko -->
     </form>
     </form>
   </div>
   </div>
 
 

+ 6 - 0
desktop/core/src/desktop/static/desktop/js/ko.hue-bindings.js

@@ -1591,6 +1591,12 @@ ko.bindingHandlers.aceEditor = {
 
 
     var editor = ace.edit($el.attr("id"));
     var editor = ace.edit($el.attr("id"));
     editor.session.setMode(options.mode());
     editor.session.setMode(options.mode());
+    if (ko.isObservable(options.mode)) {
+      options.mode.subscribe(function(newValue) {
+        editor.session.setMode(newValue);
+      });
+    }
+
     editor.setTheme($.totalStorage("hue.ace.theme") || "ace/theme/hue");
     editor.setTheme($.totalStorage("hue.ace.theme") || "ace/theme/hue");
 
 
     var editorOptions = {
     var editorOptions = {