#407 Properly turn on/off inspiration fragments when using the next/p…

…revious arrows (bug of #384)
m2ms · Oct 14, 2020 · 014b431 · 014b431
1 parent 9cc7ef7
commit 014b431
Show file tree

Hide file tree

Showing 6 changed files with 66 additions and 29 deletions.
diff --git a/js/components/datasets/datasetMoleculeList.js b/js/components/datasets/datasetMoleculeList.js
@@ -286,7 +286,7 @@ export const DatasetMoleculeList = memo(
     };
 
     const removeOfAllSelectedTypesOfInspirations = () => {
-      var molecules = [...getJoinedMoleculeList, ...inspirationMoleculeDataList];
+      var molecules = [...getJoinedMoleculeList, ...inspirationMoleculeDataList]; // TODO
       dispatch(hideAllSelectedMolecules(stage, molecules));
     };
 

diff --git a/js/components/datasets/datasetMoleculeView.js b/js/components/datasets/datasetMoleculeView.js
@@ -49,7 +49,8 @@ import { ArrowDownward, ArrowUpward, MyLocation } from '@material-ui/icons';
 import { isNumber, isString } from 'lodash';
 import { SvgTooltip } from '../common';
 import { loadInspirationMoleculesDataList } from './redux/dispatchActions';
-
+import { OBJECT_TYPE } from '../nglView/constants';
+import { getRepresentationsByType } from '../nglView/generatingObjects';
 
 const useStyles = makeStyles(theme => ({
   container: {
@@ -289,6 +290,7 @@ export const DatasetMoleculeView = memo(
     const vectorOnListMolecule = useSelector(state => state.selectionReducers.vectorOnList);
 
     const filteredDatasetMoleculeList = useSelector(state => getFilteredDatasetMoleculeList(state, datasetID));
+    const objectsInView = useSelector(state => state.nglReducers.objectsInView) || {};
 
     const [image, setImage] = useState(img_data_init);
 
@@ -541,19 +543,24 @@ export const DatasetMoleculeView = memo(
           molecules.forEach(molecule => {
             if (molecule) {
               if (isAnyInspirationLigandOn) {
-                dispatch(addLigand(stage, molecule, colourToggle));
+                let representations = getRepresentationsByType(objectsInView, molecule, OBJECT_TYPE.LIGAND);
+                dispatch(addLigand(stage, molecule, colourToggle, false, representations));
               }
               if (isAnyInspirationProteinOn) {
-                dispatch(addHitProtein(stage, molecule, colourToggle));
+                let representations = getRepresentationsByType(objectsInView, molecule, OBJECT_TYPE.HIT_PROTEIN);
+                dispatch(addHitProtein(stage, molecule, colourToggle, representations));
               }
               if (isAnyInspirationComplexOn) {
-                dispatch(addComplex(stage, molecule, colourToggle));
+                let representations = getRepresentationsByType(objectsInView, molecule, OBJECT_TYPE.COMPLEX);
+                dispatch(addComplex(stage, molecule, colourToggle, representations));
               }
               if (isAnyInspirationSurfaceOn) {
-                dispatch(addSurface(stage, molecule, colourToggle));
+                let representations = getRepresentationsByType(objectsInView, molecule, OBJECT_TYPE.SURFACE);
+                dispatch(addSurface(stage, molecule, colourToggle, representations));
               }
               if (isAnyInspirationDensityOn) {
-                dispatch(addDensity(stage, molecule, colourToggle));
+                let representations = getRepresentationsByType(objectsInView, molecule, OBJECT_TYPE.DENSITY);
+                dispatch(addDensity(stage, molecule, colourToggle, representations));
               }
               if (isAnyInspirationVectorOn) {
                 dispatch(addVector(stage, molecule, colourToggle));
@@ -567,16 +574,20 @@ export const DatasetMoleculeView = memo(
     const moveSelectedMoleculeSettings = (newItemData, datasetIdOfMolecule) => {
       if (newItemData) {
         if (isLigandOn) {
-          dispatch(addDatasetLigand(stage, newItemData, colourToggle, datasetIdOfMolecule));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.LIGAND, datasetID);
+          dispatch(addDatasetLigand(stage, newItemData, colourToggle, datasetIdOfMolecule, representations));
         }
         if (isProteinOn) {
-          dispatch(addDatasetHitProtein(stage, newItemData, colourToggle, datasetIdOfMolecule));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.PROTEIN, datasetID);
+          dispatch(addDatasetHitProtein(stage, newItemData, colourToggle, datasetIdOfMolecule, representations));
         }
         if (isComplexOn) {
-          dispatch(addDatasetComplex(stage, newItemData, colourToggle, datasetIdOfMolecule));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.COMPLEX, datasetID);
+          dispatch(addDatasetComplex(stage, newItemData, colourToggle, datasetIdOfMolecule, representations));
         }
         if (isSurfaceOn) {
-          dispatch(addDatasetSurface(stage, newItemData, colourToggle, datasetIdOfMolecule));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.SURFACE, datasetID);
+          dispatch(addDatasetSurface(stage, newItemData, colourToggle, datasetIdOfMolecule, representations));
         }
       }
     };
@@ -587,9 +598,9 @@ export const DatasetMoleculeView = memo(
 
       const nextItem = (nextItemData.hasOwnProperty('molecule') && nextItemData.molecule) || nextItemData;
       const nextDatasetID = (nextItemData.hasOwnProperty('datasetID') && nextItemData.datasetID) || datasetID;
-      moveSelectedMoleculeSettings(nextItem, nextDatasetID);
 
       dispatch(loadInspirationMoleculesDataList(nextItem.computed_inspirations)).then(() => {
+        moveSelectedMoleculeSettings(nextItem, nextDatasetID);
         dispatch(
           moveSelectedMoleculeInspirationsSettings(
             nextItem,
@@ -612,9 +623,9 @@ export const DatasetMoleculeView = memo(
         (previousItemData.hasOwnProperty('molecule') && previousItemData.molecule) || previousItemData;
       const previousDatasetID =
         (previousItemData.hasOwnProperty('datasetID') && previousItemData.datasetID) || datasetID;
-      moveSelectedMoleculeSettings(previousItem, previousDatasetID);
 
       dispatch(loadInspirationMoleculesDataList(previousItem.computed_inspirations)).then(() => {
+        moveSelectedMoleculeSettings(previousItem, previousDatasetID);
         dispatch(
           moveSelectedMoleculeInspirationsSettings(
             previousItem,

diff --git a/js/components/datasets/redux/dispatchActions.js b/js/components/datasets/redux/dispatchActions.js
@@ -50,14 +50,15 @@ export const initializeDatasetFilter = datasetID => (dispatch, getState) => {
   dispatch(setFilterProperties(datasetID, initFilterProperties));
 };
 
-export const addDatasetHitProtein = (stage, data, colourToggle, datasetID) => dispatch => {
+export const addDatasetHitProtein = (stage, data, colourToggle, datasetID, representations = undefined) => dispatch => {
   dispatch(
     loadObject({
       target: Object.assign(
         { display_div: VIEWS.MAJOR_VIEW },
         generateHitProteinObject(data, colourToggle, base_url, datasetID)
       ),
       stage,
+      previousRepresentations: representations,
       orientationMatrix: null
     })
   ).finally(() => {
@@ -80,14 +81,15 @@ export const removeDatasetHitProtein = (stage, data, colourToggle, datasetID) =>
   dispatch(removeFromProteinList(datasetID, generateMoleculeId(data)));
 };
 
-export const addDatasetComplex = (stage, data, colourToggle, datasetID) => dispatch => {
+export const addDatasetComplex = (stage, data, colourToggle, datasetID, representations = undefined) => dispatch => {
   dispatch(
     loadObject({
       target: Object.assign(
         { display_div: VIEWS.MAJOR_VIEW },
         generateComplexObject(data, colourToggle, base_url, datasetID)
       ),
       stage,
+      previousRepresentations: representations,
       orientationMatrix: null
     })
   ).finally(() => {
@@ -107,14 +109,15 @@ export const removeDatasetComplex = (stage, data, colourToggle, datasetID) => di
   dispatch(removeFromComplexList(datasetID, generateMoleculeId(data)));
 };
 
-export const addDatasetSurface = (stage, data, colourToggle, datasetID) => dispatch => {
+export const addDatasetSurface = (stage, data, colourToggle, datasetID, representations = undefined) => dispatch => {
   dispatch(
     loadObject({
       target: Object.assign(
         { display_div: VIEWS.MAJOR_VIEW },
         generateSurfaceObject(data, colourToggle, base_url, datasetID)
       ),
       stage,
+      previousRepresentations: representations,
       orientationMatrix: null
     })
   ).finally(() => {
@@ -134,12 +137,13 @@ export const removeDatasetSurface = (stage, data, colourToggle, datasetID) => di
   dispatch(removeFromSurfaceList(datasetID, generateMoleculeId(data)));
 };
 
-export const addDatasetLigand = (stage, data, colourToggle, datasetID) => dispatch => {
+export const addDatasetLigand = (stage, data, colourToggle, datasetID, representations = undefined) => dispatch => {
   const currentOrientation = stage.viewerControls.getOrientation();
   dispatch(
     loadObject({
       target: Object.assign({ display_div: VIEWS.MAJOR_VIEW }, generateMoleculeObject(data, colourToggle, datasetID)),
       stage,
+      previousRepresentations: representations,
       markAsRightSideLigand: true
     })
   ).finally(() => {

diff --git a/js/components/nglView/generatingObjects.js b/js/components/nglView/generatingObjects.js
@@ -212,3 +212,10 @@ export const getVectorWithColorByCountOfCompounds = (item, currentVectorCompound
   }
   return { ...item, colour: colour, radius: 0.3 };
 };
+
+export const getRepresentationsByType = (objectsInView, object, objectType, datasetId) => {
+  let parentItem = `${object.protein_code || object.name}_${objectType}${datasetId ? '_' + datasetId : ''}`;
+  let objectInView = objectsInView[parentItem];
+  var representations = (objectInView && objectInView.representations) || undefined;
+  return representations;
+};
diff --git a/js/components/preview/molecule/moleculeView.js b/js/components/preview/molecule/moleculeView.js
@@ -31,7 +31,8 @@ import { base_url } from '../../routes/constants';
 import { moleculeProperty } from './helperConstants';
 import { centerOnLigandByMoleculeID } from '../../../reducers/ngl/dispatchActions';
 import { SvgTooltip } from '../../common';
-
+import { OBJECT_TYPE } from '../../nglView/constants';
+import { getRepresentationsByType } from '../../nglView/generatingObjects';
 
 const useStyles = makeStyles(theme => ({
   container: {
@@ -227,6 +228,8 @@ const MoleculeView = memo(
     const url = new URL(base_url + '/api/molimg/' + data.id + '/');
     const [img_data, setImg_data] = useState(img_data_init);
 
+    const objectsInView = useSelector(state => state.nglReducers.objectsInView) || {};
+
     const { getNglView } = useContext(NglContext);
     const stage = getNglView(VIEWS.MAJOR_VIEW) && getNglView(VIEWS.MAJOR_VIEW).stage;
 
@@ -498,19 +501,24 @@ const MoleculeView = memo(
     const moveSelectedMolSettings = newItemDataset => {
       if (newItemDataset) {
         if (isLigandOn) {
-          dispatch(addLigand(stage, newItemDataset, colourToggle));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.LIGAND);
+          dispatch(addLigand(stage, newItemDataset, colourToggle, false, representations));
         }
         if (isProteinOn) {
-          dispatch(addHitProtein(stage, newItemDataset, colourToggle));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.HIT_PROTEIN);
+          dispatch(addHitProtein(stage, newItemDataset, colourToggle, representations));
         }
         if (isComplexOn) {
-          dispatch(addComplex(stage, newItemDataset, colourToggle));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.COMPLEX);
+          dispatch(addComplex(stage, newItemDataset, colourToggle, representations));
         }
         if (isSurfaceOn) {
-          dispatch(addSurface(stage, newItemDataset, colourToggle));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.SURFACE);
+          dispatch(addSurface(stage, newItemDataset, colourToggle, representations));
         }
         if (isDensityOn) {
-          dispatch(addDensity(stage, newItemDataset, colourToggle));
+          let representations = getRepresentationsByType(objectsInView, data, OBJECT_TYPE.DENSITY);
+          dispatch(addDensity(stage, newItemDataset, colourToggle, representations));
         }
         if (isVectorOn) {
           dispatch(addVector(stage, newItemDataset)).catch(error => {

diff --git a/js/components/preview/molecule/redux/dispatchActions.js b/js/components/preview/molecule/redux/dispatchActions.js
@@ -176,11 +176,12 @@ export const removeVector = (stage, data) => async (dispatch, getState) => {
   dispatch(setVectorList(vector_list.filter(item => item.moleculeId !== data.id)));
 };
 
-export const addHitProtein = (stage, data, colourToggle) => dispatch => {
+export const addHitProtein = (stage, data, colourToggle, representations = undefined) => dispatch => {
   dispatch(
     loadObject({
       target: Object.assign({ display_div: VIEWS.MAJOR_VIEW }, generateHitProteinObject(data, colourToggle, base_url)),
       stage,
+      previousRepresentations: representations,
       orientationMatrix: null
     })
   ).finally(() => {
@@ -200,11 +201,12 @@ export const removeHitProtein = (stage, data, colourToggle) => dispatch => {
   dispatch(removeFromProteinList(generateMoleculeId(data)));
 };
 
-export const addComplex = (stage, data, colourToggle) => dispatch => {
+export const addComplex = (stage, data, colourToggle, representations = undefined) => dispatch => {
   dispatch(
     loadObject({
       target: Object.assign({ display_div: VIEWS.MAJOR_VIEW }, generateComplexObject(data, colourToggle, base_url)),
       stage,
+      previousRepresentations: representations,
       orientationMatrix: null
     })
   ).finally(() => {
@@ -224,11 +226,12 @@ export const removeComplex = (stage, data, colourToggle) => dispatch => {
   dispatch(removeFromComplexList(generateMoleculeId(data)));
 };
 
-export const addSurface = (stage, data, colourToggle) => dispatch => {
+export const addSurface = (stage, data, colourToggle, representations = undefined) => dispatch => {
   dispatch(
     loadObject({
       target: Object.assign({ display_div: VIEWS.MAJOR_VIEW }, generateSurfaceObject(data, colourToggle, base_url)),
       stage,
+      previousRepresentations: representations,
       orientationMatrix: null
     })
   ).finally(() => {
@@ -248,13 +251,14 @@ export const removeSurface = (stage, data, colourToggle) => dispatch => {
   dispatch(removeFromSurfaceList(generateMoleculeId(data)));
 };
 
-export const addDensity = (stage, data, colourToggle) => dispatch => {
+export const addDensity = (stage, data, colourToggle, representations = undefined) => dispatch => {
   console.log('TODO');
   return;
   dispatch(
     loadObject({
       target: Object.assign({ display_div: VIEWS.MAJOR_VIEW }, generateDensityObject(data, colourToggle, base_url)),
       stage,
+      previousRepresentations: representations,
       orientationMatrix: null
     })
   ).finally(() => {
@@ -276,14 +280,17 @@ export const removeDensity = (stage, data, colourToggle) => dispatch => {
   dispatch(removeFromDensityList(generateMoleculeId(data)));
 };
 
-export const addLigand = (stage, data, colourToggle, centerOn = false) => (dispatch, getState) => {
+export const addLigand = (stage, data, colourToggle, centerOn = false, representations = undefined) => (
+  dispatch,
+  getState
+) => {
   const currentOrientation = stage.viewerControls.getOrientation();
   dispatch(appendFragmentDisplayList(generateMoleculeId(data)));
   return dispatch(
     loadObject({
       target: Object.assign({ display_div: VIEWS.MAJOR_VIEW }, generateMoleculeObject(data, colourToggle)),
       stage,
-      undefined
+      previousRepresentations: representations
     })
   ).finally(() => {
     const ligandOrientation = stage.viewerControls.getOrientation();