Skip to content

Commit 5d7f862

Browse files
author
Lan Le
committed
feat WIP: add threshold
1 parent cf4504f commit 5d7f862

10 files changed

Lines changed: 97 additions & 49 deletions

File tree

‎dist/components/cmd_bar/index.js‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,18 +37,19 @@ const CmdBar = _ref => {
3737
operations,
3838
editorOnly,
3939
jcampIdx,
40-
hideThreshold
40+
hideThreshold,
41+
hideMainEditTools
4142
} = _ref;
4243
return /*#__PURE__*/_react.default.createElement("div", {
4344
className: classes.card
44-
}, /*#__PURE__*/_react.default.createElement(_viewer.default, {
45+
}, hideMainEditTools ? null : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_viewer.default, {
4546
editorOnly: editorOnly
4647
}), /*#__PURE__*/_react.default.createElement(_zoom.default, null), /*#__PURE__*/_react.default.createElement(_peak.default, {
4748
jcampIdx: jcampIdx,
4849
feature: feature
4950
}), /*#__PURE__*/_react.default.createElement(_pecker.default, {
5051
jcampIdx: jcampIdx
51-
}), /*#__PURE__*/_react.default.createElement(_integration.default, null), /*#__PURE__*/_react.default.createElement(_multiplicity.default, null), /*#__PURE__*/_react.default.createElement(_undo_redo.default, null), /*#__PURE__*/_react.default.createElement(_r04_submit.default, {
52+
}), /*#__PURE__*/_react.default.createElement(_integration.default, null), /*#__PURE__*/_react.default.createElement(_multiplicity.default, null), /*#__PURE__*/_react.default.createElement(_undo_redo.default, null)), /*#__PURE__*/_react.default.createElement(_r04_submit.default, {
5253
operations: operations,
5354
feature: feature,
5455
forecast: forecast,
@@ -75,6 +76,7 @@ CmdBar.propTypes = {
7576
operations: _propTypes.default.array.isRequired,
7677
editorOnly: _propTypes.default.bool.isRequired,
7778
jcampIdx: _propTypes.default.any,
78-
hideThreshold: _propTypes.default.bool
79+
hideThreshold: _propTypes.default.bool,
80+
hideMainEditTools: _propTypes.default.bool
7981
};
8082
var _default = exports.default = (0, _redux.compose)((0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps), (0, _withStyles.default)(styles))(CmdBar);

‎dist/components/cmd_bar/r03_threshold.js‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -91,11 +91,12 @@ const Threshold = _ref => {
9191
thresValSt,
9292
isEditSt,
9393
curveSt,
94+
hplcMsSt,
9495
updateThresholdValueAct,
9596
resetThresholdValueAct,
9697
toggleThresholdIsEditAct
9798
} = _ref;
98-
const thresVal = thresValSt || feature.thresRef;
99+
const thresVal = thresValSt || (feature ? feature.thresRef : hplcMsSt.threshold.value);
99100
return /*#__PURE__*/_react.default.createElement("span", {
100101
className: classes.groupRight
101102
}, setThreshold(classes, thresVal, updateThresholdValueAct, curveSt), /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
@@ -124,7 +125,8 @@ const mapStateToProps = (state, props) => (
124125
hideThresSt: _cfg.default.hideCmdThres(state.layout),
125126
isEditSt: state.threshold.list[state.curve.curveIdx].isEdit,
126127
thresValSt: parseFloat(state.threshold.list[state.curve.curveIdx].value) || 0,
127-
curveSt: state.curve
128+
curveSt: state.curve,
129+
hplcMsSt: state.hplcMs
128130
});
129131
const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({
130132
updateThresholdValueAct: _threshold.updateThresholdValue,
@@ -141,6 +143,7 @@ Threshold.propTypes = {
141143
curveSt: _propTypes.default.object.isRequired,
142144
updateThresholdValueAct: _propTypes.default.func.isRequired,
143145
resetThresholdValueAct: _propTypes.default.func.isRequired,
144-
toggleThresholdIsEditAct: _propTypes.default.func.isRequired
146+
toggleThresholdIsEditAct: _propTypes.default.func.isRequired,
147+
hplcMsSt: _propTypes.default.bool.isRequired
145148
};
146149
var _default = exports.default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)((0, _styles.withStyles)(styles)(Threshold));

‎dist/components/d3_line_rect/index.js‎

Lines changed: 22 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,11 @@ var _draw = require("../common/draw");
2929
var _list_ui = require("../../constants/list_ui");
3030
var _list_graph = require("../../constants/list_graph");
3131
var _peak_group = _interopRequireDefault(require("../cmd_bar/08_peak_group"));
32+
var _r03_threshold = _interopRequireDefault(require("../cmd_bar/r03_threshold"));
3233
/* eslint-disable no-mixed-operators, prefer-object-spread, react/function-component-definition */
3334

34-
// import Zoom from '../cmd_bar/02_zoom';
35-
3635
const W = Math.round(window.innerWidth * 0.90 * 9 / 12); // ROI
37-
const H = Math.round(window.innerHeight * 0.90 * 0.85 / 3); // ROI
36+
const H = Math.round(window.innerHeight * 0.90 * 0.8 / 3); // ROI
3837

3938
const styles = () => Object.assign({}, _common.commonStyle);
4039
const zoomView = (classes, graphIndex, uiSt, zoomInAct) => {
@@ -98,7 +97,10 @@ const waveLengthSelect = (classes, hplcMsSt, updateWaveLengthAct) => {
9897
}, d)));
9998
return /*#__PURE__*/_react.default.createElement(_material.FormControl, {
10099
className: (0, _classnames.default)(classes.fieldDecimal),
101-
variant: "outlined"
100+
variant: "outlined",
101+
style: {
102+
width: '80px'
103+
}
102104
}, /*#__PURE__*/_react.default.createElement(_material.InputLabel, {
103105
id: "select-decimal-label",
104106
className: (0, _classnames.default)(classes.selectLabel, 'select-sv-bar-label')
@@ -192,8 +194,6 @@ class ViewerLineRect extends _react.default.Component {
192194
curveSt,
193195
seed,
194196
cLabel,
195-
xLabel,
196-
yLabel,
197197
feature,
198198
tTrEndPts,
199199
layoutSt,
@@ -237,7 +237,7 @@ class ViewerLineRect extends _react.default.Component {
237237
isUiNoBrushSt: true,
238238
sweepExtentSt: sweepExtent[0]
239239
});
240-
(0, _draw.drawLabel)(this.rootKlassLine, null, 'M/Z', 'Intensity');
240+
(0, _draw.drawLabel)(this.rootKlassLine, null, 'Minutes', 'Intensity');
241241
(0, _draw.drawDisplay)(this.rootKlassLine, false);
242242
const filterSeed = seed;
243243
(0, _draw.drawMain)(this.rootKlassMulti, W, H, _list_graph.LIST_BRUSH_SVG_GRAPH.MULTI);
@@ -251,7 +251,7 @@ class ViewerLineRect extends _react.default.Component {
251251
isUiAddIntgSt,
252252
isUiNoBrushSt
253253
});
254-
(0, _draw.drawLabel)(this.rootKlassMulti, cLabel, xLabel, yLabel);
254+
(0, _draw.drawLabel)(this.rootKlassMulti, cLabel, 'Minutes', 'Intensity');
255255
(0, _draw.drawDisplay)(this.rootKlassMulti, isHidden);
256256
(0, _draw.drawMain)(this.rootKlassRect, W, H, _list_graph.LIST_BRUSH_SVG_GRAPH.RECT);
257257
this.rectFocus.create({
@@ -270,14 +270,13 @@ class ViewerLineRect extends _react.default.Component {
270270
curveSt,
271271
seed,
272272
cLabel,
273-
xLabel,
274-
yLabel,
275273
tTrEndPts,
276274
layoutSt,
277275
isUiAddIntgSt,
278276
isUiNoBrushSt,
279277
isHidden,
280-
uiSt
278+
uiSt,
279+
hplcMsSt
281280
} = this.props;
282281
this.normChange(prevProps);
283282
const {
@@ -310,7 +309,7 @@ class ViewerLineRect extends _react.default.Component {
310309
isUiNoBrushSt: true,
311310
sweepExtentSt: sweepExtent[0]
312311
});
313-
(0, _draw.drawLabel)(this.rootKlassLine, null, 'M/Z', 'Intensity');
312+
(0, _draw.drawLabel)(this.rootKlassLine, null, 'Minutes', 'Intensity');
314313
(0, _draw.drawDisplay)(this.rootKlassLine, false);
315314
}
316315
const filterSeed = seed;
@@ -324,13 +323,16 @@ class ViewerLineRect extends _react.default.Component {
324323
isUiAddIntgSt,
325324
isUiNoBrushSt
326325
});
327-
(0, _draw.drawLabel)(this.rootKlassMulti, cLabel, xLabel, yLabel);
326+
(0, _draw.drawLabel)(this.rootKlassMulti, cLabel, 'Minutes', 'Intensity');
328327
(0, _draw.drawDisplay)(this.rootKlassMulti, isHidden);
329328
const subViewFeature = this.extractSubView();
330329
if (subViewFeature) {
330+
const {
331+
threshold
332+
} = hplcMsSt;
333+
const curTrEndPts = (0, _chem.convertThresEndPts)(subViewFeature, threshold.value);
331334
const {
332335
data,
333-
xUnit,
334336
pageValue
335337
} = subViewFeature;
336338
const currentData = data[0];
@@ -348,11 +350,11 @@ class ViewerLineRect extends _react.default.Component {
348350
this.rectFocus.update({
349351
filterSeed: subSeed,
350352
filterPeak: [],
351-
tTrEndPts,
353+
tTrEndPts: curTrEndPts,
352354
isUiNoBrushSt: true,
353355
sweepExtentSt: sweepExtent[2]
354356
});
355-
(0, _draw.drawLabel)(this.rootKlassRect, `${pageValue} min`, xUnit, 'Intensity');
357+
(0, _draw.drawLabel)(this.rootKlassRect, `${pageValue} min`, 'M/Z', 'Intensity');
356358
(0, _draw.drawDisplay)(this.rootKlassRect, false);
357359
}
358360
}
@@ -432,22 +434,14 @@ class ViewerLineRect extends _react.default.Component {
432434
updateTicAct(event);
433435
selectCurveAct(event.target.value);
434436
};
435-
return /*#__PURE__*/_react.default.createElement("div", null, zoomView(_classnames.default, 0, uiSt, zoomInAct), /*#__PURE__*/_react.default.createElement("div", {
436-
style: {
437-
textAlign: 'right'
438-
}
439-
}, waveLengthSelect(classes, hplcMsSt, selectWavelengthAct), /*#__PURE__*/_react.default.createElement("div", {
437+
return /*#__PURE__*/_react.default.createElement("div", null, zoomView(_classnames.default, 0, uiSt, zoomInAct), waveLengthSelect(classes, hplcMsSt, selectWavelengthAct), /*#__PURE__*/_react.default.createElement("div", {
440438
className: _list_graph.LIST_ROOT_SVG_GRAPH.LINE
441-
})), /*#__PURE__*/_react.default.createElement(_peak_group.default, {
439+
}), /*#__PURE__*/_react.default.createElement(_peak_group.default, {
442440
feature: feature,
443441
graphIndex: 1
444-
}), zoomView(classes, 1, uiSt, zoomInAct), /*#__PURE__*/_react.default.createElement("div", {
445-
style: {
446-
textAlign: 'right'
447-
}
448-
}, ticSelect(classes, hplcMsSt, handleTicChanged), /*#__PURE__*/_react.default.createElement("div", {
442+
}), zoomView(classes, 1, uiSt, zoomInAct), ticSelect(classes, hplcMsSt, handleTicChanged), /*#__PURE__*/_react.default.createElement("div", {
449443
className: _list_graph.LIST_ROOT_SVG_GRAPH.MULTI
450-
})), zoomView(classes, 2, uiSt, zoomInAct), /*#__PURE__*/_react.default.createElement("div", {
444+
}), zoomView(classes, 2, uiSt, zoomInAct), /*#__PURE__*/_react.default.createElement(_r03_threshold.default, null), /*#__PURE__*/_react.default.createElement("div", {
451445
className: _list_graph.LIST_ROOT_SVG_GRAPH.RECT
452446
}));
453447
}
@@ -479,8 +473,6 @@ ViewerLineRect.propTypes = {
479473
subEntities: _propTypes.default.array.isRequired,
480474
seed: _propTypes.default.array.isRequired,
481475
cLabel: _propTypes.default.string.isRequired,
482-
xLabel: _propTypes.default.string.isRequired,
483-
yLabel: _propTypes.default.string.isRequired,
484476
layoutSt: _propTypes.default.string.isRequired,
485477
feature: _propTypes.default.object.isRequired,
486478
tTrEndPts: _propTypes.default.array.isRequired,

‎dist/components/d3_line_rect/rect_focus.js‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -132,9 +132,7 @@ class RectFocus {
132132
yt
133133
} = (0, _compass.TfRescale)(this);
134134
this.updatePathCall(xt, yt);
135-
136-
// const yRef = this.tTrEndPts[0].y;
137-
const yRef = 0;
135+
const yRef = this.tTrEndPts[0].y;
138136
const bars = this.bars.selectAll('rect').data(this.data);
139137
bars.exit().attr('class', 'exit').remove();
140138
const gnd = yt(0);
@@ -201,7 +199,7 @@ class RectFocus {
201199
if (this.data && this.data.length > 0) {
202200
this.setConfig(sweepExtentSt);
203201
this.drawBar();
204-
// this.drawThres();
202+
this.drawThres();
205203
this.drawGrid();
206204
}
207205
(0, _brush.default)(this, isUiAddIntgSt, isUiNoBrushSt, this.brushClass);
@@ -221,7 +219,7 @@ class RectFocus {
221219
if (this.data && this.data.length > 0) {
222220
this.setConfig(sweepExtentSt);
223221
this.drawBar();
224-
// this.drawThres();
222+
this.drawThres();
225223
this.drawGrid();
226224
}
227225
(0, _brush.default)(this, isUiAddIntgSt, isUiNoBrushSt, this.brushClass);

‎dist/components/hplc_viewer.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,8 @@ class HPLCViewer extends _react.default.Component {
6161
feature: feature,
6262
operations: operations,
6363
editorOnly: true,
64-
hideThreshold: true
64+
hideThreshold: true,
65+
hideMainEditTools: true
6566
}), /*#__PURE__*/_react.default.createElement("div", {
6667
className: "react-spectrum-editor"
6768
}, /*#__PURE__*/_react.default.createElement(_material.Grid, {

‎dist/helpers/chem.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
44
Object.defineProperty(exports, "__esModule", {
55
value: true
66
});
7-
exports.convertTopic = exports.Topic2Seed = exports.ToThresEndPts = exports.ToShiftPeaks = exports.ToFrequency = exports.GetCyclicVoltaShiftOffset = exports.GetCyclicVoltaRatio = exports.GetCyclicVoltaPreviousShift = exports.GetCyclicVoltaPeakSeparate = exports.GetComparisons = exports.Feature2Peak = exports.Feature2MaxMinPeak = exports.ExtractJcamp = exports.Convert2Thres = exports.Convert2Scan = exports.Convert2Peak = exports.Convert2MaxMinPeak = exports.Convert2DValue = void 0;
7+
exports.convertTopic = exports.convertThresEndPts = exports.Topic2Seed = exports.ToThresEndPts = exports.ToShiftPeaks = exports.ToFrequency = exports.GetCyclicVoltaShiftOffset = exports.GetCyclicVoltaRatio = exports.GetCyclicVoltaPreviousShift = exports.GetCyclicVoltaPeakSeparate = exports.GetComparisons = exports.Feature2Peak = exports.Feature2MaxMinPeak = exports.ExtractJcamp = exports.Convert2Thres = exports.Convert2Scan = exports.Convert2Peak = exports.Convert2MaxMinPeak = exports.Convert2DValue = void 0;
88
var _jcampconverter = _interopRequireDefault(require("jcampconverter"));
99
var _reselect = require("reselect");
1010
var _shift = require("./shift");
@@ -295,6 +295,7 @@ const convertThresEndPts = (feature, threshold) => {
295295
}];
296296
return endPts;
297297
};
298+
exports.convertThresEndPts = convertThresEndPts;
298299
const ToThresEndPts = exports.ToThresEndPts = (0, _reselect.createSelector)(getFeature, getThreshold, convertThresEndPts);
299300
const getShiftPeak = state => {
300301
const {
@@ -808,6 +809,7 @@ const extrFeaturesMs = (jcamp, layout, peakUp) => {
808809
// }
809810
// // workaround for legacy design
810811
const thresRef = jcamp.info && jcamp.info.$CSTHRESHOLD * 100 || 5;
812+
console.log('thresRef', thresRef);
811813
const base = jcamp.spectra[0];
812814
const features = jcamp.spectra.map(s => {
813815
const cpo = buildPeakFeature(jcamp, layout, peakUp, s, +thresRef.toFixed(4));

‎dist/reducers/reducer_hplc_ms.js‎

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,10 @@ const initialState = {
1717
},
1818
tic: {
1919
isNegative: false
20+
},
21+
threshold: {
22+
isEdit: true,
23+
value: false
2024
}
2125
};
2226
const updateHPLCData = (state, action) => {
@@ -42,8 +46,16 @@ const updateHPLCData = (state, action) => {
4246
listWaveLength,
4347
selectedWaveLength: listWaveLength[0]
4448
});
49+
const postiveCurves = payload[3];
50+
const {
51+
thresRef
52+
} = postiveCurves.features[0];
4553
return Object.assign({}, state, {
46-
uvvis: newUvvis
54+
uvvis: newUvvis,
55+
threshold: {
56+
isEdit: true,
57+
value: thresRef
58+
}
4759
});
4860
}
4961
return state;
@@ -94,6 +106,23 @@ const updateTic = (state, action) => {
94106
}
95107
return state;
96108
};
109+
const updateThresholdValue = (state, action) => {
110+
const {
111+
payload
112+
} = action;
113+
if (payload) {
114+
const {
115+
value
116+
} = payload;
117+
return Object.assign({}, state, {
118+
threshold: {
119+
isEdit: true,
120+
value
121+
}
122+
});
123+
}
124+
return state;
125+
};
97126
const hplcmsReducer = function () {
98127
let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : initialState;
99128
let action = arguments.length > 1 ? arguments[1] : undefined;
@@ -104,6 +133,8 @@ const hplcmsReducer = function () {
104133
return updateWaveLength(state, action);
105134
case _action_type.HPLC_MS.SELECT_TIC_CURVE:
106135
return updateTic(state, action);
136+
case _action_type.THRESHOLD.UPDATE_VALUE:
137+
return updateThresholdValue(state, action);
107138
default:
108139
return state;
109140
}

‎src/components/cmd_bar/r03_threshold.js‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -89,10 +89,10 @@ const restoreTp = (hasEdit, isEdit) => (
8989

9090
const Threshold = ({
9191
classes, feature, hasEdit,
92-
hideThresSt, thresValSt, isEditSt, curveSt,
92+
hideThresSt, thresValSt, isEditSt, curveSt, hplcMsSt,
9393
updateThresholdValueAct, resetThresholdValueAct, toggleThresholdIsEditAct,
9494
}) => {
95-
const thresVal = thresValSt || feature.thresRef;
95+
const thresVal = thresValSt || (feature ? feature.thresRef : hplcMsSt.threshold.value);
9696

9797
return (
9898
<span className={classes.groupRight}>
@@ -139,6 +139,7 @@ const mapStateToProps = (state, props) => ( // eslint-disable-line
139139
isEditSt: state.threshold.list[state.curve.curveIdx].isEdit,
140140
thresValSt: parseFloat(state.threshold.list[state.curve.curveIdx].value) || 0,
141141
curveSt: state.curve,
142+
hplcMsSt: state.hplcMs,
142143
}
143144
);
144145

@@ -161,6 +162,7 @@ Threshold.propTypes = {
161162
updateThresholdValueAct: PropTypes.func.isRequired,
162163
resetThresholdValueAct: PropTypes.func.isRequired,
163164
toggleThresholdIsEditAct: PropTypes.func.isRequired,
165+
hplcMsSt: PropTypes.bool.isRequired,
164166
};
165167

166168
export default connect(

‎src/components/d3_line_rect/index.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ import {
3232
} from '../common/draw';
3333
import { LIST_UI_SWEEP_TYPE, LIST_NON_BRUSH_TYPES } from '../../constants/list_ui';
3434
import { LIST_ROOT_SVG_GRAPH, LIST_BRUSH_SVG_GRAPH } from '../../constants/list_graph';
35-
// import Zoom from '../cmd_bar/02_zoom';
3635
import PeakGroup from '../cmd_bar/08_peak_group';
36+
import Threshold from '../cmd_bar/r03_threshold';
3737

3838
const W = Math.round(window.innerWidth * 0.90 * 9 / 12); // ROI
3939
const H = Math.round(window.innerHeight * 0.90 * 0.8 / 3); // ROI
@@ -399,6 +399,7 @@ class ViewerLineRect extends React.Component {
399399
{
400400
zoomView(classes, 2, uiSt, zoomInAct)
401401
}
402+
<Threshold />
402403
<div className={LIST_ROOT_SVG_GRAPH.RECT} />
403404
</div>
404405
);

0 commit comments

Comments
 (0)