Jelajahi Sumber

[spark] Adjust the length of the snippet names for the radial menu

This adjusts the lengths of the snippet names so that they fit in the radial menu alternatives. This also makes the radialMenu binding completely generic by introducing the textRenderer and selectAttribute parameters.
Johan Ahlen 10 tahun lalu
induk
melakukan
1eed885

+ 5 - 5
apps/spark/src/spark/conf.py

@@ -38,11 +38,11 @@ LANGUAGES = Config(
   help=_t("List of available types of snippets."),
   type=coerce_json,
   default="""[
-      {"name": "Scala Shell", "type": "scala"},
-      {"name": "PySpark Shell", "type": "python"},
-      {"name": "R Shell", "type": "r"},
-      {"name": "Impala SQL", "type": "impala"},
-      {"name": "Hive SQL", "type": "hive"},
+      {"name": "Scala", "type": "scala"},
+      {"name": "PySpark", "type": "python"},
+      {"name": "R", "type": "r"},
+      {"name": "Impala", "type": "impala"},
+      {"name": "Hive", "type": "hive"},
       {"name": "Jar", "type": "jar"},
       {"name": "Python", "type": "py"},
       {"name": "Text", "type": "text"}

+ 1 - 0
apps/spark/src/spark/static/spark/css/spark.css

@@ -143,6 +143,7 @@ body {
   position: absolute;
   background-color: #61abd1;
   color: #DBE8F1;
+  font-size: 11px;
   line-height: 50px;
   height: 50px;
   width: 50px;

+ 1 - 1
apps/spark/src/spark/templates/notebook.mako

@@ -38,7 +38,7 @@ ${ editorComponents.includes() }
     <h1 class="empty" data-bind="visible: snippets().length == 0">${ _('Add a snippet to start your new notebook') }</h1>
 
     <div class="add-snippet">
-      <div class="add-snippet-button pointer" style="position:relative; width:65px; text-align: center;" data-bind="radialMenu: { alternatives: $root.availableSnippets, selected: selectedSnippet, mainAlternative: selectedSnippet, onSelect: newSnippet, alternativeCss: 'add-snippet-alt' }">
+      <div class="add-snippet-button pointer" style="position:relative; width:65px; text-align: center;" data-bind="radialMenu: { alternatives: $root.availableSnippets, selectAttribute: 'type', textRenderer: function(attribute) { return attribute.name() }, selected: selectedSnippet, mainAlternative: selectedSnippet, onSelect: newSnippet, alternativeCss: 'add-snippet-alt' }">
         <i class="add-last-used-snippet fa fa-plus-circle fa-5x" title="${ _('Add a new snippet') }"></i>
       </div>
     </div>

+ 7 - 4
desktop/core/src/desktop/static/desktop/js/ko.hue-bindings.js

@@ -153,8 +153,6 @@ ko.bindingHandlers.radialMenu = {
     var $element = $(element);
     var options = valueAccessor();
 
-    // This binding currently expects each alternative to have an observable
-    // named "type"
     var alternatives = options.alternatives;
     var selected = options.selected; // Will be set before onSelect is called
     var mainAlt = options.mainAlternative; // Alternative for clicking center
@@ -163,6 +161,11 @@ ko.bindingHandlers.radialMenu = {
     var alternativeCss = options.alternativeCss;
     var alternativeSize = options.alternativeSize || 65;
 
+    var selectAttribute = options.selectAttribute;
+    var textRenderer = options.textRenderer || function(item) {
+        return item[selectAttribute]();
+      };
+
     var allAlternatives = $("<div>").hide();
 
     var hideTimeout = -1;
@@ -190,12 +193,12 @@ ko.bindingHandlers.radialMenu = {
 
         $.each(alternatives(), function (index, alternative) {
           $("<div>")
-            .text(alternative.type())
+            .text(textRenderer(alternative))
             .addClass(alternativeCss)
             .css("left", radius * Math.cos(currentRad) + iconRadius)
             .css("top", radius * Math.sin(currentRad) + iconRadius)
             .on("click", function () {
-              select(alternative.type());
+              select(alternative[selectAttribute]());
             })
             .on("mouseenter", function () {
               clearTimeout(hideTimeout);