Fix scatterplot.

client/galaxy/scripts/ui/pagination.js

@@ -1,13 +1,16 @@
-import jQuery from "jquery";
-("use_strict");
+//import $ from "jquery";
+// TODO:  This manipulates whatever jquery is available -- needs restructuring,
+// or removal (jquery plugins are a bad design choice for us at this point)
+// It is *only* used in the scatterplot viz, so this is safe.
+/* global $ */
 
-var $ = jQuery;
 /** Builds (twitter bootstrap styled) pagination controls.
  *  If the totalDataSize is not null, a horizontal list of page buttons is displayed.
  *  If totalDataSize is null, two links ('Prev' and 'Next) are displayed.
  *  When pages are changed, a 'pagination.page-change' event is fired
  *      sending the event and the (0-based) page requested.
  */
+
 function Pagination(element, options) {
     /** the total number of pages */
     this.numPages = null;
@@ -37,7 +40,7 @@ Pagination.prototype.defaults = {
 Pagination.prototype.init = function _init($element, options) {
     options = options || {};
     this.$element = $element;
-    this.options = jQuery.extend(true, {}, this.defaults, options);
+    this.options = $.extend(true, {}, this.defaults, options);
 
     this.currPage = this.options.startingPage;
     if (this.options.totalDataSize !== null) {
@@ -203,12 +206,12 @@ Pagination.create = function _create($element, options) {
 };
 
 // as jq plugin
-jQuery.fn.extend({
+$.fn.extend({
     pagination: function $pagination(options) {
-        var nonOptionsArgs = jQuery.makeArray(arguments).slice(1);
+        var nonOptionsArgs = $.makeArray(arguments).slice(1);
 
         // if passed an object - use that as an options map to create pagination for each selected
-        if (jQuery.type(options) === "object") {
+        if ($.type(options) === "object") {
             return this.map(function() {
                 Pagination.create($(this), options);
                 return this;
@@ -222,9 +225,9 @@ jQuery.fn.extend({
         // if a pagination control was found for this element, either...
         if (previousControl) {
             // invoke a function on the pagination object if passed a string (the function name)
-            if (jQuery.type(options) === "string") {
+            if ($.type(options) === "string") {
                 var fn = previousControl[options];
-                if (jQuery.type(fn) === "function") {
+                if ($.type(fn) === "function") {
                     return fn.apply(previousControl, nonOptionsArgs);
                 }
 

client/galaxy/scripts/ui/peek-column-selector.js

@@ -1,4 +1,9 @@
-import $ from "jquery";
+//import $ from "jquery";
+// TODO:  This manipulates whatever jquery is available -- needs restructuring,
+// or removal (jquery plugins are a bad design choice for us at this point)
+// It is *only* used in the scatterplot viz, so this is safe.
+/* global $ */
+
 //==============================================================================
 /** Column selection using the peek display as the control.
  *  Adds rows to the bottom of the peek with clickable areas in each cell

config/plugins/visualizations/scatterplot/src/jqglobals.js

@@ -0,0 +1,2 @@
+import $ from "jquery";
+window.jQuery = window.$ = window.jquery = $;

config/plugins/visualizations/scatterplot/src/scatterplot.js

@@ -1,14 +1,16 @@
-import $ from "jquery";
+import "./jqglobals";
+// This is a really annoying hack to get bootstrap/jqui jquery bindings available correctly.
+/* global $ */
 import * as Backbone from "backbone";
 import * as d3 from "d3";
 import * as _ from "underscore";
-import "jquery-ui-bundle";
-import "bootstrap";
 import "../../../../../client/galaxy/scripts/ui/peek-column-selector";
 import "../../../../../client/galaxy/scripts/ui/pagination";
+import "jquery-ui-bundle";
+import "bootstrap";
 import * as VisualizationModel from "../../../../../client/galaxy/scripts/mvc/visualization/visualization-model";
 
-window.$ = $;
+console.debug($);
 
 //TODO: Finish unlinking this from the Galaxy codebase (package it, use that way?)