Skip to content

Commit 0135a3a

Browse files
FrencilFrencil
committed
Time Series Viewer CENTERED as default axis mode
1 parent 9d22a6b commit 0135a3a

File tree

8 files changed

+125
-75
lines changed

8 files changed

+125
-75
lines changed

‎lib/components/TimeSeriesViewer/TimeSeriesViewerAxes.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -700,13 +700,13 @@ function TimeSeriesViewerAxes() {
700700
}, /*#__PURE__*/_react.default.createElement("div", {
701701
style: {
702702
marginBottom: _Theme.default.spacing(3),
703-
marginRight: _Theme.default.spacing(3)
703+
marginRight: _Theme.default.spacing(4)
704704
}
705705
}, renderOption('Y_AXIS_SCALE')), /*#__PURE__*/_react.default.createElement("div", {
706706
className: classes.yAxesRangesContainer
707707
}, /*#__PURE__*/_react.default.createElement("div", {
708708
style: !hasY2Axis ? null : {
709-
marginRight: _Theme.default.spacing(3)
709+
marginRight: _Theme.default.spacing(4)
710710
}
711711
}, renderOption('Y1_AXIS_RANGE')), !hasY2Axis ? null : renderOption('Y2_AXIS_RANGE')))), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
712712
variant: "h6",
@@ -717,7 +717,7 @@ function TimeSeriesViewerAxes() {
717717
className: classes.optionsContainer
718718
}, state.availableTimeSteps.size < 3 ? null : /*#__PURE__*/_react.default.createElement("div", {
719719
style: {
720-
marginRight: _Theme.default.spacing(3)
720+
marginRight: _Theme.default.spacing(4)
721721
}
722722
}, renderOption('TIME_STEP')), renderOption('ROLL_PERIOD'))));
723723
}

‎lib/components/TimeSeriesViewer/TimeSeriesViewerContext.d.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,23 +24,23 @@ export namespace TIME_SERIES_VIEWER_STATUS_TITLES {
2424
export { READY_1 as READY };
2525
}
2626
export namespace Y_AXIS_RANGE_MODES {
27-
export const FROM_ZERO: string;
2827
export const CENTERED: string;
28+
export const FROM_ZERO: string;
2929
export const CUSTOM: string;
3030
}
3131
export namespace Y_AXIS_RANGE_MODE_DETAILS {
32-
export namespace FROM_ZERO_1 {
32+
export namespace CENTERED_1 {
3333
export const name: string;
3434
export const description: string;
3535
}
36-
export { FROM_ZERO_1 as FROM_ZERO };
37-
export namespace CENTERED_1 {
36+
export { CENTERED_1 as CENTERED };
37+
export namespace FROM_ZERO_1 {
3838
const name_1: string;
3939
export { name_1 as name };
4040
const description_1: string;
4141
export { description_1 as description };
4242
}
43-
export { CENTERED_1 as CENTERED };
43+
export { FROM_ZERO_1 as FROM_ZERO };
4444
export namespace CUSTOM_1 {
4545
const name_2: string;
4646
export { name_2 as name };

‎lib/components/TimeSeriesViewer/TimeSeriesViewerContext.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -103,20 +103,20 @@ var TIME_SERIES_VIEWER_STATUS_TITLES = {
103103

104104
exports.TIME_SERIES_VIEWER_STATUS_TITLES = TIME_SERIES_VIEWER_STATUS_TITLES;
105105
var Y_AXIS_RANGE_MODES = {
106-
FROM_ZERO: 'FROM_ZERO',
107106
CENTERED: 'CENTERED',
107+
FROM_ZERO: 'FROM_ZERO',
108108
CUSTOM: 'CUSTOM'
109109
};
110110
exports.Y_AXIS_RANGE_MODES = Y_AXIS_RANGE_MODES;
111111
var Y_AXIS_RANGE_MODE_DETAILS = {
112-
FROM_ZERO: {
113-
name: 'From Zero',
114-
description: 'Range from zero to one standard deviation above data'
115-
},
116112
CENTERED: {
117113
name: 'Centered',
118114
description: 'Center data by one standard deviation above and below'
119115
},
116+
FROM_ZERO: {
117+
name: 'From Zero',
118+
description: 'Range from zero to one standard deviation above data'
119+
},
120120
CUSTOM: {
121121
name: 'Custom',
122122
description: 'Manually define a minimum and maximum axis range'
@@ -190,7 +190,7 @@ var DEFAULT_AXIS_STATE = {
190190
dataRange: [null, null],
191191
precision: 0,
192192
standardDeviation: 0,
193-
rangeMode: Y_AXIS_RANGE_MODES.FROM_ZERO,
193+
rangeMode: Y_AXIS_RANGE_MODES.CENTERED,
194194
axisRange: [0, 0]
195195
};
196196
var DEFAULT_STATE = {

‎lib/components/TimeSeriesViewer/TimeSeriesViewerSites.js‎

Lines changed: 44 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,8 @@ var _Terrain = _interopRequireDefault(require("@material-ui/icons/Terrain"));
7777

7878
var _History = _interopRequireDefault(require("@material-ui/icons/History"));
7979

80+
var _InfoOutlined = _interopRequireDefault(require("@material-ui/icons/InfoOutlined"));
81+
8082
var _MyLocation = _interopRequireDefault(require("@material-ui/icons/MyLocation"));
8183

8284
var _NotInterested = _interopRequireDefault(require("@material-ui/icons/NotInterested"));
@@ -131,8 +133,6 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
131133

132134
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
133135

134-
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
135-
136136
var ucWord = function ucWord(word) {
137137
return "".concat(word.slice(0, 1)).concat(word.slice(1).toLowerCase());
138138
};
@@ -152,8 +152,6 @@ var ICON_SVGS = {
152152
*/
153153

154154
var useStyles = (0, _styles.makeStyles)(function (theme) {
155-
var _siteCard;
156-
157155
return {
158156
root: {
159157
flexGrow: 1,
@@ -199,15 +197,12 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
199197
alignContent: 'flex-start',
200198
flexFlow: 'row wrap'
201199
},
202-
siteCard: (_siteCard = {
200+
siteCard: {
201+
width: '100%',
203202
padding: theme.spacing(1.5, 2, 1.5, 2),
204203
backgroundColor: theme.palette.grey[50],
205204
marginTop: theme.spacing(3)
206-
}, _defineProperty(_siteCard, theme.breakpoints.up('lg'), {
207-
marginRight: theme.spacing(3)
208-
}), _defineProperty(_siteCard, theme.breakpoints.down('md'), {
209-
width: '100%'
210-
}), _siteCard),
205+
},
211206
siteTitleContainer: {
212207
display: 'flex',
213208
justifyContent: 'space-between',
@@ -240,17 +235,24 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
240235
},
241236
positionsTitleContainer: {
242237
display: 'flex',
243-
justifyContent: 'space-between',
244-
alignItems: 'center'
238+
justifyContent: 'flex-start',
239+
alignItems: 'center',
240+
marginTop: theme.spacing(2)
241+
},
242+
positionsCardContainer: {
243+
display: 'flex',
244+
justifyContent: 'flex-start',
245+
alignItems: 'flex-start',
246+
flexWrap: 'wrap'
245247
},
246248
positionCard: {
247249
display: 'flex',
248250
alignItems: 'center',
249251
justifyContent: 'flex-start',
250252
padding: theme.spacing(0.5, 2, 0.5, 0.5),
251-
width: '100%',
252253
backgroundColor: theme.palette.grey[100],
253-
marginTop: theme.spacing(1.5)
254+
marginTop: theme.spacing(1.5),
255+
marginRight: theme.spacing(3)
254256
},
255257
startFlex: {
256258
display: 'flex',
@@ -378,6 +380,8 @@ var OptionDefaultProps = {
378380
innerRef: null,
379381
isDisabled: false
380382
};
383+
var positionsDescription = "\n Positions are distinct physical sensor locations at a given site. The x, y, and z coordinates\n describe where the sensor is located relative to the ground-level reference point for the site.\n Positions may change over time.\n";
384+
var positionsSeriesDescription = "\n Each position selected will become a distinct series in the chart for each variable (example: 2\n positions \xD7 3 variables = 6 distinct series).\n";
381385
/**
382386
PositionHistoryButton - button that opens a dialog to show all history for a given position
383387
*/
@@ -432,7 +436,7 @@ function PositionHistoryButton(props) {
432436
id: "position-history-dialog-description",
433437
tabIndex: -1,
434438
variant: "body2"
435-
}, "Positions are distinct physical sensor locations at a given site. The x, y, and z coordinates describe where the sensor is located relative to the ground-level reference point for the site. Positions may change over time. The table below shows changes to the physical location of this position since its creation."), /*#__PURE__*/_react.default.createElement(_TableContainer.default, null, /*#__PURE__*/_react.default.createElement(_Table.default, {
439+
}, "".concat(positionsDescription, " The table below shows changes to the physical location of this position since its creation.")), /*#__PURE__*/_react.default.createElement(_TableContainer.default, null, /*#__PURE__*/_react.default.createElement(_Table.default, {
436440
className: classes.table,
437441
"aria-label": "simple table"
438442
}, /*#__PURE__*/_react.default.createElement(_TableHead.default, null, /*#__PURE__*/_react.default.createElement(_TableRow.default, {
@@ -615,7 +619,11 @@ function PositionDetail(props) {
615619
}), /*#__PURE__*/_react.default.createElement(_Typography.default, {
616620
variant: "body2",
617621
style: _extends({}, fadeStyle)
618-
}, "".concat(elevation, "m")))), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
622+
}, "".concat(elevation, "m")))), /*#__PURE__*/_react.default.createElement("div", {
623+
style: {
624+
marginRight: _Theme.default.spacing(3)
625+
}
626+
}, /*#__PURE__*/_react.default.createElement(_Typography.default, {
619627
variant: "body2"
620628
}, /*#__PURE__*/_react.default.createElement("span", {
621629
style: _extends({}, axisStyle)
@@ -625,7 +633,6 @@ function PositionDetail(props) {
625633
style: _extends({}, axisStyle)
626634
}, "z:"), "".concat(zOffset, "m"))), /*#__PURE__*/_react.default.createElement("div", {
627635
style: {
628-
flexGrow: 1,
629636
textAlign: 'right'
630637
}
631638
}, /*#__PURE__*/_react.default.createElement(PositionHistoryButton, {
@@ -666,6 +673,7 @@ function SelectedPosition(props) {
666673
"aria-label": "remove position ".concat(position, " from ").concat(siteCode),
667674
disabled: disabled,
668675
style: {
676+
marginLeft: _Theme.default.spacing(1),
669677
marginRight: _Theme.default.spacing(1)
670678
},
671679
onClick: function onClick() {
@@ -759,6 +767,9 @@ function SelectPositionsButton(props) {
759767
size: "small",
760768
variant: "outlined",
761769
startIcon: /*#__PURE__*/_react.default.createElement(_TouchApp.default, null),
770+
style: {
771+
marginLeft: _Theme.default.spacing(4)
772+
},
762773
onClick: function onClick() {
763774
setLocalSelectedPositions(selectedPositions);
764775
setSelectDialogOpen(true);
@@ -801,7 +812,7 @@ function SelectPositionsButton(props) {
801812
id: "add-positions-dialog-description",
802813
tabIndex: -1,
803814
variant: "body2"
804-
}, "Positions are distinct physical sensor locations at a given site. The x, y, and z coordinates describe where the sensor is located relative to the ground-level reference point for the site. Each position selected will become a distinct series in the chart for each variable (example: 2 positions \xD7 3 variables = 6 distinct series)."), /*#__PURE__*/_react.default.createElement(_List.default, null, availablePositions.map(function (position) {
815+
}, positionsDescription, /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), positionsSeriesDescription), /*#__PURE__*/_react.default.createElement(_List.default, null, availablePositions.map(function (position) {
805816
var labelId = "position-list-label-".concat(position);
806817
return /*#__PURE__*/_react.default.createElement(_ListItem.default, {
807818
key: position,
@@ -1121,17 +1132,28 @@ function SelectedSite(props) {
11211132
}, selectedSiteContent, positions.length ? /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
11221133
className: classes.positionsTitleContainer
11231134
}, /*#__PURE__*/_react.default.createElement(_Typography.default, {
1124-
variant: "h6"
1125-
}, "Position(s):"), /*#__PURE__*/_react.default.createElement(SelectPositionsButton, {
1135+
variant: "subtitle2"
1136+
}, "Position(s)"), /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
1137+
title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, positionsDescription, /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), positionsSeriesDescription)
1138+
}, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
1139+
size: "small",
1140+
style: {
1141+
marginLeft: _Theme.default.spacing(1)
1142+
}
1143+
}, /*#__PURE__*/_react.default.createElement(_InfoOutlined.default, {
1144+
fontSize: "small"
1145+
}))), /*#__PURE__*/_react.default.createElement(SelectPositionsButton, {
11261146
selectedSite: site
1127-
})), positions.map(function (position) {
1147+
})), /*#__PURE__*/_react.default.createElement("div", {
1148+
className: classes.positionsCardContainer
1149+
}, positions.map(function (position) {
11281150
return /*#__PURE__*/_react.default.createElement(SelectedPosition, {
11291151
key: position,
11301152
siteCode: siteCode,
11311153
position: position,
11321154
disabled: positions.length < 2
11331155
});
1134-
})) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
1156+
}))) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
11351157
className: classes.startFlex,
11361158
style: {
11371159
alignItems: 'center'

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "portal-core-components",
3-
"version": "1.4.3",
3+
"version": "1.4.4",
44
"main": "./lib/index.js",
55
"private": true,
66
"homepage": "http://localhost:3010/core-components",

‎src/lib_components/components/TimeSeriesViewer/TimeSeriesViewerAxes.jsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -557,11 +557,11 @@ export default function TimeSeriesViewerAxes() {
557557
<div style={{ marginRight: Theme.spacing(5) }}>
558558
<Typography variant="h6" style={{ marginBottom: Theme.spacing(2) }}>y Axes</Typography>
559559
<div className={classes.optionsContainer}>
560-
<div style={{ marginBottom: Theme.spacing(3), marginRight: Theme.spacing(3) }}>
560+
<div style={{ marginBottom: Theme.spacing(3), marginRight: Theme.spacing(4) }}>
561561
{renderOption('Y_AXIS_SCALE')}
562562
</div>
563563
<div className={classes.yAxesRangesContainer}>
564-
<div style={!hasY2Axis ? null : { marginRight: Theme.spacing(3) }}>
564+
<div style={!hasY2Axis ? null : { marginRight: Theme.spacing(4) }}>
565565
{renderOption('Y1_AXIS_RANGE')}
566566
</div>
567567
{!hasY2Axis ? null : renderOption('Y2_AXIS_RANGE')}
@@ -572,7 +572,7 @@ export default function TimeSeriesViewerAxes() {
572572
<Typography variant="h6" style={{ marginBottom: Theme.spacing(2) }}>x Axis (Time)</Typography>
573573
<div className={classes.optionsContainer}>
574574
{state.availableTimeSteps.size < 3 ? null : (
575-
<div style={{ marginRight: Theme.spacing(3) }}>{renderOption('TIME_STEP')}</div>
575+
<div style={{ marginRight: Theme.spacing(4) }}>{renderOption('TIME_STEP')}</div>
576576
)}
577577
{renderOption('ROLL_PERIOD')}
578578
</div>

‎src/lib_components/components/TimeSeriesViewer/TimeSeriesViewerContext.jsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -62,19 +62,19 @@ export const TIME_SERIES_VIEWER_STATUS_TITLES = {
6262

6363
// Keys, details, and supporting functions for all possible Y-axis range modes
6464
export const Y_AXIS_RANGE_MODES = {
65-
FROM_ZERO: 'FROM_ZERO',
6665
CENTERED: 'CENTERED',
66+
FROM_ZERO: 'FROM_ZERO',
6767
CUSTOM: 'CUSTOM',
6868
};
6969
export const Y_AXIS_RANGE_MODE_DETAILS = {
70-
FROM_ZERO: {
71-
name: 'From Zero',
72-
description: 'Range from zero to one standard deviation above data',
73-
},
7470
CENTERED: {
7571
name: 'Centered',
7672
description: 'Center data by one standard deviation above and below',
7773
},
74+
FROM_ZERO: {
75+
name: 'From Zero',
76+
description: 'Range from zero to one standard deviation above data',
77+
},
7878
CUSTOM: {
7979
name: 'Custom',
8080
description: 'Manually define a minimum and maximum axis range',
@@ -132,7 +132,7 @@ const DEFAULT_AXIS_STATE = {
132132
dataRange: [null, null],
133133
precision: 0,
134134
standardDeviation: 0,
135-
rangeMode: Y_AXIS_RANGE_MODES.FROM_ZERO,
135+
rangeMode: Y_AXIS_RANGE_MODES.CENTERED,
136136
axisRange: [0, 0],
137137
};
138138
const DEFAULT_STATE = {

0 commit comments

Comments
 (0)