From 862bc10312ea559b9a12d63b3de5893fdf250ef1 Mon Sep 17 00:00:00 2001 From: Lisa Stillwell Date: Fri, 9 Feb 2024 12:41:13 -0500 Subject: [PATCH] add the patch file for graph changes --- .../drawer/layer-details/tabs/config-tab.js | 4 +- .../drawer/layer-details/tabs/graph-tab.js | 1 - .../forms/metget/helpers/track.js | 1 - .../components/utils/storm-layers.js | 2 - patches/terriajs+8.2.21.patch | 427 ++++++++++++++++-- 5 files changed, 398 insertions(+), 37 deletions(-) diff --git a/lib/custom-ui/components/drawer/layer-details/tabs/config-tab.js b/lib/custom-ui/components/drawer/layer-details/tabs/config-tab.js index ef38f392d..9e6d5cf4a 100644 --- a/lib/custom-ui/components/drawer/layer-details/tabs/config-tab.js +++ b/lib/custom-ui/components/drawer/layer-details/tabs/config-tab.js @@ -4,7 +4,9 @@ import OpacityScale from "./opacityScale"; import React from "react"; export const ConfigTab = ({ activatedLayer }) => { - const isObs = activatedLayer.uniqueId.endsWith("obs"); + const isObs = + activatedLayer.uniqueId.endsWith("obs") || + activatedLayer.uniqueId.endsWith("-hurr_composite"); return ( { const [shouldSelect, setShouldSelect] = useState(true); - console.log(chartItem); const lineColor = shouldSelect ? chartItem.getColor() : "#fff"; const toggleActive = () => { diff --git a/lib/custom-ui/components/layer-selection/forms/metget/helpers/track.js b/lib/custom-ui/components/layer-selection/forms/metget/helpers/track.js index 696503269..4489f4274 100644 --- a/lib/custom-ui/components/layer-selection/forms/metget/helpers/track.js +++ b/lib/custom-ui/components/layer-selection/forms/metget/helpers/track.js @@ -220,7 +220,6 @@ export function getTrackGeojson(trackData, timezone, storm_name = "") { stroke: "#858585", "stroke-opacity": 0.7 }; - console.log(JSON.stringify(coneFeatureCollection)); return { cone: coneFeatureCollection, diff --git a/lib/custom-ui/components/utils/storm-layers.js b/lib/custom-ui/components/utils/storm-layers.js index 732bd0f99..70eb77dcd 100644 --- a/lib/custom-ui/components/utils/storm-layers.js +++ b/lib/custom-ui/components/utils/storm-layers.js @@ -171,8 +171,6 @@ export function removeStormLayers(viewState, item) { } } -export function toggleStormLayerVisability(viewState, item) {} - // example uniqueId looks like this: 4419-2023071912-gfsforecast-obs // just want this part returned: 4419-2023071912-gfsforecast function getTruncatedId(uniqueId) { diff --git a/patches/terriajs+8.2.21.patch b/patches/terriajs+8.2.21.patch index 72d31358f..05b47e82d 100644 --- a/patches/terriajs+8.2.21.patch +++ b/patches/terriajs+8.2.21.patch @@ -102,8 +102,257 @@ index d8f0f0b..25ebd57 100644 // Handle click events that cross the anti-meridian if (mouseEvent.latlng.lng > 180 || mouseEvent.latlng.lng < -180) { mouseEvent.latlng = mouseEvent.latlng.wrap(); +diff --git a/node_modules/terriajs/lib/ReactViews/Custom/Chart/ChartExpandAndDownloadButtons copy.tsx b/node_modules/terriajs/lib/ReactViews/Custom/Chart/ChartExpandAndDownloadButtons copy.tsx +new file mode 100644 +index 0000000..834025a +--- /dev/null ++++ b/node_modules/terriajs/lib/ReactViews/Custom/Chart/ChartExpandAndDownloadButtons copy.tsx +@@ -0,0 +1,243 @@ ++import classNames from "classnames"; ++import { TFunction } from "i18next"; ++import { action, observable, runInAction } from "mobx"; ++import { observer } from "mobx-react"; ++import React, { useEffect } from "react"; ++import { WithTranslation, withTranslation } from "react-i18next"; ++import filterOutUndefined from "../../../Core/filterOutUndefined"; ++import ChartableMixin from "../../../ModelMixins/ChartableMixin"; ++import hasTraits from "../../../Models/Definition/hasTraits"; ++import Terria from "../../../Models/Terria"; ++import Icon from "../../../Styled/Icon"; ++import UrlTraits from "../../../Traits/TraitsClasses/UrlTraits"; ++import Styles from "./chart-expand-and-download-buttons.scss"; ++import {useLayout} from "../../../../../../lib/custom-ui/components/layout"; ++import {useLayers} from "../../../../../../lib/custom-ui/context"; ++ ++ ++ ++const Dropdown = require("../../Generic/Dropdown"); ++ ++interface PropsType extends WithTranslation { ++ terria: Terria; ++ sourceItems: Promise[]; // Array of items or Promise returning item ++ sourceNames?: string[]; ++ canDownload: boolean; ++ downloads?: string[]; ++ downloadNames?: string[]; ++ raiseToTitle: boolean; ++ t: TFunction; ++} ++ ++@observer ++class ChartExpandAndDownloadButtons extends React.Component { ++ @observable sourceItems: ChartableMixin.Instance[] = []; ++ ++ ++ @action.bound ++ private expandButton() { ++ this.expandItem(this.sourceItems.length - 1); ++ } ++ ++ @action.bound ++ private expandDropdown(_selected: unknown, sourceIndex: number) { ++ this.expandItem(sourceIndex); ++ } ++ ++ /** ++ * Expand sourceIndex item by adding it to the workbench. ++ * ++ * We also remove any existing sourceItems from workbench so that only one ++ * source is shown at any time. ++ */ ++ private expandItem(sourceIndex: number) { ++ const terria = this.props.terria; ++ ++ runInAction(async () => { ++ const sourceItems = this.sourceItems; ++ const itemToExpand = sourceItems[sourceIndex]; ++ const workbench = terria.workbench; ++ if (!itemToExpand) { ++ return; ++ } ++ ++ // We want to show only one source item at a time, so remove any ++ // existing source items from the workbench ++ sourceItems.forEach((sourceItem) => { ++ workbench.items.forEach((workbenchItem) => { ++ if (sourceItem.uniqueId === workbenchItem.uniqueId) { ++ workbench.remove(workbenchItem); ++ } ++ }); ++ }); ++ ++ ++ try { ++ terria.addModel(itemToExpand); ++ } catch {} ++ (await workbench.add(itemToExpand)).raiseError(terria, undefined, true); ++ workbench.items.map((layer) => { ++ type Wbench = { ++ [key: string]: any; // 👈️ variable key ++ }; ++ ++ const obj: Wbench = {}; ++ ++ obj.layer = layer; ++ if (obj.layer.chartItems.length > 0) { ++ obj.layer.chartItems.map((item: {updateIsSelectedInWorkbench: (a: boolean) => void}) => { ++ item.updateIsSelectedInWorkbench(true); ++ }); ++ } ++ }); ++ ++ }); ++ ++ } ++ ++ resolveSourceItems() { ++ Promise.all( ++ this.props.sourceItems.map((sourceItem) => Promise.resolve(sourceItem)) ++ ).then( ++ action((results) => { ++ this.sourceItems = filterOutUndefined(results); ++ }) ++ ); ++ } ++ ++ componentDidMount() { ++ this.resolveSourceItems(); ++ } ++ ++ componentDidUpdate(prevProps: PropsType) { ++ if (this.props.sourceItems !== prevProps.sourceItems) { ++ this.resolveSourceItems(); ++ } ++ } ++ ++ render() { ++ if (this.sourceItems.length === 0) { ++ return null; ++ } ++ ++ // The downloads and download names default to the sources and source names if not defined. ++ let downloads: string[] = filterOutUndefined( ++ this.props.downloads || ++ this.sourceItems.map((item) => ++ hasTraits(item, UrlTraits, "url") ? item.url : undefined ++ ) ++ ); ++ ++ const { sourceNames, canDownload, raiseToTitle, t } = this.props; ++ if (sourceNames && sourceNames.length > 0) { ++ const downloadNames = this.props.downloadNames || sourceNames; ++ ++ return ( ++ ({ ++ name, ++ href: downloads[i] ++ }))} ++ onExpand={this.expandDropdown} ++ raiseToTitle={raiseToTitle} ++ t={t} ++ /> ++ ); ++ } ++ ++ return ( ++ 0 ? downloads[0] : undefined ++ } ++ t={t} ++ /> ++ ); ++ } ++} ++ ++const ExpandAndDownloadDropdowns = function (props: { ++ sourceNames: string[]; ++ canDownload: boolean; ++ downloads: { name: string; href: string }[]; ++ onExpand: (_: unknown, selectedIndex: number) => void; ++ raiseToTitle: boolean; ++ t: TFunction; ++}) { ++ const expandDropdownTheme = { ++ dropdown: Styles.dropdown, ++ list: Styles.dropdownList, ++ button: Styles.dropdownBtn, ++ btnOption: Styles.dropdownBtnOption ++ }; ++ ++ const downloadDropdownTheme = { ++ ...expandDropdownTheme, ++ button: classNames(Styles.btnSmall, Styles.btnDownload) ++ }; ++ ++ return ( ++
++
++ ({ name }))} ++ theme={expandDropdownTheme} ++ > ++ {props.t("chart.expand") + " ▾"} ++ ++ {props.canDownload && ( ++ ++ {props.t("chart.download") + " ▾"} ++ ++ )} ++
++
++ ); ++}; ++ ++const ExpandAndDownloadButtons = function (props: { ++ onExpand: () => void; ++ downloadUrl?: string; ++ t: TFunction; ++}) { ++ const { drawerIsOpen, openDrawer }: any = useLayout(); ++ const { setCurrentTabIndex }: any = useLayers(); ++ useEffect(() => { ++ if (drawerIsOpen == false) { ++ openDrawer() ++ } ++ setCurrentTabIndex(1) ++ },[]); ++ props.onExpand() ++ ++ return ( ++
++ ++ {props.downloadUrl && ( ++ ++ ++ ++ )} ++
++ ); ++}; ++ ++export default withTranslation()(ChartExpandAndDownloadButtons); diff --git a/node_modules/terriajs/lib/ReactViews/Custom/Chart/ChartExpandAndDownloadButtons.tsx b/node_modules/terriajs/lib/ReactViews/Custom/Chart/ChartExpandAndDownloadButtons.tsx -index f33bf94..834025a 100644 +index f33bf94..0ebb427 100644 --- a/node_modules/terriajs/lib/ReactViews/Custom/Chart/ChartExpandAndDownloadButtons.tsx +++ b/node_modules/terriajs/lib/ReactViews/Custom/Chart/ChartExpandAndDownloadButtons.tsx @@ -2,7 +2,7 @@ import classNames from "classnames"; @@ -115,79 +364,193 @@ index f33bf94..834025a 100644 import { WithTranslation, withTranslation } from "react-i18next"; import filterOutUndefined from "../../../Core/filterOutUndefined"; import ChartableMixin from "../../../ModelMixins/ChartableMixin"; -@@ -11,6 +11,10 @@ import Terria from "../../../Models/Terria"; +@@ -11,9 +11,10 @@ import Terria from "../../../Models/Terria"; import Icon from "../../../Styled/Icon"; import UrlTraits from "../../../Traits/TraitsClasses/UrlTraits"; import Styles from "./chart-expand-and-download-buttons.scss"; -+import {useLayout} from "../../../../../../lib/custom-ui/components/layout"; -+import {useLayers} from "../../../../../../lib/custom-ui/context"; -+ -+ - +- ++import { useLayout } from "../../../../../../lib/custom-ui/components/layout"; ++import { useLayers } from "../../../../../../lib/custom-ui/context"; ++import { useViewState } from "terriajs/lib/ReactViews/StandardUserInterface/ViewStateContext"; const Dropdown = require("../../Generic/Dropdown"); - -@@ -29,6 +33,7 @@ interface PropsType extends WithTranslation { +- + interface PropsType extends WithTranslation { + terria: Terria; + sourceItems: Promise[]; // Array of items or Promise returning item +@@ -24,21 +25,17 @@ interface PropsType extends WithTranslation { + raiseToTitle: boolean; + t: TFunction; + } +- + @observer class ChartExpandAndDownloadButtons extends React.Component { @observable sourceItems: ChartableMixin.Instance[] = []; - -+ +- @action.bound private expandButton() { this.expandItem(this.sourceItems.length - 1); -@@ -66,11 +71,28 @@ class ChartExpandAndDownloadButtons extends React.Component { + } +- + @action.bound + private expandDropdown(_selected: unknown, sourceIndex: number) { + this.expandItem(sourceIndex); + } +- + /** + * Expand sourceIndex item by adding it to the workbench. + * +@@ -47,7 +44,6 @@ class ChartExpandAndDownloadButtons extends React.Component { + */ + private expandItem(sourceIndex: number) { + const terria = this.props.terria; +- + runInAction(async () => { + const sourceItems = this.sourceItems; + const itemToExpand = sourceItems[sourceIndex]; +@@ -55,7 +51,6 @@ class ChartExpandAndDownloadButtons extends React.Component { + if (!itemToExpand) { + return; + } +- + // We want to show only one source item at a time, so remove any + // existing source items from the workbench + sourceItems.forEach((sourceItem) => { +@@ -65,14 +60,24 @@ class ChartExpandAndDownloadButtons extends React.Component { + } }); }); - -+ +- try { terria.addModel(itemToExpand); - } catch {} +- } catch {} ++ } catch { } (await workbench.add(itemToExpand)).raiseError(terria, undefined, true); + workbench.items.map((layer) => { + type Wbench = { -+ [key: string]: any; // 👈️ variable key ++ [key: string]: any; // :point_left:️ variable key + }; -+ + const obj: Wbench = {}; -+ + obj.layer = layer; + if (obj.layer.chartItems.length > 0) { -+ obj.layer.chartItems.map((item: {updateIsSelectedInWorkbench: (a: boolean) => void}) => { ++ obj.layer.chartItems.map((item: { updateIsSelectedInWorkbench: (a: boolean) => void }) => { + item.updateIsSelectedInWorkbench(true); + }); + } + }); -+ }); -+ } - +- resolveSourceItems() { -@@ -109,6 +131,7 @@ class ChartExpandAndDownloadButtons extends React.Component { + Promise.all( + this.props.sourceItems.map((sourceItem) => Promise.resolve(sourceItem)) +@@ -82,30 +87,25 @@ class ChartExpandAndDownloadButtons extends React.Component { + }) + ); + } +- + componentDidMount() { + this.resolveSourceItems(); + } +- + componentDidUpdate(prevProps: PropsType) { + if (this.props.sourceItems !== prevProps.sourceItems) { + this.resolveSourceItems(); + } + } +- + render() { + if (this.sourceItems.length === 0) { + return null; + } +- + // The downloads and download names default to the sources and source names if not defined. + let downloads: string[] = filterOutUndefined( + this.props.downloads || +- this.sourceItems.map((item) => +- hasTraits(item, UrlTraits, "url") ? item.url : undefined +- ) ++ this.sourceItems.map((item) => ++ hasTraits(item, UrlTraits, "url") ? item.url : undefined ++ ) + ); +- const { sourceNames, canDownload, raiseToTitle, t } = this.props; if (sourceNames && sourceNames.length > 0) { const downloadNames = this.props.downloadNames || sourceNames; -+ - return ( - { + /> + ); + } +- + return ( + { + ); + } + } +- + const ExpandAndDownloadDropdowns = function (props: { + sourceNames: string[]; + canDownload: boolean; +@@ -150,12 +148,10 @@ const ExpandAndDownloadDropdowns = function (props: { + button: Styles.dropdownBtn, + btnOption: Styles.dropdownBtnOption + }; +- + const downloadDropdownTheme = { + ...expandDropdownTheme, + button: classNames(Styles.btnSmall, Styles.btnDownload) + }; +- + return ( +
+ ); + }; +- + const ExpandAndDownloadButtons = function (props: { + onExpand: () => void; downloadUrl?: string; t: TFunction; }) { + const { drawerIsOpen, openDrawer }: any = useLayout(); -+ const { setCurrentTabIndex }: any = useLayers(); ++ const viewState = useViewState(); ++ const { activatedLayer, ++ currentTabIndex, ++ setActivatedLayer, ++ setCurrentTabIndex }: any = useLayers(); + useEffect(() => { + if (drawerIsOpen == false) { ++ setActivatedLayer(viewState.terria.workbench.items[0]) + openDrawer() ++ } else { ++ setActivatedLayer(viewState.terria.workbench.items[0]) + } -+ setCurrentTabIndex(1) -+ },[]); ++ if (currentTabIndex == 0) { ++ setCurrentTabIndex(2) ++ setTimeout(function afterTwoSeconds() { ++ setCurrentTabIndex(1) ++ }, 100) ++ } else { ++ setCurrentTabIndex(0) ++ setTimeout(function afterTwoSeconds() { ++ setCurrentTabIndex(1) ++ }, 100) ++ } ++ }, []); + props.onExpand() -+ return (