Skip to content

Commit c71a200

Browse files
author
Adriána Kohanová
committed
#503 Display controls action capture bugs
1 parent 9109471 commit c71a200

File tree

6 files changed

+206
-16
lines changed

6 files changed

+206
-16
lines changed

‎js/components/preview/viewerControls/displayControls/index.js

+9-2
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@ import {
1010
addComponentRepresentation,
1111
removeComponentRepresentation,
1212
updateComponentRepresentation,
13+
updateComponentRepresentationVisibility,
14+
updateComponentRepresentationVisibilityAll,
1315
changeComponentRepresentation
1416
} from '../../../../reducers/ngl/actions';
1517
import { deleteObject } from '../../../../reducers/ngl/dispatchActions';
@@ -52,7 +54,10 @@ export default memo(({ open, onClose }) => {
5254
const newVisibility = !r.getVisibility();
5355
// update in redux
5456
representation.params.visible = newVisibility;
55-
dispatch(updateComponentRepresentation(parentKey, representation.uuid, representation));
57+
dispatch(updateComponentRepresentation(parentKey, representation.uuid, representation, '', true));
58+
dispatch(
59+
updateComponentRepresentationVisibility(parentKey, representation.uuid, representation, newVisibility)
60+
);
5661
// update in nglView
5762
r.setVisibility(newVisibility);
5863
}
@@ -144,10 +149,12 @@ export default memo(({ open, onClose }) => {
144149
// update in nglView
145150
r.setVisibility(newVisibility);
146151
// update in redux
147-
dispatch(updateComponentRepresentation(parentKey, representation.uuid, representation));
152+
dispatch(updateComponentRepresentation(parentKey, representation.uuid, representation, '', true));
148153
}
149154
});
150155
});
156+
157+
dispatch(updateComponentRepresentationVisibilityAll(parentKey, newVisibility));
151158
};
152159

153160
const hasAllRepresentationVisibled = parentKey => {

‎js/reducers/ngl/actions.js

+32-3
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,41 @@ export const deleteNglObject = target => ({
1010
target
1111
});
1212

13-
export const updateComponentRepresentation = (objectInViewID, representationID, newRepresentation, change) => ({
13+
export const updateComponentRepresentationVisibility = (
14+
objectInViewID,
15+
representationID,
16+
representation,
17+
newVisibility,
18+
skipTracking = false
19+
) => ({
20+
type: CONSTANTS.UPDATE_COMPONENT_REPRESENTATION_VISIBILITY,
21+
representationID,
22+
representation,
23+
newVisibility,
24+
objectInViewID,
25+
skipTracking
26+
});
27+
28+
export const updateComponentRepresentationVisibilityAll = (objectInViewID, newVisibility, skipTracking = false) => ({
29+
type: CONSTANTS.UPDATE_COMPONENT_REPRESENTATION_VISIBILITY_ALL,
30+
newVisibility,
31+
objectInViewID,
32+
skipTracking
33+
});
34+
35+
export const updateComponentRepresentation = (
36+
objectInViewID,
37+
representationID,
38+
newRepresentation,
39+
change,
40+
skipTracking = false
41+
) => ({
1442
type: CONSTANTS.UPDATE_COMPONENT_REPRESENTATION,
1543
representationID,
1644
newRepresentation,
1745
objectInViewID,
18-
change
46+
change,
47+
skipTracking
1948
});
2049

2150
export const addComponentRepresentation = (objectInViewID, newRepresentation, skipTracking = false) => ({
@@ -51,7 +80,7 @@ export const setNglViewParams = (key, value, stage = undefined, objectId = undef
5180
};
5281
};
5382

54-
export const setBackgroundColor = (color) => {
83+
export const setBackgroundColor = color => {
5584
return {
5685
type: CONSTANTS.SET_BACKGROUND_COLOR,
5786
payload: color

‎js/reducers/ngl/constants.js

+2
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ export const CONSTANTS = {
44
LOAD_OBJECT: prefix + 'LOAD_OBJECT',
55
DELETE_OBJECT: prefix + 'DELETE_OBJECT',
66
// NGL Component Representation
7+
UPDATE_COMPONENT_REPRESENTATION_VISIBILITY: prefix + 'UPDATE_COMPONENT_REPRESENTATION_VISIBILITY',
8+
UPDATE_COMPONENT_REPRESENTATION_VISIBILITY_ALL: prefix + 'UPDATE_COMPONENT_REPRESENTATION_VISIBILITY_ALL',
79
UPDATE_COMPONENT_REPRESENTATION: prefix + 'UPDATE_COMPONENT_REPRESENTATION',
810
REMOVE_COMPONENT_REPRESENTATION: prefix + 'REMOVE_COMPONENT_REPRESENTATION',
911
ADD_COMPONENT_REPRESENTATION: prefix + 'ADD_COMPONENT_REPRESENTATION',

‎js/reducers/tracking/constants.js

+5-2
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,8 @@ export const actionType = {
4949
COMPOUND_SELECTED: 'COMPOUND_SELECTED',
5050
COMPOUND_DESELECTED: 'COMPOUND_DESELECTED',
5151
REPRESENTATION_UPDATED: 'REPRESENTATION_UPDATED',
52+
REPRESENTATION_VISIBILITY_UPDATED: 'REPRESENTATION_VISIBILITY_UPDATED',
53+
REPRESENTATION_VISIBILITY_ALL_UPDATED: 'REPRESENTATION_VISIBILITY_ALL_UPDATED',
5254
REPRESENTATION_ADDED: 'REPRESENTATION_ADDED',
5355
REPRESENTATION_REMOVED: 'REPRESENTATION_REMOVED',
5456
REPRESENTATION_CHANGED: 'REPRESENTATION_CHANGED',
@@ -76,11 +78,13 @@ export const actionDescription = {
7678
SELECTED: 'was selected',
7779
DESELECTED: 'was deselected',
7880
HIDDEN: 'hidden',
81+
VISIBLE: 'visible',
7982
CANCELED: 'canceled',
8083
ADDED: 'was added',
8184
REMOVED: 'was removed',
8285
CHANGED: 'was changed',
8386
UPDATED: 'was updated',
87+
VISIBILITY: 'visiblity',
8488
TO_SHOPPING_CART: 'to shopping cart',
8589
FROM_SHOPPING_CART: 'from shopping cart',
8690
LIGAND: 'Ligand',
@@ -94,8 +98,7 @@ export const actionDescription = {
9498
TARGET: 'Target',
9599
ALL: 'All',
96100
LIGANDS: 'Ligands',
97-
SIDECHAINS: 'Sidechains',
98-
INTERACTIONS: 'Interactions'
101+
SIDECHAINS: 'Sidechains'
99102
};
100103

101104
export const actionObjectType = {

‎js/reducers/tracking/dispatchActions.js

+64
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,8 @@ import {
6363
removeComponentRepresentation,
6464
addComponentRepresentation,
6565
updateComponentRepresentation,
66+
updateComponentRepresentationVisibility,
67+
updateComponentRepresentationVisibilityAll,
6668
changeComponentRepresentation
6769
} from '../../../js/reducers/ngl/actions';
6870
import * as listType from '../../constants/listTypes';
@@ -1318,6 +1320,12 @@ const handleUndoAction = (action, stages) => (dispatch, getState) => {
13181320
case actionType.COMPOUND_DESELECTED:
13191321
dispatch(handleCompoundAction(action, true));
13201322
break;
1323+
case actionType.REPRESENTATION_VISIBILITY_UPDATED:
1324+
dispatch(handleUpdateRepresentationVisibilityAction(action, false, majorView));
1325+
break;
1326+
case actionType.REPRESENTATION_VISIBILITY_ALL_UPDATED:
1327+
dispatch(handleUpdateRepresentationVisibilityAllAction(action, false, majorView));
1328+
break;
13211329
case actionType.REPRESENTATION_UPDATED:
13221330
dispatch(handleUpdateRepresentationAction(action, false, majorView));
13231331
break;
@@ -1455,6 +1463,12 @@ const handleRedoAction = (action, stages) => (dispatch, getState) => {
14551463
case actionType.COMPOUND_DESELECTED:
14561464
dispatch(handleCompoundAction(action, false));
14571465
break;
1466+
case actionType.REPRESENTATION_VISIBILITY_UPDATED:
1467+
dispatch(handleUpdateRepresentationVisibilityAction(action, true, majorView));
1468+
break;
1469+
case actionType.REPRESENTATION_VISIBILITY_ALL_UPDATED:
1470+
dispatch(handleUpdateRepresentationVisibilityAllAction(action, true, majorView));
1471+
break;
14581472
case actionType.REPRESENTATION_UPDATED:
14591473
dispatch(handleUpdateRepresentationAction(action, true, majorView));
14601474
break;
@@ -1825,6 +1839,56 @@ const removeRepresentation = (action, parentKey, representation, nglView, skipTr
18251839
}
18261840
};
18271841

1842+
const handleUpdateRepresentationVisibilityAction = (action, isAdd, nglView) => (dispatch, getState) => {
1843+
if (action) {
1844+
let parentKey = action.object_id;
1845+
let representation = action.representation;
1846+
1847+
const comp = nglView.stage.getComponentsByName(parentKey).first;
1848+
comp.eachRepresentation(r => {
1849+
if (r.uuid === representation.uuid || r.uuid === representation.lastKnownID) {
1850+
const newVisibility = isAdd ? action.value : !action.value;
1851+
// update in redux
1852+
representation.params.visible = newVisibility;
1853+
dispatch(updateComponentRepresentation(parentKey, representation.uuid, representation, '', true));
1854+
dispatch(
1855+
updateComponentRepresentationVisibility(parentKey, representation.uuid, representation, newVisibility)
1856+
);
1857+
// update in nglView
1858+
r.setVisibility(newVisibility);
1859+
}
1860+
});
1861+
}
1862+
};
1863+
1864+
const handleUpdateRepresentationVisibilityAllAction = (action, isAdd, nglView) => (dispatch, getState) => {
1865+
if (action) {
1866+
const state = getState();
1867+
let parentKey = action.object_id;
1868+
let objectsInView = state.nglReducers.objectsInView;
1869+
let newVisibility = isAdd ? action.value : !action.value;
1870+
1871+
const representations = (objectsInView[parentKey] && objectsInView[parentKey].representations) || [];
1872+
const comp = nglView.stage.getComponentsByName(parentKey).first;
1873+
1874+
if (representations) {
1875+
representations.forEach((representation, index) => {
1876+
comp.eachRepresentation(r => {
1877+
if (r.uuid === representation.uuid || r.uuid === representation.lastKnownID) {
1878+
representation.params.visible = newVisibility;
1879+
// update in nglView
1880+
r.setVisibility(newVisibility);
1881+
// update in redux
1882+
dispatch(updateComponentRepresentation(parentKey, representation.uuid, representation, '', true));
1883+
}
1884+
});
1885+
});
1886+
1887+
dispatch(updateComponentRepresentationVisibilityAll(parentKey, newVisibility));
1888+
}
1889+
}
1890+
};
1891+
18281892
const handleUpdateRepresentationAction = (action, isAdd, nglView) => (dispatch, getState) => {
18291893
if (action) {
18301894
dispatch(updateRepresentation(isAdd, action.change, action.object_id, action.representation, nglView));

‎js/reducers/tracking/trackingActions.js

+94-9
Original file line numberDiff line numberDiff line change
@@ -770,8 +770,49 @@ export const findTrackAction = (action, state) => {
770770
text: `${actionDescription.SURFACE} ${actionDescription.TURNED_OFF} ${objectType} ${objectName} of dataset: ${action.payload.datasetID}`
771771
};
772772
}
773+
} else if (action.type === nglConstants.UPDATE_COMPONENT_REPRESENTATION_VISIBILITY) {
774+
let objectType = actionObjectType.REPRESENTATION;
775+
let value = action.newVisibility;
776+
let valueDescription = value === true ? actionDescription.VISIBLE : actionDescription.HIDDEN;
777+
778+
trackAction = {
779+
type: actionType.REPRESENTATION_VISIBILITY_UPDATED,
780+
annotation: actionAnnotation.CHECK,
781+
timestamp: Date.now(),
782+
username: username,
783+
object_type: actionObjectType.REPRESENTATION,
784+
object_name: action.objectInViewID,
785+
object_id: action.objectInViewID,
786+
representation_id: action.representationID,
787+
representation: action.representation,
788+
value: value,
789+
text: `${objectType} '${action.representation?.type}' ${actionDescription.VISIBILITY} of ${action.objectInViewID} ${actionDescription.CHANGED} to: ${valueDescription}`
790+
};
791+
} else if (action.type === nglConstants.UPDATE_COMPONENT_REPRESENTATION_VISIBILITY_ALL) {
792+
let objectType = actionObjectType.REPRESENTATION;
793+
let value = action.newVisibility;
794+
let valueDescription = value === true ? actionDescription.VISIBLE : actionDescription.HIDDEN;
795+
796+
trackAction = {
797+
type: actionType.REPRESENTATION_VISIBILITY_ALL_UPDATED,
798+
annotation: actionAnnotation.CHECK,
799+
timestamp: Date.now(),
800+
username: username,
801+
object_type: actionObjectType.REPRESENTATION,
802+
object_name: action.objectInViewID,
803+
object_id: action.objectInViewID,
804+
value: value,
805+
text: `${objectType} ${actionDescription.VISIBILITY} of ${action.objectInViewID} ${actionDescription.CHANGED} to: ${valueDescription}`
806+
};
773807
} else if (action.type.includes(nglConstants.UPDATE_COMPONENT_REPRESENTATION)) {
774808
let objectType = actionObjectType.REPRESENTATION;
809+
let key = action.change?.key;
810+
let oldValue = action.change?.oldValue;
811+
let newValue = action.change?.value;
812+
let valueDescription =
813+
key !== 'clipCenter'
814+
? `from value: ${oldValue} to value: ${newValue}`
815+
: getClipCenterChange(oldValue, newValue);
775816

776817
trackAction = {
777818
type: actionType.REPRESENTATION_UPDATED,
@@ -784,7 +825,7 @@ export const findTrackAction = (action, state) => {
784825
representation_id: action.representationID,
785826
representation: action.newRepresentation,
786827
change: action.change,
787-
text: `${objectType} '${action.change?.key}' of ${action.objectInViewID} ${actionDescription.UPDATED} from value: ${action.change?.oldValue} to value: ${action.change?.value}`
828+
text: `${objectType} '${key}' of ${action.objectInViewID} ${actionDescription.UPDATED} ${valueDescription}`
788829
};
789830
} else if (action.type.includes(nglConstants.ADD_COMPONENT_REPRESENTATION)) {
790831
let objectType = actionObjectType.REPRESENTATION;
@@ -889,10 +930,17 @@ export const findTrackAction = (action, state) => {
889930
oldSetting: oldSetting,
890931
newSetting: newSetting,
891932
getText: function() {
892-
return "Clip far of NGL " + actionDescription.CHANGED + " from value: " + this.oldSetting + " to value: " + this.newSetting;
933+
return (
934+
'Clip far of NGL ' +
935+
actionDescription.CHANGED +
936+
' from value: ' +
937+
this.oldSetting +
938+
' to value: ' +
939+
this.newSetting
940+
);
893941
},
894942
text: `Clip far of NGL ${actionDescription.CHANGED} from value: ${oldSetting} to value: ${newSetting}`
895-
};
943+
};
896944
} else if (action.type.includes(nglConstants.SET_CLIP_DIST)) {
897945
let oldSetting = action.payload.oldValue;
898946
let newSetting = action.payload.newValue;
@@ -908,10 +956,17 @@ export const findTrackAction = (action, state) => {
908956
oldSetting: oldSetting,
909957
newSetting: newSetting,
910958
getText: function() {
911-
return "Clip dist of NGL " + actionDescription.CHANGED + " from value: " + this.oldSetting + " to value: " + this.newSetting;
959+
return (
960+
'Clip dist of NGL ' +
961+
actionDescription.CHANGED +
962+
' from value: ' +
963+
this.oldSetting +
964+
' to value: ' +
965+
this.newSetting
966+
);
912967
},
913968
text: `Clip dist of NGL ${actionDescription.CHANGED} from value: ${oldSetting} to value: ${newSetting}`
914-
};
969+
};
915970
} else if (action.type.includes(nglConstants.SET_FOG_NEAR)) {
916971
let oldSetting = action.payload.oldValue;
917972
let newSetting = action.payload.newValue;
@@ -927,10 +982,17 @@ export const findTrackAction = (action, state) => {
927982
oldSetting: oldSetting,
928983
newSetting: newSetting,
929984
getText: function() {
930-
return "Fog near of NGL " + actionDescription.CHANGED + " from value: " + this.oldSetting + " to value: " + this.newSetting;
985+
return (
986+
'Fog near of NGL ' +
987+
actionDescription.CHANGED +
988+
' from value: ' +
989+
this.oldSetting +
990+
' to value: ' +
991+
this.newSetting
992+
);
931993
},
932994
text: `For near of NGL ${actionDescription.CHANGED} from value: ${oldSetting} to value: ${newSetting}`
933-
};
995+
};
934996
} else if (action.type.includes(nglConstants.SET_FOG_FAR)) {
935997
let oldSetting = action.payload.oldValue;
936998
let newSetting = action.payload.newValue;
@@ -946,10 +1008,17 @@ export const findTrackAction = (action, state) => {
9461008
oldSetting: oldSetting,
9471009
newSetting: newSetting,
9481010
getText: function() {
949-
return "Fog far of NGL " + actionDescription.CHANGED + " from value: " + this.oldSetting + " to value: " + this.newSetting;
1011+
return (
1012+
'Fog far of NGL ' +
1013+
actionDescription.CHANGED +
1014+
' from value: ' +
1015+
this.oldSetting +
1016+
' to value: ' +
1017+
this.newSetting
1018+
);
9501019
},
9511020
text: `For far of NGL ${actionDescription.CHANGED} from value: ${oldSetting} to value: ${newSetting}`
952-
};
1021+
};
9531022
}
9541023
}
9551024
return trackAction;
@@ -1005,6 +1074,22 @@ const getTypeDescriptionOfSelectedAllAction = type => {
10051074
}
10061075
};
10071076

1077+
const getClipCenterChange = (oldValue, newValue) => {
1078+
let description = '';
1079+
if (oldValue && newValue) {
1080+
if (oldValue.x !== newValue.x) {
1081+
description += ' from value: x:' + oldValue.x + ' to value: x:' + newValue.x;
1082+
}
1083+
if (oldValue.y !== newValue.y) {
1084+
description += ' from value: y:' + oldValue.y + ' to value: y:' + newValue.y;
1085+
}
1086+
if (oldValue.z !== newValue.z) {
1087+
description += ' from value: z:' + oldValue.z + ' to value: z:' + newValue.z;
1088+
}
1089+
}
1090+
return description;
1091+
};
1092+
10081093
export const createInitAction = target_on => (dispatch, getState) => {
10091094
const state = getState();
10101095
const username = DJANGO_CONTEXT['username'];

0 commit comments

Comments
 (0)