menubar (#804)

* menubar 1

* zoom switching

* centering, pixel perfect canvas

* remove dead args and code

* clipping

* remove log

* if

* connect props

* lint

* undo

* logo left, componetize

* graph back to full height

* shadow to top

* do not prematurely call event handlers during render

* change test to deal with async histogram creation

* left section padding

* lint

* adjust graph to account for top bar,

* lasso tests

* refine histogram tests

* remove testing (onlys)

client/src/components/menubar/cellSetButtons.js

@@ -0,0 +1,61 @@
+// jshint esversion: 6
+import React from "react";
+import { AnchorButton, Tooltip } from "@blueprintjs/core";
+import { connect } from "react-redux";
+import { World } from "../../util/stateManager";
+
+@connect()
+class CellSetButton extends React.Component {
+  set() {
+    const {
+      differential,
+      crossfilter,
+      dispatch,
+      eitherCellSetOneOrTwo
+    } = this.props;
+
+    // Reducer and components assume that value will be null if
+    // no selection made.  World..getSelectedByIndex() returns a
+    // zero length TypedArray when nothing is selected.
+    let set = World.getSelectedByIndex(crossfilter);
+    if (set.length === 0) set = null;
+
+    if (!differential.diffExp) {
+      /* diffexp needs to be cleared before we store a new set */
+      dispatch({
+        type: `store current cell selection as differential set ${eitherCellSetOneOrTwo}`,
+        data: set
+      });
+    }
+  }
+
+  render() {
+    const { differential, eitherCellSetOneOrTwo } = this.props;
+    const cellListName = `celllist${eitherCellSetOneOrTwo}`;
+    const cellsSelected = differential[cellListName]
+      ? differential[cellListName].length
+      : 0;
+    return (
+      <Tooltip
+        content="Save current selection for differential expression computation"
+        position="top"
+      >
+        <AnchorButton
+          type="button"
+          disabled={differential.diffExp}
+          onClick={this.set.bind(this)}
+          data-testid={`cellset-button-${eitherCellSetOneOrTwo}`}
+        >
+          {eitherCellSetOneOrTwo}
+          {": "}
+          <span data-testid={`cellset-count-${eitherCellSetOneOrTwo}`}>
+            {cellsSelected}
+          </span>
+          {" cells"}
+        </AnchorButton>
+      </Tooltip>
+    );
+  }
+}
+
+export default CellSetButton;