From ee5b19b02ea2b4105e2e5a8be33271f60663a29a Mon Sep 17 00:00:00 2001 From: pmockoocy Date: Wed, 23 Oct 2024 11:11:56 +0200 Subject: [PATCH 1/4] Added a way to ensure that user state persists --- mxcubeweb/core/components/sampleview.py | 8 +++++--- ui/src/components/SampleView/SampleImage.jsx | 2 ++ 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/mxcubeweb/core/components/sampleview.py b/mxcubeweb/core/components/sampleview.py index 89157d5f8..535a3d22a 100644 --- a/mxcubeweb/core/components/sampleview.py +++ b/mxcubeweb/core/components/sampleview.py @@ -274,7 +274,6 @@ def handle_grid_result(self, shape): def update_shapes(self, shapes): updated_shapes = [] - for s in shapes: shape_data = from_camel(s) pos = [] @@ -285,6 +284,7 @@ def update_shapes(self, shapes): # If shape does not exist add it if not shape: refs, t = shape_data.pop("refs", []), shape_data.pop("t", "") + user_state = shape_data.pop("user_state", "SAVED") # Store pixels per mm for third party software, to facilitate # certain calculations @@ -329,13 +329,15 @@ def update_shapes(self, shapes): pos.append(center_positions) shape = HWR.beamline.sample_view.add_shape_from_mpos( - pos, (x, y), t + pos, (x, y), t, user_state ) except Exception: logging.getLogger("HWR.MX3").info(shape_data) else: - shape = HWR.beamline.sample_view.add_shape_from_refs(refs, t) + shape = HWR.beamline.sample_view.add_shape_from_refs( + refs, t, user_state + ) # shape will be none if creation failed, so we check if shape exists # before setting additional parameters diff --git a/ui/src/components/SampleView/SampleImage.jsx b/ui/src/components/SampleView/SampleImage.jsx index 53659e45e..f790907d9 100644 --- a/ui/src/components/SampleView/SampleImage.jsx +++ b/ui/src/components/SampleView/SampleImage.jsx @@ -741,8 +741,10 @@ export default class SampleImage extends React.Component { if (grid.state === 'HIDDEN') { grid.state = 'SAVED'; + grid.user_state = 'SAVED'; } else { grid.state = 'HIDDEN'; + grid.user_state = 'HIDDEN'; } this.props.sampleViewActions.updateShapes([grid]); From 49108822f6f0939cf52eea178058f1e3f7f8dec6 Mon Sep 17 00:00:00 2001 From: pmockoocy Date: Wed, 23 Oct 2024 11:44:11 +0200 Subject: [PATCH 2/4] added a way to indicate that the grid's been hidden by user --- ui/src/components/SampleView/GridForm.jsx | 3 ++- ui/src/components/SampleView/SampleView.css | 4 ++++ 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/ui/src/components/SampleView/GridForm.jsx b/ui/src/components/SampleView/GridForm.jsx index 5adf061cb..1e2b40ea0 100644 --- a/ui/src/components/SampleView/GridForm.jsx +++ b/ui/src/components/SampleView/GridForm.jsx @@ -58,12 +58,13 @@ export default function GridForm(props) { for (const grid of Object.values(gridList)) { const selectedStyle = selectedGrids.includes(grid.id) ? 'selected' : ''; + const hiddenStyle = grid.userState === 'HIDDEN' ? 'hid-by-user' : ''; const vdim = grid.numRows * (grid.cellHeight + grid.cellVSpace); const hdim = grid.numCols * (grid.cellWidth + grid.cellHSpace); gridControlList.push( selectGrid([grid], e.ctrlKey)} > diff --git a/ui/src/components/SampleView/SampleView.css b/ui/src/components/SampleView/SampleView.css index a4e45f2d5..deafbfdd2 100644 --- a/ui/src/components/SampleView/SampleView.css +++ b/ui/src/components/SampleView/SampleView.css @@ -176,3 +176,7 @@ color: #000; font-weight: bold; } + +.hid-by-user { + background-color: #aaa !important; +} From 8508646b806f1eb2ac5d267267811402efc0df0f Mon Sep 17 00:00:00 2001 From: pmockoocy Date: Wed, 23 Oct 2024 13:17:55 +0200 Subject: [PATCH 3/4] adding a way to preserve Shape.state when it is recreated --- mxcubeweb/core/components/sampleview.py | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/mxcubeweb/core/components/sampleview.py b/mxcubeweb/core/components/sampleview.py index 535a3d22a..f48a47b08 100644 --- a/mxcubeweb/core/components/sampleview.py +++ b/mxcubeweb/core/components/sampleview.py @@ -284,6 +284,7 @@ def update_shapes(self, shapes): # If shape does not exist add it if not shape: refs, t = shape_data.pop("refs", []), shape_data.pop("t", "") + state = shape_data.pop("state", "SAVED") user_state = shape_data.pop("user_state", "SAVED") # Store pixels per mm for third party software, to facilitate @@ -329,14 +330,14 @@ def update_shapes(self, shapes): pos.append(center_positions) shape = HWR.beamline.sample_view.add_shape_from_mpos( - pos, (x, y), t, user_state + pos, (x, y), t, state, user_state ) except Exception: logging.getLogger("HWR.MX3").info(shape_data) else: shape = HWR.beamline.sample_view.add_shape_from_refs( - refs, t, user_state + refs, t, state, user_state ) # shape will be none if creation failed, so we check if shape exists From 0a68c99386ffbd30eca0858adc63b47ad925c980 Mon Sep 17 00:00:00 2001 From: pmockoocy Date: Thu, 24 Oct 2024 10:43:15 +0200 Subject: [PATCH 4/4] using data attributes to override bootstrap css --- ui/src/components/SampleView/GridForm.jsx | 5 ++--- ui/src/components/SampleView/SampleView.css | 8 ++++---- 2 files changed, 6 insertions(+), 7 deletions(-) diff --git a/ui/src/components/SampleView/GridForm.jsx b/ui/src/components/SampleView/GridForm.jsx index 1e2b40ea0..a5aee39f1 100644 --- a/ui/src/components/SampleView/GridForm.jsx +++ b/ui/src/components/SampleView/GridForm.jsx @@ -57,14 +57,13 @@ export default function GridForm(props) { const gridControlList = []; for (const grid of Object.values(gridList)) { - const selectedStyle = selectedGrids.includes(grid.id) ? 'selected' : ''; - const hiddenStyle = grid.userState === 'HIDDEN' ? 'hid-by-user' : ''; const vdim = grid.numRows * (grid.cellHeight + grid.cellVSpace); const hdim = grid.numCols * (grid.cellWidth + grid.cellHSpace); gridControlList.push( selectGrid([grid], e.ctrlKey)} > diff --git a/ui/src/components/SampleView/SampleView.css b/ui/src/components/SampleView/SampleView.css index deafbfdd2..0eff69d8e 100644 --- a/ui/src/components/SampleView/SampleView.css +++ b/ui/src/components/SampleView/SampleView.css @@ -171,12 +171,12 @@ border-radius: 4px; } -.selected { - background-color: #dff0d8 !important; +table.table-striped > tbody > tr[data-selected='true'] { + background-color: #dff0d8; color: #000; font-weight: bold; } -.hid-by-user { - background-color: #aaa !important; +table.table-striped > tbody > tr[data-user-hidden='true'] { + background-color: #aaa; }