Client format and build from several upstream changes

client/galaxy/scripts/mvc/tool/tools.js

@@ -686,7 +686,10 @@ var ToolPanelView = Backbone.View.extend({
         search_view.render();
         // FIXME: This is a little ugly because it navigates through the parent
         //        element, but good enough until this is all `.vue`
-        self.$el.closest(".unified-panel").find(".unified-panel-controls").append(search_view.$el);
+        self.$el
+            .closest(".unified-panel")
+            .find(".unified-panel-controls")
+            .append(search_view.$el);
 
         // Render panel.
         this.model.get("layout").each(panel_elt => {
@@ -804,7 +807,8 @@ var templates = {
                 placeholder="<%- search_hint_string %>" autocomplete="off" type="text" />
          <a id="search-clear-btn" title="clear search (esc)"> </a>
          <span id="search-spinner" class="search-spinner fa fa-spinner fa-spin"></span>
-    `),
+    `
+    ),
 
     // the category level container in the tool panel (e.g. 'Get Data', 'Text Manipulation')
     panel_section: _.template(

client/galaxy/scripts/mvc/workflow/workflow-canvas.js

@@ -85,8 +85,7 @@ class ScrollPanel {
 }
 
 // Zoom levels to use for zooming the workflow canvas
-const zoomLevels = [ .25, .33, .5, .67, .75, .8, .9,
-                     1, 1.1, 1.25, 1.5, 1.75, 2, 2.5, 3, 4 ];
+const zoomLevels = [0.25, 0.33, 0.5, 0.67, 0.75, 0.8, 0.9, 1, 1.1, 1.25, 1.5, 1.75, 2, 2.5, 3, 4];
 
 // Default zoome level (1)
 const defaultZoomLevel = 7;
@@ -108,29 +107,31 @@ class CanvasManager {
         // Initialize Copy & Paste events
         this.init_copy_paste();
     }
-    setZoom( zoomLevel ) {
+    setZoom(zoomLevel) {
         this.zoomLevel = Math.min(Math.max(0, zoomLevel), zoomLevels.length);
         this.canvasZoom = zoomLevels[this.zoomLevel];
         // Set CSS transform to appropriate zoom level
-        this.cv.css('transform-origin', 'top left');
-        this.cv.css('transform', 'scale(' + this.canvasZoom + ')');
+        this.cv.css("transform-origin", "top left");
+        this.cv.css("transform", "scale(" + this.canvasZoom + ")");
         // Modify canvas size to account for scale
-        this.cv.css('width', `${100 / this.canvasZoom}%` );
-        this.cv.css('height', `${100 / this.canvasZoom}%` );
+        this.cv.css("width", `${100 / this.canvasZoom}%`);
+        this.cv.css("height", `${100 / this.canvasZoom}%`);
         // Update canvas size
-        this.app.workflow.fit_canvas_to_nodes()
+        this.app.workflow.fit_canvas_to_nodes();
     }
     initZoomControls() {
         var zoomControl = $('<div class="btn-group-vertical"/>').css({
-            position: 'absolute',
-            left: '1rem',
-            bottom: '1rem'
+            position: "absolute",
+            left: "1rem",
+            bottom: "1rem"
         });
-        zoomControl.append( $('<div class="btn btn-secondary fa fa-plus"/>').click(
-            () => this.setZoom( this.zoomLevel + 1 ) ) )
-        zoomControl.append( $('<div class="btn btn-secondary fa fa-minus"/>').click(
-            () => this.setZoom( this.zoomLevel - 1 ) ) )
-        this.cv.closest('#workflow-canvas-body').append( zoomControl );
+        zoomControl.append(
+            $('<div class="btn btn-secondary fa fa-plus"/>').click(() => this.setZoom(this.zoomLevel + 1))
+        );
+        zoomControl.append(
+            $('<div class="btn btn-secondary fa fa-minus"/>').click(() => this.setZoom(this.zoomLevel - 1))
+        );
+        this.cv.closest("#workflow-canvas-body").append(zoomControl);
     }
 
     init_drag() {
@@ -167,8 +168,7 @@ class CanvasManager {
                 x_adjust = p.left - o.left;
             })
             .bind("drag", (e, d) => {
-                move((d.offsetX + x_adjust ) / this.canvasZoom,
-                     (d.offsetY + y_adjust) / this.canvasZoom);
+                move((d.offsetX + x_adjust) / this.canvasZoom, (d.offsetY + y_adjust) / this.canvasZoom);
             })
             .bind("dragend", () => {
                 self.app.workflow.fit_canvas_to_nodes();

client/galaxy/scripts/mvc/workflow/workflow-connector.js

@@ -59,8 +59,8 @@ $.extend(Connector.prototype, {
             "handle2-id",
             handle2 && handle2.element.getAttribute ? handle2.element.getAttribute("id") : ""
         );
-        var relativeLeft = e => ($(e).offset().left - canvas_container.offset().left)/canvasZoom;
-        var relativeTop = e => ($(e).offset().top - canvas_container.offset().top)/canvasZoom;
+        var relativeLeft = e => ($(e).offset().left - canvas_container.offset().left) / canvasZoom;
+        var relativeTop = e => ($(e).offset().top - canvas_container.offset().top) / canvasZoom;
         if (!handle1 || !handle2) {
             return;
         }

client/galaxy/scripts/mvc/workflow/workflow-manager.js

@@ -466,8 +466,8 @@ class Workflow {
         // Move elements back if needed
         this.canvas_container.children().each(function() {
             var p = $(this).position();
-            $(this).css("left", ( p.left + xmin_delta ) / canvasZoom );
-            $(this).css("top", ( p.top + ymin_delta) / canvasZoom );
+            $(this).css("left", (p.left + xmin_delta) / canvasZoom);
+            $(this).css("top", (p.top + ymin_delta) / canvasZoom);
         });
     }
 }

client/galaxy/scripts/mvc/workflow/workflow-view-terminals.js

@@ -202,7 +202,7 @@ var BaseOutputTerminalView = TerminalView.extend({
 
             var x = d.offsetX - po.left;
             var y = d.offsetY - po.top;
-            $(d.proxy).css({ left: x/canvasZoom, top: y/canvasZoom });
+            $(d.proxy).css({ left: x / canvasZoom, top: y / canvasZoom });
             d.proxy.terminal.redraw();
             // FIXME: global
             window.workflow_globals.canvas_manager.update_viewport_overlay();

client/galaxy/style/scss/base.scss

@@ -195,7 +195,9 @@ body {
     border-left: solid $layout-border-color 1px;
 }
 
-#left, #right, .unified-panel {
+#left,
+#right,
+.unified-panel {
     background: $panel-bg-color;
     display: flex;
     flex-direction: column;