瀏覽代碼

[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 年之前
父節點
當前提交
1eed885

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

@@ -38,11 +38,11 @@ LANGUAGES = Config(
   help=_t("List of available types of snippets."),
   help=_t("List of available types of snippets."),
   type=coerce_json,
   type=coerce_json,
   default="""[
   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": "Jar", "type": "jar"},
       {"name": "Python", "type": "py"},
       {"name": "Python", "type": "py"},
       {"name": "Text", "type": "text"}
       {"name": "Text", "type": "text"}

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

@@ -143,6 +143,7 @@ body {
   position: absolute;
   position: absolute;
   background-color: #61abd1;
   background-color: #61abd1;
   color: #DBE8F1;
   color: #DBE8F1;
+  font-size: 11px;
   line-height: 50px;
   line-height: 50px;
   height: 50px;
   height: 50px;
   width: 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>
     <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">
-      <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>
         <i class="add-last-used-snippet fa fa-plus-circle fa-5x" title="${ _('Add a new snippet') }"></i>
       </div>
       </div>
     </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 $element = $(element);
     var options = valueAccessor();
     var options = valueAccessor();
 
 
-    // This binding currently expects each alternative to have an observable
-    // named "type"
     var alternatives = options.alternatives;
     var alternatives = options.alternatives;
     var selected = options.selected; // Will be set before onSelect is called
     var selected = options.selected; // Will be set before onSelect is called
     var mainAlt = options.mainAlternative; // Alternative for clicking center
     var mainAlt = options.mainAlternative; // Alternative for clicking center
@@ -163,6 +161,11 @@ ko.bindingHandlers.radialMenu = {
     var alternativeCss = options.alternativeCss;
     var alternativeCss = options.alternativeCss;
     var alternativeSize = options.alternativeSize || 65;
     var alternativeSize = options.alternativeSize || 65;
 
 
+    var selectAttribute = options.selectAttribute;
+    var textRenderer = options.textRenderer || function(item) {
+        return item[selectAttribute]();
+      };
+
     var allAlternatives = $("<div>").hide();
     var allAlternatives = $("<div>").hide();
 
 
     var hideTimeout = -1;
     var hideTimeout = -1;
@@ -190,12 +193,12 @@ ko.bindingHandlers.radialMenu = {
 
 
         $.each(alternatives(), function (index, alternative) {
         $.each(alternatives(), function (index, alternative) {
           $("<div>")
           $("<div>")
-            .text(alternative.type())
+            .text(textRenderer(alternative))
             .addClass(alternativeCss)
             .addClass(alternativeCss)
             .css("left", radius * Math.cos(currentRad) + iconRadius)
             .css("left", radius * Math.cos(currentRad) + iconRadius)
             .css("top", radius * Math.sin(currentRad) + iconRadius)
             .css("top", radius * Math.sin(currentRad) + iconRadius)
             .on("click", function () {
             .on("click", function () {
-              select(alternative.type());
+              select(alternative[selectAttribute]());
             })
             })
             .on("mouseenter", function () {
             .on("mouseenter", function () {
               clearTimeout(hideTimeout);
               clearTimeout(hideTimeout);