From 99c8f37a609c5cc9e3255ea949eae81265ee8462 Mon Sep 17 00:00:00 2001 From: Colin Megill Date: Tue, 7 Dec 2021 15:53:56 -0800 Subject: [PATCH 1/3] button, reducer state --- client/src/components/menubar/index.js | 22 ++++++++++++++++++++++ client/src/reducers/imageUnderlay.js | 14 ++++++++++++++ client/src/reducers/index.js | 2 ++ 3 files changed, 38 insertions(+) create mode 100644 client/src/reducers/imageUnderlay.js diff --git a/client/src/components/menubar/index.js b/client/src/components/menubar/index.js index 03b41659..185f75ad 100644 --- a/client/src/components/menubar/index.js +++ b/client/src/components/menubar/index.js @@ -28,6 +28,7 @@ import { getEmbSubsetView } from "../../util/stateManager/viewStackHelpers"; subsetPossible, subsetResetPossible, graphInteractionMode: state.controls.graphInteractionMode, + imageUnderlay: state.imageUnderlay, clipPercentileMin: Math.round(100 * (annoMatrix?.clipRange?.[0] ?? 0)), clipPercentileMax: Math.round(100 * (annoMatrix?.clipRange?.[1] ?? 1)), userDefinedGenes: state.controls.userDefinedGenes, @@ -206,6 +207,7 @@ class MenuBar extends React.PureComponent { colorAccessor, subsetPossible, subsetResetPossible, + imageUnderlay, } = this.props; const { pendingClipPercentiles } = this.state; @@ -268,6 +270,26 @@ class MenuBar extends React.PureComponent { disabled={!isColoredByCategorical} /> + + + { + dispatch({ + type: "toggle image underlay", + }); + }} + /> + + + { + switch (action.type) { + case "toggle image underlay": + return { + ...state, + isActive: !state.isActive, + }; + + default: + return state; + } +}; + +export default imageUnderlay; diff --git a/client/src/reducers/index.js b/client/src/reducers/index.js index 29ace171..9f03fd91 100644 --- a/client/src/reducers/index.js +++ b/client/src/reducers/index.js @@ -19,6 +19,7 @@ import genesetsUI from "./genesetsUI"; import autosave from "./autosave"; import centroidLabels from "./centroidLabels"; import pointDialation from "./pointDilation"; +import imageUnderlay from "./imageUnderlay"; import { gcMiddleware as annoMatrixGC } from "../annoMatrix"; import undoableConfig from "./undoableConfig"; @@ -39,6 +40,7 @@ const Reducer = undoable( ["controls", controls], ["differential", differential], ["centroidLabels", centroidLabels], + ["imageUnderlay", imageUnderlay], ["pointDilation", pointDialation], ["autosave", autosave], ]), From caa1526eb6c2fefbb3243f86ae568e11dea8fb57 Mon Sep 17 00:00:00 2001 From: Colin Megill Date: Tue, 7 Dec 2021 15:59:05 -0800 Subject: [PATCH 2/3] intent --- client/src/components/menubar/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/client/src/components/menubar/index.js b/client/src/components/menubar/index.js index 185f75ad..02fcad09 100644 --- a/client/src/components/menubar/index.js +++ b/client/src/components/menubar/index.js @@ -280,6 +280,7 @@ class MenuBar extends React.PureComponent { type="button" data-testid="toggle-image-underlay" icon={"media"} + intent={imageUnderlay.isActive ? "primary" : "none"} active={imageUnderlay.isActive} onClick={() => { dispatch({ From b411fca5a37f345d16356569381cb2d3f3553dd9 Mon Sep 17 00:00:00 2001 From: Colin Megill Date: Tue, 7 Dec 2021 16:32:55 -0800 Subject: [PATCH 3/3] auto switch spatial off --- client/src/components/embedding/index.js | 21 ++++++++--- client/src/components/menubar/index.js | 44 +++++++++++++----------- client/src/globals.js | 3 ++ 3 files changed, 43 insertions(+), 25 deletions(-) diff --git a/client/src/components/embedding/index.js b/client/src/components/embedding/index.js index a36d3256..7522017a 100644 --- a/client/src/components/embedding/index.js +++ b/client/src/components/embedding/index.js @@ -16,10 +16,11 @@ import actions from "../../actions"; import { getDiscreteCellEmbeddingRowIndex } from "../../util/stateManager/viewStackHelpers"; @connect((state) => ({ - layoutChoice: state.layoutChoice, // TODO: really should clean up naming, s/layout/embedding/g - schema: state.annoMatrix?.schema, - crossfilter: state.obsCrossfilter, - })) + imageUnderlay: state.imageUnderlay, + layoutChoice: state.layoutChoice, // TODO: really should clean up naming, s/layout/embedding/g + schema: state.annoMatrix?.schema, + crossfilter: state.obsCrossfilter, +})) class Embedding extends React.PureComponent { constructor(props) { super(props); @@ -27,8 +28,18 @@ class Embedding extends React.PureComponent { } handleLayoutChoiceChange = (e) => { - const { dispatch } = this.props; + const { dispatch, imageUnderlay } = this.props; dispatch(actions.layoutChoiceAction(e.currentTarget.value)); + + // if we just switched off spatial, if the image is on, turn it off + if ( + imageUnderlay.isActive && + e.target.value !== globals.spatialEmbeddingKeyword + ) { + dispatch({ + type: "toggle image underlay", + }); + } }; render() { diff --git a/client/src/components/menubar/index.js b/client/src/components/menubar/index.js index 02fcad09..37ac57c5 100644 --- a/client/src/components/menubar/index.js +++ b/client/src/components/menubar/index.js @@ -29,6 +29,7 @@ import { getEmbSubsetView } from "../../util/stateManager/viewStackHelpers"; subsetResetPossible, graphInteractionMode: state.controls.graphInteractionMode, imageUnderlay: state.imageUnderlay, + layoutChoice: state.layoutChoice, // TODO: really should clean up naming, s/layout/embedding/g clipPercentileMin: Math.round(100 * (annoMatrix?.clipRange?.[0] ?? 0)), clipPercentileMax: Math.round(100 * (annoMatrix?.clipRange?.[1] ?? 1)), userDefinedGenes: state.controls.userDefinedGenes, @@ -208,6 +209,7 @@ class MenuBar extends React.PureComponent { subsetPossible, subsetResetPossible, imageUnderlay, + layoutChoice, } = this.props; const { pendingClipPercentiles } = this.state; @@ -270,26 +272,28 @@ class MenuBar extends React.PureComponent { disabled={!isColoredByCategorical} /> - - - { - dispatch({ - type: "toggle image underlay", - }); - }} - /> - - + {layoutChoice?.available?.includes(globals.spatialEmbeddingKeyword) && ( + + + { + dispatch({ + type: "toggle image underlay", + }); + }} + /> + + + )}