diff --git a/src/OpenSEE/package-lock.json b/src/OpenSEE/package-lock.json index 5e21a462..fed14075 100644 --- a/src/OpenSEE/package-lock.json +++ b/src/OpenSEE/package-lock.json @@ -761,9 +761,9 @@ "license": "Python-2.0" }, "node_modules/@eslint/eslintrc/node_modules/js-yaml": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.2.0.tgz", - "integrity": "sha512-ePWsvanv0DWuDRsW8dnt+R4jQ31SCRCQ7hhNcPXZPsoBZiemuZNYGf7adZdqX2D86j6rvKp3RpCxVTSb8WQlOw==", + "version": "4.3.2", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.3.2.tgz", + "integrity": "sha512-SFNOvSJ+Dgf/9An904Yx+CgSlIPCkIpao4qo51lpee25TIRejdH3rhR4EZMGoNx3/TP3O+wzWuiTFl4sqbltzA==", "dev": true, "funding": [ { @@ -2760,9 +2760,9 @@ "license": "MIT" }, "node_modules/baseline-browser-mapping": { - "version": "2.10.36", - "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.36.tgz", - "integrity": "sha512-lVq/Df7LXlO79MVaaUHztSwWiG9oXoWHlgvNS51v8Dpd4+G4/VIy6qYePTw31nAVls33nUtnfezYeLkYAak9dg==", + "version": "2.11.26", + "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.11.26.tgz", + "integrity": "sha512-GLQdD3y6UF8iVuMJl5fHgE4jdn/ua7n+toKfLgNlg3BqQtOZjpy68T8Tup8/wGWZCDlm7KMg7tPb4MPn7oN0TQ==", "license": "Apache-2.0", "bin": { "baseline-browser-mapping": "dist/cli.cjs" @@ -2781,9 +2781,9 @@ } }, "node_modules/brace-expansion": { - "version": "1.1.15", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.15.tgz", - "integrity": "sha512-EwOCDEex4quD37XhqM3omwtMoJjr//isUZz1JopUNWms+4Z2ViyM/k1YIRePpoVNnQhENnxtFjLaxNHrT7xIUg==", + "version": "1.1.21", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.21.tgz", + "integrity": "sha512-9zeA+KLZNNzglF2TPKRQEDyx6Yby7daAkuy8MiPzpXPsYDWi/DRM8jmwUDxokQjYqBpv5DgPiwD4h4ZZSy1Ujw==", "license": "MIT", "dependencies": { "balanced-match": "^1.0.0", @@ -2803,9 +2803,9 @@ } }, "node_modules/browserslist": { - "version": "4.28.2", - "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.2.tgz", - "integrity": "sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==", + "version": "4.29.1", + "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.29.1.tgz", + "integrity": "sha512-AUdjuRyCNGUYtqpqfTmWyM4fXay8yIQhmLnvYe/THMGfT9B/34X7xQd3ifKxwyNPPpowVBjLb+64BN9Rn1mizw==", "funding": [ { "type": "opencollective", @@ -2823,11 +2823,11 @@ "license": "MIT", "peer": true, "dependencies": { - "baseline-browser-mapping": "^2.10.12", - "caniuse-lite": "^1.0.30001782", - "electron-to-chromium": "^1.5.328", - "node-releases": "^2.0.36", - "update-browserslist-db": "^1.2.3" + "baseline-browser-mapping": "^2.11.25", + "caniuse-lite": "^1.0.30001810", + "electron-to-chromium": "^1.5.438", + "node-releases": "^2.0.57", + "update-browserslist-db": "^1.3.3" }, "bin": { "browserslist": "cli.js" @@ -2879,9 +2879,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001799", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001799.tgz", - "integrity": "sha512-hG1bReV+OUU+MOqK4t/ZWI0tZOyz3rqS9XuhOUz1cIcbwBKjOyJEJuw9ER5JuNyqxNk8u/JUVbGibBOL1yrjFw==", + "version": "1.0.30001812", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001812.tgz", + "integrity": "sha512-qN+QNNBr93TCmFrmte0bBCjSDMuRvt78VlHT99qIGPszm4QsqCX8lnyWUFkHi8B7ZBAPq8SH+UqyXNy/odMdng==", "funding": [ { "type": "opencollective", @@ -3099,9 +3099,9 @@ "license": "Python-2.0" }, "node_modules/cosmiconfig/node_modules/js-yaml": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.2.0.tgz", - "integrity": "sha512-ePWsvanv0DWuDRsW8dnt+R4jQ31SCRCQ7hhNcPXZPsoBZiemuZNYGf7adZdqX2D86j6rvKp3RpCxVTSb8WQlOw==", + "version": "4.3.2", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.3.2.tgz", + "integrity": "sha512-SFNOvSJ+Dgf/9An904Yx+CgSlIPCkIpao4qo51lpee25TIRejdH3rhR4EZMGoNx3/TP3O+wzWuiTFl4sqbltzA==", "dev": true, "funding": [ { @@ -3753,9 +3753,9 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.5.371", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.371.tgz", - "integrity": "sha512-e9htk9mAYL6AzmkEhSvVVw7IWGSBJ/Bqdn2eRyRLrj1g6sncN4WbFt5qnILYoCktktr45pyjIrOiRvBThQ808w==", + "version": "1.5.439", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.439.tgz", + "integrity": "sha512-qu6QIPXhsb+CRcAiTMNjR4A1y/7tCYKkKjr5CZXRVih6qkDf79peZ2BpEU3qoDBNCRrcy3Mra3X9nG5oruuA7Q==", "license": "ISC" }, "node_modules/emittery": { @@ -4012,9 +4012,9 @@ } }, "node_modules/eslint/node_modules/js-yaml": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.2.0.tgz", - "integrity": "sha512-ePWsvanv0DWuDRsW8dnt+R4jQ31SCRCQ7hhNcPXZPsoBZiemuZNYGf7adZdqX2D86j6rvKp3RpCxVTSb8WQlOw==", + "version": "4.3.2", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.3.2.tgz", + "integrity": "sha512-SFNOvSJ+Dgf/9An904Yx+CgSlIPCkIpao4qo51lpee25TIRejdH3rhR4EZMGoNx3/TP3O+wzWuiTFl4sqbltzA==", "dev": true, "funding": [ { @@ -4266,9 +4266,9 @@ "license": "MIT" }, "node_modules/fast-uri": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.2.tgz", - "integrity": "sha512-rVjf7ArG3LTk+FS6Yw81V1DLuZl1bRbNrev6Tmd/9RaroeeRRJhAt7jg/6YFxbvAQXUCavSoZhPPj6oOx+5KjQ==", + "version": "3.1.8", + "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.8.tgz", + "integrity": "sha512-GZMtZUTNRpOVIECoXwLNZS5xUGE+mVNbTB8h/7Rwh2TFWcBQiPzTgyZi05BF9UMZKkLJv8XBRJTlU7zg8+ZfMg==", "funding": [ { "type": "github", @@ -5627,9 +5627,9 @@ "license": "MIT" }, "node_modules/js-yaml": { - "version": "3.14.2", - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.2.tgz", - "integrity": "sha512-PMSmkqxr106Xa156c2M265Z+FTrPl+oxd/rgOQy2tijQeK5TxQ43psO1ZCwhVOSdnn+RzkzlRz/eY4BgJBYVpg==", + "version": "3.15.2", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.15.2.tgz", + "integrity": "sha512-6EuL879VkRA+1Cz578mKMiKvjPNEuk6+r1JaFzoSWejZmtf7xWbIyw1e3KkxlkzTIt9Taw6JBhEppG7utc1P+w==", "license": "MIT", "dependencies": { "argparse": "^1.0.7", @@ -5975,9 +5975,9 @@ "license": "MIT" }, "node_modules/nanoid": { - "version": "3.3.12", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.12.tgz", - "integrity": "sha512-ZB9RH/39qpq5Vu6Y+NmUaFhQR6pp+M2Xt76XBnEwDaGcVAqhlvxrl3B2bKS5D3NH3QR76v3aSrKaF/Kiy7lEtQ==", + "version": "3.3.19", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.19.tgz", + "integrity": "sha512-Y2tUNy4ouw6tq5oDSKeQYGOyhkUBhNOcGV/02KC+6kd9eDGqdZd++mjMiIDilrBYvjEnCYvVtsuHCuP+okSfug==", "dev": true, "funding": [ { @@ -6026,9 +6026,9 @@ "license": "MIT" }, "node_modules/node-releases": { - "version": "2.0.47", - "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.47.tgz", - "integrity": "sha512-Uzmd6LXpouKo8EUK68IjH4+E01w/hXyV3R3g/geCJo+rXLNfh1xucB+LOzYEOQPSiUK3h/xZf0cQGcSsmyL2Og==", + "version": "2.0.57", + "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.57.tgz", + "integrity": "sha512-kQK9LGGFiHtrWiNhZtA7Qbw17AQz+dmsEKODRIVTXA9+e5MS/2gZEBhYJt13GrAz5/IOZKddH/0Z3TP/Zgo+yw==", "license": "MIT", "engines": { "node": ">=18" @@ -6282,9 +6282,9 @@ } }, "node_modules/postcss": { - "version": "8.5.15", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.15.tgz", - "integrity": "sha512-FfR8sjd4em2T6fb3I2MwAJU7HWVMr9zba+enmQeeWFfCbm+UOC/0X4DS8XtpUTMwWMGbjKYP7xjfNekzyGmB3A==", + "version": "8.5.28", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.28.tgz", + "integrity": "sha512-RRuzqDtt5Y9h3quz5hWhK+TPnsmVs6WwSU6LkJMeY4HstUEDuYTG8UJSdawMRzmzAtV+KEoG8N3Qg2qLy5vM/A==", "dev": true, "funding": [ { @@ -6303,7 +6303,7 @@ "license": "MIT", "peer": true, "dependencies": { - "nanoid": "^3.3.12", + "nanoid": "^3.3.18", "picocolors": "^1.1.1", "source-map-js": "^1.2.1" }, @@ -7595,9 +7595,9 @@ } }, "node_modules/update-browserslist-db": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz", - "integrity": "sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==", + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.3.3.tgz", + "integrity": "sha512-pJ2sYawQS0R/WI928Gj5GlPhTGzbMelq0+4INtSYNDV9ErKJcX6xjGWkoG/VnB3dpUm00zALaqkrUD77pO5TDQ==", "funding": [ { "type": "opencollective", diff --git a/src/OpenSEE/wwwroot/Scripts/TSX/Graphs/LineChart/Renderers/XAxes.ts b/src/OpenSEE/wwwroot/Scripts/TSX/Graphs/LineChart/Renderers/XAxes.ts index 7965ce28..b4c5c8c4 100644 --- a/src/OpenSEE/wwwroot/Scripts/TSX/Graphs/LineChart/Renderers/XAxes.ts +++ b/src/OpenSEE/wwwroot/Scripts/TSX/Graphs/LineChart/Renderers/XAxes.ts @@ -24,7 +24,7 @@ import * as d3 from "d3"; import { OpenSee } from "../../../global"; -import { formatTimeTick } from "../../Utils/Utilities"; +import { formatTimeTick, getAutoTimeUnit, resolveTimeUnit } from "../../Utils/Utilities"; import { IFormatTimeContext } from "../../Utils/Types"; export function createXAxis( @@ -66,22 +66,9 @@ export const updateXAxisLabel = ( const h = xScale != null ? xScale.domain()[1] - xScale.domain()[0] : 100; - let label: string; - if ((timeUnit as OpenSee.IUnitSetting).options?.[timeUnit.current]?.short !== "auto" && !isOverlappingWaveform) { - label = (timeUnit as OpenSee.IUnitSetting).options?.[timeUnit.current]?.short ?? ""; - } else if (isOverlappingWaveform) { - label = h < 100 ? "ms" : "s"; - } else if ((timeUnit as OpenSee.IUnitSetting).options?.[timeUnit.current]?.short === "ms since event") { - label = "ms"; - } else if ((timeUnit as OpenSee.IUnitSetting).options?.[timeUnit.current]?.short === "cycles") { - label = "cycle"; - } else { - label = h < 100 ? "ms" : "s"; - } - d3.select(container) .select(".xAxisLabel") - .text(`Time (${label})`); + .text(`Time (${isOverlappingWaveform ? getAutoTimeUnit(h) : resolveTimeUnit(timeUnit, h)})`); } export const updateXAxisPositionOnResize = (container: HTMLDivElement | null, height: number, width: number) => { diff --git a/src/OpenSEE/wwwroot/Scripts/TSX/Graphs/Utils/Utilities.tsx b/src/OpenSEE/wwwroot/Scripts/TSX/Graphs/Utils/Utilities.tsx index 094fbb70..08baa21a 100644 --- a/src/OpenSEE/wwwroot/Scripts/TSX/Graphs/Utils/Utilities.tsx +++ b/src/OpenSEE/wwwroot/Scripts/TSX/Graphs/Utils/Utilities.tsx @@ -83,9 +83,19 @@ export const formatValueTick = (d: number, unit: OpenSee.Unit, yScaleCollection: return d.toFixed(2) }; +// The only place that decides what the "auto" time unit means: ms while less than 100 ms is visible, otherwise s. +export const getAutoTimeUnit = (timeSpanMs: number): 'ms' | 's' => timeSpanMs < 100 ? 'ms' : 's'; + +// Short name of the time unit actually displayed, with "auto" replaced by the unit it resolves to. +export const resolveTimeUnit = (timeUnit: OpenSee.IUnitSetting, timeSpanMs: number): string => { + const short = timeUnit.options?.[timeUnit.current]?.short ?? 'auto'; + return short === 'auto' ? getAutoTimeUnit(timeSpanMs) : short; +}; + export const formatTimeTick = (d: number, ctx: IFormatTimeContext, extraPrecision = false): string => { const TS = moment(d); - let h = ctx.xDomainWidth; + const timeSpanMs = ctx.xDomainWidth; + const short = resolveTimeUnit(ctx.timeUnit, timeSpanMs); // moment/JS Date only resolve to whole milliseconds, so when extra precision is requested the // sub-second portion is taken from the raw value (which keeps sub-ms detail) instead of moment. const extra = extraPrecision ? 1 : 0; @@ -93,52 +103,44 @@ export const formatTimeTick = (d: number, ctx: IFormatTimeContext, extraPrecisio if (ctx.isOverlappingWaveform) { if (defaultSettings.OverlappingWaveTimeUnit.options?.[ctx.overlappingWaveTimeUnit]?.short === "ms") { - if (h < 2) + if (timeSpanMs < 2) return d.toFixed(3 + extra) - if (h < 5) + if (timeSpanMs < 5) return d.toFixed(2 + extra) else return d.toFixed(1 + extra) } else if (defaultSettings.OverlappingWaveTimeUnit.options?.[ctx.overlappingWaveTimeUnit]?.short === "cycles") { const cyc = d * 60.0 / 1000.0; - h = h * 60.0 / 1000.0; - if (h < 2) + const timeSpanCycles = timeSpanMs * 60.0 / 1000.0; + if (timeSpanCycles < 2) return cyc.toFixed(3 + extra) - if (h < 5) + if (timeSpanCycles < 5) return cyc.toFixed(2 + extra) else return cyc.toFixed(1 + extra) } } - else if (ctx.timeUnit.options?.[ctx.timeUnit.current]?.short == 'auto') { - if (h < 100) - return extraPrecision ? subSecondMs.toFixed(3) : TS.format("SSS.S") - else if (h < 1000) - return TS.format("ss.SS") - else - return TS.format("ss.S") - } - else if (ctx.timeUnit.options?.[ctx.timeUnit.current]?.short == 's') { - if (h < 100) + else if (short == 's') { + if (timeSpanMs < 100) return extraPrecision ? ((d % 60000) / 1000).toFixed(5) : TS.format("ss.SSS") - else if (h < 1000) + else if (timeSpanMs < 1000) return TS.format("ss.SS") else return TS.format("ss.S") } - else if (ctx.timeUnit.options?.[ctx.timeUnit.current]?.short == 'ms') + else if (short == 'ms') if (extraPrecision) return subSecondMs.toFixed(3) - else if (h < 100) + else if (timeSpanMs < 100) return TS.format("SSS.S") else return TS.format("SSS") - else if (ctx.timeUnit.options?.[ctx.timeUnit.current]?.short == 'min') + else if (short == 'min') return TS.format("mm:ss") - else if (ctx.timeUnit.options?.[ctx.timeUnit.current]?.short == 'ms since record') { + else if (short == 'ms since record') { let ms = d - ctx.originalStartTime; if (ctx.useRelevantTime && !ctx.isOriginalEvt) { @@ -147,15 +149,15 @@ export const formatTimeTick = (d: number, ctx: IFormatTimeContext, extraPrecisio ms = d - evt?.StartTime } - if (h < 2) + if (timeSpanMs < 2) return ms.toFixed(3 + extra) - if (h < 5) + if (timeSpanMs < 5) return ms.toFixed(2 + extra) else return ms.toFixed(1 + extra) } - else if (ctx.timeUnit.options?.[ctx.timeUnit.current]?.short == 'ms since inception') { + else if (short == 'ms since inception') { let ms = d - ctx.inceptionTime; if (ctx.useRelevantTime && !ctx.isOriginalEvt) { @@ -164,32 +166,32 @@ export const formatTimeTick = (d: number, ctx: IFormatTimeContext, extraPrecisio ms = d - evt?.Inception } - if (h < 2) + if (timeSpanMs < 2) return ms.toFixed(3 + extra) - if (h < 5) + if (timeSpanMs < 5) return ms.toFixed(2 + extra) else return ms.toFixed(1 + extra) } - else if (ctx.timeUnit.options?.[ctx.timeUnit.current]?.short == 'cycles since record') { + else if (short == 'cycles since record') { const cyc = (d - ctx.startTime) * 60.0 / 1000.0; - h = h * 60.0 / 1000.0; - if (h < 2) + const timeSpanCycles = timeSpanMs * 60.0 / 1000.0; + if (timeSpanCycles < 2) return cyc.toFixed(3 + extra) - if (h < 5) + if (timeSpanCycles < 5) return cyc.toFixed(2 + extra) else return cyc.toFixed(1 + extra) } - else if (ctx.timeUnit.options?.[ctx.timeUnit.current]?.short == 'cycles since inception') { + else if (short == 'cycles since inception') { const cyc = (d - ctx.inceptionTime) * 60.0 / 1000.0; - h = h * 60.0 / 1000.0; - if (h < 2) + const timeSpanCycles = timeSpanMs * 60.0 / 1000.0; + if (timeSpanCycles < 2) return cyc.toFixed(3 + extra) - if (h < 5) + if (timeSpanCycles < 5) return cyc.toFixed(2 + extra) else return cyc.toFixed(1 + extra) @@ -227,9 +229,7 @@ export const formatTimeDelta = (deltaMs: number, timeUnit: OpenSee.IUnitSetting, if (isNaN(deltaMs)) return ''; - let short = timeUnit.options?.[timeUnit.current]?.short ?? 'auto'; - if (short === 'auto') - short = domainWidthMS < 100 ? 'ms' : 's'; + const short = resolveTimeUnit(timeUnit, domainWidthMS); if (short === 's') return (deltaMs / 1000).toFixed(7) + ' (s)'; diff --git a/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/AccumulatedPoints.tsx b/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/AccumulatedPoints.tsx index 93911118..4189d8c0 100644 --- a/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/AccumulatedPoints.tsx +++ b/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/AccumulatedPoints.tsx @@ -30,7 +30,7 @@ import { PlotDataStateContext } from '../Context/PlotDataContext'; import { PlotStateStateContext, PlotStateActionContext } from '../Context/PlotStateContext'; import EventContext from '../Context/EventContext'; import { selectSelectedPoints } from '../PlotSelectors'; -import { formatMainEventTimeTick, formatTimeDelta } from '../Graphs/Utils/Utilities'; +import { formatTimeDelta } from '../Graphs/Utils/Utilities'; import { useGetContainerPosition } from '@gpa-gemstone/helper-functions'; import { Alert } from '@gpa-gemstone/react-interactive'; @@ -42,13 +42,6 @@ const PointWidget = () => { const colors = useAppSelector(SelectColor); const timeUnit = useAppSelector(SelectTimeUnit); - const originalStartTime = new Date(evt.Context.EventInfo?.EventDate + "Z").getTime(); - const inceptionTime = new Date(evt.Context.EventInfo?.InceptionDate + "Z").getTime(); - const timeFormatOpts = { timeUnit, domainWidth: plotState.endTime - plotState.startTime, startTime: plotState.startTime, originalStartTime, inceptionTime }; - - const timeUnitShort = timeUnit.options?.[timeUnit.current]?.short ?? 'auto'; - const displayTimeUnitShort = timeUnitShort === 'auto' ? (plotState.endTime - plotState.startTime < 100 ? 'ms' : 's') : timeUnitShort; - const points = React.useMemo( () => selectSelectedPoints(evt.Context.EventID, plots, plotState.meta), [evt.Context.EventID, plots, plotState.meta] diff --git a/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/PlotSettings/SettingWindow.tsx b/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/PlotSettings/SettingWindow.tsx index 4633061a..0a9ed012 100644 --- a/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/PlotSettings/SettingWindow.tsx +++ b/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/PlotSettings/SettingWindow.tsx @@ -217,6 +217,7 @@ const SettingsWidget = () => { diff --git a/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/PlotSettings/TimeUnitSelector.tsx b/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/PlotSettings/TimeUnitSelector.tsx index d91bae2f..81dedf25 100644 --- a/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/PlotSettings/TimeUnitSelector.tsx +++ b/src/OpenSEE/wwwroot/Scripts/TSX/Widgets/PlotSettings/TimeUnitSelector.tsx @@ -22,26 +22,38 @@ //****************************************************************************************************** import * as React from 'react'; import { defaultSettings } from '../../defaults'; +import { getAutoTimeUnit } from '../../Graphs/Utils/Utilities'; import { Select } from '@gpa-gemstone/react-forms'; interface IProps { setter: (index: number) => void, timeUnitIndex: number, - overlappingWave?: boolean + overlappingWave?: boolean, + timeSpanMs?: number } const TimeUnitSelector = React.memo((props: IProps) => { - const options = React.useMemo(() => { - const src = props.overlappingWave - ? (defaultSettings.OverlappingWaveTimeUnit.options ?? []) - : (defaultSettings.TimeUnit.options ?? []); - return src.map((option, index) => ({ Label: option.label, Value: index })); - }, [props.overlappingWave]); + const src = React.useMemo(() => props.overlappingWave + ? (defaultSettings.OverlappingWaveTimeUnit.options ?? []) + : (defaultSettings.TimeUnit.options ?? []), [props.overlappingWave]); + + // Like AxisUnitSelector, when auto is selected show the unit it currently resolves to + let autoIndex = -1; + if (src[props.timeUnitIndex]?.short === 'auto' && props.timeSpanMs != null) { + const autoShort = getAutoTimeUnit(props.timeSpanMs); + autoIndex = src.findIndex(option => option.short === autoShort); + } + + const options = React.useMemo(() => + src.map((option, index) => ({ + Label: index === autoIndex ? `${option.label} (auto)` : option.label, + Value: index + })), [src, autoIndex]); return (