From e99398ceabffbda31be60020bc04abe854649831 Mon Sep 17 00:00:00 2001 From: Lachlan Kermode Date: Tue, 19 Jan 2021 22:22:12 +0100 Subject: [PATCH] Cleaning technical debt (#192) * abstract Space component to switch out Map * basic viewing possible * restructure components dir * all jsx --> js * App.jsx --> App.js * comment out 3d for now --- config/webpack.config.js | 4 +- src/components/{App.jsx => App.js} | 0 src/components/Card.jsx | 158 ------------------ src/components/Icon.jsx | 145 ---------------- .../{InfoPopup.jsx => InfoPopup.js} | 2 +- src/components/Layout.js | 40 ++--- .../{Notification.jsx => Notification.js} | 0 src/components/StateOptions.jsx | 30 ---- src/components/TemplateCover.js | 2 +- .../{Toolbar/Layout.js => Toolbar.js} | 14 +- src/components/Toolbar/SelectFilter.js | 80 --------- .../{presentational => atoms}/Checkbox.js | 0 .../Icons => atoms}/CoeventIcon.js | 0 .../ColoredMarkers.js} | 2 +- src/components/{Overlay => atoms}/Content.js | 4 +- src/components/{Overlay => atoms}/Controls.js | 0 .../Icons/Cover.js => atoms/CoverIcon.js} | 0 .../Icons/Info.js => atoms/InfoIcon.js} | 0 src/components/{Overlay => atoms}/Loading.js | 0 src/components/{Overlay => atoms}/Md.js | 0 src/components/{Overlay => atoms}/Media.js | 0 .../{presentational => atoms}/NoSource.js | 0 .../{presentational => atoms}/Popup.js | 0 .../Icons => atoms}/RefreshIcon.js | 0 .../Icons => atoms}/RouteIcon.js | 0 .../Icons/Sites.js => atoms/SitesIcon.js} | 0 .../{presentational => atoms}/Spinner.js | 0 src/components/{ => atoms}/StaticPage.js | 0 .../{Toolbar => controls}/BottomActions.js | 6 +- .../{CardStack.jsx => controls/CardStack.js} | 7 +- .../CategoriesListPanel.js | 2 +- .../{Toolbar => controls}/FilterListPanel.js | 2 +- .../NarrativeControls.js} | 6 +- .../{Search.jsx => controls/Search.js} | 6 +- .../atoms/NarrativeAdjust.js} | 0 .../atoms/NarrativeCard.js} | 0 .../atoms/NarrativeClose.js} | 0 .../{ => controls/atoms}/SearchRow.jsx | 0 src/components/presentational/.DS_Store | Bin 6148 -> 0 bytes src/components/presentational/Card/Caret.js | 15 -- .../presentational/Card/Category.js | 15 -- .../presentational/Card/CustomField.js | 14 -- .../presentational/Card/Location.js | 28 ---- src/components/presentational/Card/Source.js | 79 --------- src/components/presentational/Card/Summary.js | 18 -- src/components/presentational/Card/Time.js | 33 ---- src/components/space/Space.js | 14 ++ .../{Map.jsx => space/carto/Map.js} | 23 ++- .../carto/atoms/Clusters.js} | 6 +- .../carto/atoms/DefsMarkers.js} | 0 .../carto/atoms/Events.js} | 6 +- .../Map => space/carto/atoms}/Narratives.js | 0 .../carto/atoms/SelectedEvents.js} | 2 +- .../carto/atoms/Shapes.js} | 0 .../Sites.jsx => space/carto/atoms/Sites.js} | 0 .../{TimelineAxis.jsx => time/Axis.js} | 2 +- .../Categories.js} | 0 .../{Timeline.jsx => time/Timeline.js} | 23 +-- .../Timeline => time/atoms}/Clip.js | 0 .../Timeline => time/atoms}/DatetimeBar.js | 0 .../Timeline => time/atoms}/DatetimeDot.js | 0 .../Timeline => time/atoms}/DatetimeSquare.js | 0 .../Timeline => time/atoms}/DatetimeStar.js | 0 .../Timeline => time/atoms}/Events.js | 2 +- .../Timeline => time/atoms}/Handles.js | 0 .../Timeline => time/atoms}/Header.js | 0 .../Timeline => time/atoms}/Labels.js | 0 .../Timeline => time/atoms}/Markers.js | 0 .../Timeline => time/atoms}/Project.js | 0 .../Timeline => time/atoms}/ZoomControls.js | 0 src/index.jsx | 4 +- src/reducers/validate/eventSchema.js | 9 +- src/scss/main.scss | 2 +- src/scss/stateoptions.scss | 28 ---- src/store/initial.js | 33 ++-- 75 files changed, 121 insertions(+), 745 deletions(-) rename src/components/{App.jsx => App.js} (100%) delete mode 100644 src/components/Card.jsx delete mode 100644 src/components/Icon.jsx rename src/components/{InfoPopup.jsx => InfoPopup.js} (88%) rename src/components/{Notification.jsx => Notification.js} (100%) delete mode 100644 src/components/StateOptions.jsx rename src/components/{Toolbar/Layout.js => Toolbar.js} (96%) delete mode 100644 src/components/Toolbar/SelectFilter.js rename src/components/{presentational => atoms}/Checkbox.js (100%) rename src/components/{presentational/Icons => atoms}/CoeventIcon.js (100%) rename src/components/{presentational/Map/ColoredMarkers.jsx => atoms/ColoredMarkers.js} (94%) rename src/components/{Overlay => atoms}/Content.js (96%) rename src/components/{Overlay => atoms}/Controls.js (100%) rename src/components/{presentational/Icons/Cover.js => atoms/CoverIcon.js} (100%) rename src/components/{presentational/Icons/Info.js => atoms/InfoIcon.js} (100%) rename src/components/{Overlay => atoms}/Loading.js (100%) rename src/components/{Overlay => atoms}/Md.js (100%) rename src/components/{Overlay => atoms}/Media.js (100%) rename src/components/{presentational => atoms}/NoSource.js (100%) rename src/components/{presentational => atoms}/Popup.js (100%) rename src/components/{presentational/Icons => atoms}/RefreshIcon.js (100%) rename src/components/{presentational/Icons => atoms}/RouteIcon.js (100%) rename src/components/{presentational/Icons/Sites.js => atoms/SitesIcon.js} (100%) rename src/components/{presentational => atoms}/Spinner.js (100%) rename src/components/{ => atoms}/StaticPage.js (100%) rename src/components/{Toolbar => controls}/BottomActions.js (84%) rename src/components/{CardStack.jsx => controls/CardStack.js} (96%) rename src/components/{Toolbar => controls}/CategoriesListPanel.js (95%) rename src/components/{Toolbar => controls}/FilterListPanel.js (98%) rename src/components/{presentational/Narrative/Controls.js => controls/NarrativeControls.js} (84%) rename src/components/{Search.jsx => controls/Search.js} (95%) rename src/components/{presentational/Narrative/Adjust.js => controls/atoms/NarrativeAdjust.js} (100%) rename src/components/{presentational/Narrative/Card.js => controls/atoms/NarrativeCard.js} (100%) rename src/components/{presentational/Narrative/Close.js => controls/atoms/NarrativeClose.js} (100%) rename src/components/{ => controls/atoms}/SearchRow.jsx (100%) delete mode 100644 src/components/presentational/.DS_Store delete mode 100644 src/components/presentational/Card/Caret.js delete mode 100644 src/components/presentational/Card/Category.js delete mode 100644 src/components/presentational/Card/CustomField.js delete mode 100644 src/components/presentational/Card/Location.js delete mode 100644 src/components/presentational/Card/Source.js delete mode 100644 src/components/presentational/Card/Summary.js delete mode 100644 src/components/presentational/Card/Time.js create mode 100644 src/components/space/Space.js rename src/components/{Map.jsx => space/carto/Map.js} (96%) rename src/components/{presentational/Map/Clusters.jsx => space/carto/atoms/Clusters.js} (96%) rename src/components/{presentational/Map/DefsMarkers.jsx => space/carto/atoms/DefsMarkers.js} (100%) rename src/components/{presentational/Map/Events.jsx => space/carto/atoms/Events.js} (97%) rename src/components/{presentational/Map => space/carto/atoms}/Narratives.js (100%) rename src/components/{presentational/Map/SelectedEvents.jsx => space/carto/atoms/SelectedEvents.js} (95%) rename src/components/{presentational/Map/Shapes.jsx => space/carto/atoms/Shapes.js} (100%) rename src/components/{presentational/Map/Sites.jsx => space/carto/atoms/Sites.js} (100%) rename src/components/{TimelineAxis.jsx => time/Axis.js} (97%) rename src/components/{TimelineCategories.jsx => time/Categories.js} (100%) rename src/components/{Timeline.jsx => time/Timeline.js} (96%) rename src/components/{presentational/Timeline => time/atoms}/Clip.js (100%) rename src/components/{presentational/Timeline => time/atoms}/DatetimeBar.js (100%) rename src/components/{presentational/Timeline => time/atoms}/DatetimeDot.js (100%) rename src/components/{presentational/Timeline => time/atoms}/DatetimeSquare.js (100%) rename src/components/{presentational/Timeline => time/atoms}/DatetimeStar.js (100%) rename src/components/{presentational/Timeline => time/atoms}/Events.js (98%) rename src/components/{presentational/Timeline => time/atoms}/Handles.js (100%) rename src/components/{presentational/Timeline => time/atoms}/Header.js (100%) rename src/components/{presentational/Timeline => time/atoms}/Labels.js (100%) rename src/components/{presentational/Timeline => time/atoms}/Markers.js (100%) rename src/components/{presentational/Timeline => time/atoms}/Project.js (100%) rename src/components/{presentational/Timeline => time/atoms}/ZoomControls.js (100%) delete mode 100644 src/scss/stateoptions.scss diff --git a/config/webpack.config.js b/config/webpack.config.js index 3b9e661..45e05f9 100644 --- a/config/webpack.config.js +++ b/config/webpack.config.js @@ -404,7 +404,7 @@ module.exports = function (webpackEnv) { }, ], ], - + plugins: [ [ require.resolve('babel-plugin-named-asset-import'), @@ -449,7 +449,7 @@ module.exports = function (webpackEnv) { cacheDirectory: true, // See #6846 for context on why cacheCompression is disabled cacheCompression: false, - + // Babel sourcemaps are needed for debugging into node_modules // code. Without the options below, debuggers like VSCode // show incorrect code and set breakpoints on the wrong lines. diff --git a/src/components/App.jsx b/src/components/App.js similarity index 100% rename from src/components/App.jsx rename to src/components/App.js diff --git a/src/components/Card.jsx b/src/components/Card.jsx deleted file mode 100644 index 8eb4533..0000000 --- a/src/components/Card.jsx +++ /dev/null @@ -1,158 +0,0 @@ -import copy from "../common/data/copy.json"; -import React from "react"; - -import CardCustomField from "./presentational/Card/CustomField"; -import CardTime from "./presentational/Card/Time"; -import CardLocation from "./presentational/Card/Location"; -import CardCaret from "./presentational/Card/Caret"; -import CardSummary from "./presentational/Card/Summary"; -import CardSource from "./presentational/Card/Source"; -import { makeNiceDate } from "../common/utilities"; - -class Card extends React.Component { - constructor(props) { - super(props); - this.state = { - isOpen: false, - }; - } - - toggle() { - this.setState({ - isOpen: !this.state.isOpen, - }); - } - - makeTimelabel(datetime) { - return makeNiceDate(datetime); - } - - handleCardSelect(e) { - if (!e.target.className.includes("arrow-down")) { - const selectedEventFormat = - this.props.idx > 0 ? [this.props.event] : this.props.event; - this.props.onSelect(selectedEventFormat, this.props.idx); - } - } - - renderSummary() { - return ( - - ); - } - - renderLocation() { - return ( - - ); - } - - renderSources() { - if (this.props.sourceError) { - return
ERROR: something went wrong loading sources, TODO:
; - } - - const sourceLang = copy[this.props.language].cardstack.sources; - return ( -
-

{sourceLang}:

- {this.props.event.sources.map((source) => ( - this.props.onViewSource(source)} - /> - ))} -
- ); - } - - // NB: should be internaionalized. - renderTime() { - const timelabel = this.makeTimelabel(this.props.event.datetime); - - // let precision = this.props.event.time_display - // if (precision === '_date_only') { - // precision = '' - // timelabel = timelabel.substring(0, 11) - // } else if (precision === '_approximate_date_only') { - // precision = ' (Approximate date)' - // timelabel = timelabel.substring(0, 11) - // } else if (precision === '_approximate_datetime') { - // precision = ' (Approximate datetime)' - // } else { - // timelabel = timelabel.substring(0, 11) - // } - - return ( - - ); - } - - renderCustomFields() { - return this.props.features.CUSTOM_EVENT_FIELDS.map((field) => { - const value = this.props.event[field.key]; - return value ? ( - - ) : null; - }); - } - - renderMain() { - return ( -
-
- {this.renderTime()} - {this.renderLocation()} -
- {this.renderSummary()} - {this.renderCustomFields()} -
- ); - } - - renderExtra() { - return
{this.renderSources()}
; - } - - renderCaret() { - return this.props.features.USE_SOURCES ? ( - this.toggle()} isOpen={this.state.isOpen} /> - ) : null; - } - - render() { - const { isSelected, idx } = this.props; - return ( -
  • this.handleCardSelect(e)} - > - {this.renderMain()} - {this.state.isOpen ? this.renderExtra() : null} - {this.renderCaret()} -
    • - ); - } -} - -// The ref to each card will be used in CardStack for programmatic scrolling -export default React.forwardRef((props, ref) => ( - -)); diff --git a/src/components/Icon.jsx b/src/components/Icon.jsx deleted file mode 100644 index 956eb78..0000000 --- a/src/components/Icon.jsx +++ /dev/null @@ -1,145 +0,0 @@ -import React from "react"; - -const Icon = ({ iconType }) => { - if (iconType === "personas") { - return ( - - - - - - - - - - ); - } else if (iconType === "tipos") { - return ( - - - - - - ); - } else if (iconType === "hardware") { - return ( - - - - ); - } else if (iconType === "escenas") { - return ( - - - - - - ); - } else if (iconType === "docs") { - return ( - - - - - - - - - - - - ); - } else if (iconType === "search") { - return ( - - - - - ); - } -}; - -export default Icon; diff --git a/src/components/InfoPopup.jsx b/src/components/InfoPopup.js similarity index 88% rename from src/components/InfoPopup.jsx rename to src/components/InfoPopup.js index 5c1d73f..8d32e0b 100644 --- a/src/components/InfoPopup.jsx +++ b/src/components/InfoPopup.js @@ -1,5 +1,5 @@ import React from "react"; -import Popup from "./presentational/Popup"; +import Popup from "./atoms/Popup"; import copy from "../common/data/copy.json"; const Infopopup = ({ isOpen, onClose, language, styles }) => ( diff --git a/src/components/Layout.js b/src/components/Layout.js index 9c37d0d..53ee5a9 100644 --- a/src/components/Layout.js +++ b/src/components/Layout.js @@ -5,24 +5,25 @@ import { connect } from "react-redux"; import * as actions from "../actions"; import * as selectors from "../selectors"; -import MediaOverlay from "./Overlay/Media"; -import LoadingOverlay from "./Overlay/Loading"; -import Map from "./Map.jsx"; -import Toolbar from "./Toolbar/Layout"; -import CardStack from "./CardStack.jsx"; -import NarrativeControls from "./presentational/Narrative/Controls.js"; -import InfoPopup from "./InfoPopup.jsx"; -import Popup from "./presentational/Popup"; -import Timeline from "./Timeline.jsx"; -import Notification from "./Notification.jsx"; -import StateOptions from "./StateOptions.jsx"; -import StaticPage from "./StaticPage"; +import Toolbar from "./Toolbar"; +import InfoPopup from "./InfoPopup"; +import Notification from "./Notification"; import TemplateCover from "./TemplateCover"; +import Popup from "./atoms/Popup"; +import StaticPage from "./atoms/StaticPage"; +import MediaOverlay from "./atoms/Media"; +import LoadingOverlay from "./atoms/Loading"; + +import Timeline from "./time/Timeline"; +import Space from "./space/Space"; +import Search from "./controls/Search"; +import CardStack from "./controls/CardStack"; +import NarrativeControls from "./controls/NarrativeControls.js"; + import colors from "../common/global"; import { binarySearch, insetSourceFrom } from "../common/utilities"; import { isMobileOnly } from "react-device-detect"; -import Search from "./Search.jsx"; class Dashboard extends React.Component { constructor(props) { @@ -329,7 +330,8 @@ class Dashboard extends React.Component { onSelectNarrative: this.setNarrative, }} /> - actions.updateSelected([])} getCategoryColor={this.getCategoryColor} /> - 0 - } - timelineDims={app.timeline.dimensions} - onClickHandler={this.setNarrativeFromFilters} - /> { - const [checked, setChecked] = useState(false); - const handleCheck = () => setChecked(!checked); - const onNarrativise = () => onClickHandler(checked); - - if (!showing) { - return null; - } - - return ( -
    -
    -
    - Narrativise -
    - - -
    -
    - ); -}; - -export default StateOptions; diff --git a/src/components/TemplateCover.js b/src/components/TemplateCover.js index 36c6cee..c142128 100644 --- a/src/components/TemplateCover.js +++ b/src/components/TemplateCover.js @@ -2,7 +2,7 @@ import React from "react"; import { connect } from "react-redux"; import { Player } from "video-react"; import marked from "marked"; -import MediaOverlay from "./Overlay/Media"; +import MediaOverlay from "./atoms/Media"; import falogo from "../assets/fa-logo.png"; import bcatlogo from "../assets/bellingcat-logo.png"; const MEDIA_HIDDEN = -2; diff --git a/src/components/Toolbar/Layout.js b/src/components/Toolbar.js similarity index 96% rename from src/components/Toolbar/Layout.js rename to src/components/Toolbar.js index 72958c7..3435cfa 100644 --- a/src/components/Toolbar/Layout.js +++ b/src/components/Toolbar.js @@ -1,20 +1,20 @@ import React from "react"; import { connect } from "react-redux"; import { bindActionCreators } from "redux"; -import * as actions from "../../actions"; -import * as selectors from "../../selectors"; +import * as actions from "../actions"; +import * as selectors from "../selectors"; import { Tabs, TabPanel } from "react-tabs"; -import FilterListPanel from "./FilterListPanel"; -import CategoriesListPanel from "./CategoriesListPanel"; -import BottomActions from "./BottomActions"; -import copy from "../../common/data/copy.json"; +import FilterListPanel from "./controls/FilterListPanel"; +import CategoriesListPanel from "./controls/CategoriesListPanel"; +import BottomActions from "./controls/BottomActions"; +import copy from "../common/data/copy.json"; import { trimAndEllipse, getImmediateFilterParent, getFilterSiblings, getFilterParents, -} from "../../common/utilities.js"; +} from "../common/utilities.js"; class Toolbar extends React.Component { constructor(props) { diff --git a/src/components/Toolbar/SelectFilter.js b/src/components/Toolbar/SelectFilter.js deleted file mode 100644 index 3bc93e0..0000000 --- a/src/components/Toolbar/SelectFilter.js +++ /dev/null @@ -1,80 +0,0 @@ -import React from "react"; -import Checkbox from "../presentational/Checkbox"; - -function SelectFilter(props) { - function isActive() { - if (props.isCategory) { - return props.categoryFilters.includes(props.filter.id); - } - return props.filterFilters.includes(props.filter.id); - } - - function onClickFilter() { - if (isActive()) { - props.filter({ - filters: props.filterFilters.filter( - (element) => element !== props.filter.id - ), - }); - } else { - props.filter({ - filters: props.filterFilters.concat(props.filter.id), - }); - } - } - - function onClickCategory() { - if (isActive()) { - props.filter({ - categories: props.categoryFilters.filter( - (element) => element !== props.filter.id - ), - }); - } else { - props.filter({ - categories: props.categoryFilters.concat(props.filter.id), - }); - } - } - - function renderFilter() { - const filter = props.filter; - const classes = isActive() ? "filter-filter active" : "filter-filter"; - let label = `${filter.name} ( ${filter.mentions} )`; - if (props.isShowTree) { - label = `${filter.group} > ${filter.subgroup} > ${filter.name} ( ${filter.mentions} )`; - } - return ( -
  • - onClickFilter()} - /> -
    • - ); - } - - function renderCategory() { - const category = props.categories[props.filter.id]; - const classes = isActive() ? "filter-filter active" : "filter-filter"; - - if (category) { - return ( -
  • - -
    • - ); - } - return
    ; - } - - if (props.isCategory) return renderCategory(); - return renderFilter(); -} - -export default SelectFilter; diff --git a/src/components/presentational/Checkbox.js b/src/components/atoms/Checkbox.js similarity index 100% rename from src/components/presentational/Checkbox.js rename to src/components/atoms/Checkbox.js diff --git a/src/components/presentational/Icons/CoeventIcon.js b/src/components/atoms/CoeventIcon.js similarity index 100% rename from src/components/presentational/Icons/CoeventIcon.js rename to src/components/atoms/CoeventIcon.js diff --git a/src/components/presentational/Map/ColoredMarkers.jsx b/src/components/atoms/ColoredMarkers.js similarity index 94% rename from src/components/presentational/Map/ColoredMarkers.jsx rename to src/components/atoms/ColoredMarkers.js index 9ce4772..b3cce88 100644 --- a/src/components/presentational/Map/ColoredMarkers.jsx +++ b/src/components/atoms/ColoredMarkers.js @@ -1,5 +1,5 @@ import React from "react"; -import { getCoordinatesForPercent } from "../../../common/utilities"; +import { getCoordinatesForPercent } from "../../common/utilities"; function ColoredMarkers({ radius, colorPercentMap, styles, className }) { let cumulativeAngleSweep = 0; diff --git a/src/components/Overlay/Content.js b/src/components/atoms/Content.js similarity index 96% rename from src/components/Overlay/Content.js rename to src/components/atoms/Content.js index 19f81eb..49e2289 100644 --- a/src/components/Overlay/Content.js +++ b/src/components/atoms/Content.js @@ -2,8 +2,8 @@ import React from "react"; import { Player } from "video-react"; import Img from "react-image"; import Md from "./Md"; -import Spinner from "../presentational/Spinner"; -import NoSource from "../presentational/NoSource"; +import Spinner from "../atoms/Spinner"; +import NoSource from "../atoms/NoSource"; const Content = ({ media, viewIdx, translations, switchLanguage, langIdx }) => { const el = document.querySelector(".source-media-gallery"); diff --git a/src/components/Overlay/Controls.js b/src/components/atoms/Controls.js similarity index 100% rename from src/components/Overlay/Controls.js rename to src/components/atoms/Controls.js diff --git a/src/components/presentational/Icons/Cover.js b/src/components/atoms/CoverIcon.js similarity index 100% rename from src/components/presentational/Icons/Cover.js rename to src/components/atoms/CoverIcon.js diff --git a/src/components/presentational/Icons/Info.js b/src/components/atoms/InfoIcon.js similarity index 100% rename from src/components/presentational/Icons/Info.js rename to src/components/atoms/InfoIcon.js diff --git a/src/components/Overlay/Loading.js b/src/components/atoms/Loading.js similarity index 100% rename from src/components/Overlay/Loading.js rename to src/components/atoms/Loading.js diff --git a/src/components/Overlay/Md.js b/src/components/atoms/Md.js similarity index 100% rename from src/components/Overlay/Md.js rename to src/components/atoms/Md.js diff --git a/src/components/Overlay/Media.js b/src/components/atoms/Media.js similarity index 100% rename from src/components/Overlay/Media.js rename to src/components/atoms/Media.js diff --git a/src/components/presentational/NoSource.js b/src/components/atoms/NoSource.js similarity index 100% rename from src/components/presentational/NoSource.js rename to src/components/atoms/NoSource.js diff --git a/src/components/presentational/Popup.js b/src/components/atoms/Popup.js similarity index 100% rename from src/components/presentational/Popup.js rename to src/components/atoms/Popup.js diff --git a/src/components/presentational/Icons/RefreshIcon.js b/src/components/atoms/RefreshIcon.js similarity index 100% rename from src/components/presentational/Icons/RefreshIcon.js rename to src/components/atoms/RefreshIcon.js diff --git a/src/components/presentational/Icons/RouteIcon.js b/src/components/atoms/RouteIcon.js similarity index 100% rename from src/components/presentational/Icons/RouteIcon.js rename to src/components/atoms/RouteIcon.js diff --git a/src/components/presentational/Icons/Sites.js b/src/components/atoms/SitesIcon.js similarity index 100% rename from src/components/presentational/Icons/Sites.js rename to src/components/atoms/SitesIcon.js diff --git a/src/components/presentational/Spinner.js b/src/components/atoms/Spinner.js similarity index 100% rename from src/components/presentational/Spinner.js rename to src/components/atoms/Spinner.js diff --git a/src/components/StaticPage.js b/src/components/atoms/StaticPage.js similarity index 100% rename from src/components/StaticPage.js rename to src/components/atoms/StaticPage.js diff --git a/src/components/Toolbar/BottomActions.js b/src/components/controls/BottomActions.js similarity index 84% rename from src/components/Toolbar/BottomActions.js rename to src/components/controls/BottomActions.js index cc8fa4a..c11ad9e 100644 --- a/src/components/Toolbar/BottomActions.js +++ b/src/components/controls/BottomActions.js @@ -1,8 +1,8 @@ import React from "react"; -import SitesIcon from "../presentational/Icons/Sites"; -import CoverIcon from "../presentational/Icons/Cover"; -import InfoIcon from "../presentational/Icons/Info"; +import SitesIcon from "../atoms/SitesIcon"; +import CoverIcon from "../atoms/CoverIcon"; +import InfoIcon from "../atoms/InfoIcon"; function BottomActions(props) { function renderToggles() { diff --git a/src/components/CardStack.jsx b/src/components/controls/CardStack.js similarity index 96% rename from src/components/CardStack.jsx rename to src/components/controls/CardStack.js index e72ebe9..b8c8a86 100644 --- a/src/components/CardStack.jsx +++ b/src/components/controls/CardStack.js @@ -5,10 +5,9 @@ import { generateCardLayout, } from "@forensic-architecture/design-system/dist/react"; -import * as selectors from "../selectors"; -import { getFilterIdxFromColorSet } from "../common/utilities"; -// import Card from './Card.jsx' -import copy from "../common/data/copy.json"; +import * as selectors from "../../selectors"; +import { getFilterIdxFromColorSet } from "../../common/utilities"; +import copy from "../../common/data/copy.json"; class CardStack extends React.Component { constructor() { diff --git a/src/components/Toolbar/CategoriesListPanel.js b/src/components/controls/CategoriesListPanel.js similarity index 95% rename from src/components/Toolbar/CategoriesListPanel.js rename to src/components/controls/CategoriesListPanel.js index 5d60a6a..f5e0054 100644 --- a/src/components/Toolbar/CategoriesListPanel.js +++ b/src/components/controls/CategoriesListPanel.js @@ -1,6 +1,6 @@ import React from "react"; import marked from "marked"; -import Checkbox from "../presentational/Checkbox"; +import Checkbox from "../atoms/Checkbox"; import copy from "../../common/data/copy.json"; const CategoriesListPanel = ({ diff --git a/src/components/Toolbar/FilterListPanel.js b/src/components/controls/FilterListPanel.js similarity index 98% rename from src/components/Toolbar/FilterListPanel.js rename to src/components/controls/FilterListPanel.js index 3f8dec4..238f0bc 100644 --- a/src/components/Toolbar/FilterListPanel.js +++ b/src/components/controls/FilterListPanel.js @@ -1,5 +1,5 @@ import React from "react"; -import Checkbox from "../presentational/Checkbox"; +import Checkbox from "../atoms/Checkbox"; import marked from "marked"; import copy from "../../common/data/copy.json"; import { getFilterIdxFromColorSet } from "../../common/utilities"; diff --git a/src/components/presentational/Narrative/Controls.js b/src/components/controls/NarrativeControls.js similarity index 84% rename from src/components/presentational/Narrative/Controls.js rename to src/components/controls/NarrativeControls.js index 0073f6a..1c2b552 100644 --- a/src/components/presentational/Narrative/Controls.js +++ b/src/components/controls/NarrativeControls.js @@ -1,7 +1,7 @@ import React from "react"; -import Card from "./Card"; -import Adjust from "./Adjust"; -import Close from "./Close"; +import Card from "./atoms/NarrativeCard"; +import Adjust from "./atoms/NarrativeAdjust"; +import Close from "./atoms/NarrativeClose"; const NarrativeControls = ({ narrative, methods }) => { if (!narrative) return null; diff --git a/src/components/Search.jsx b/src/components/controls/Search.js similarity index 95% rename from src/components/Search.jsx rename to src/components/controls/Search.js index 731c04d..7bd554c 100644 --- a/src/components/Search.jsx +++ b/src/components/controls/Search.js @@ -2,11 +2,9 @@ import React from "react"; import { bindActionCreators } from "redux"; import { connect } from "react-redux"; -import * as actions from "../actions"; +import * as actions from "../../actions"; -import "../scss/search.scss"; - -import SearchRow from "./SearchRow.jsx"; +import SearchRow from "./atoms/SearchRow.jsx"; class Search extends React.Component { constructor(props) { diff --git a/src/components/presentational/Narrative/Adjust.js b/src/components/controls/atoms/NarrativeAdjust.js similarity index 100% rename from src/components/presentational/Narrative/Adjust.js rename to src/components/controls/atoms/NarrativeAdjust.js diff --git a/src/components/presentational/Narrative/Card.js b/src/components/controls/atoms/NarrativeCard.js similarity index 100% rename from src/components/presentational/Narrative/Card.js rename to src/components/controls/atoms/NarrativeCard.js diff --git a/src/components/presentational/Narrative/Close.js b/src/components/controls/atoms/NarrativeClose.js similarity index 100% rename from src/components/presentational/Narrative/Close.js rename to src/components/controls/atoms/NarrativeClose.js diff --git a/src/components/SearchRow.jsx b/src/components/controls/atoms/SearchRow.jsx similarity index 100% rename from src/components/SearchRow.jsx rename to src/components/controls/atoms/SearchRow.jsx diff --git a/src/components/presentational/.DS_Store b/src/components/presentational/.DS_Store deleted file mode 100644 index 1e61c2573f391befc331f5146ef00e4f352b678a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 6148 zcmeHKu};G<5Ixfj0hUgP(ZA4*4XcC^mhu6hrfMq^8mblvvE&o@8h(J8ozLN&eYA<< ztO&uKboUb9o$vgl*f9~A@ire34T&g)GA2hb5n(@TM-F6!lMT;N%tw>ys;oMZI-m?F z1HX|0|KZaG-O-xz$oHFk`^r_8<=f4a=yP7Yyq#k)4PV~ts}`L-VL(@?S4FCcr&;U% zy)1hzY5{kZR_)`p+B%5SoEJ@DR&f@s2wa{BA3&+&~eF}^m g$Nqtj;!~&>_$)sFonRdhBM|)&@HD7V27Z)*FMIHPVE_OC diff --git a/src/components/presentational/Card/Caret.js b/src/components/presentational/Card/Caret.js deleted file mode 100644 index 0cc8ff2..0000000 --- a/src/components/presentational/Card/Caret.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from "react"; - -const CardCaret = ({ isOpen, toggle }) => { - const classes = isOpen ? "arrow-down" : "arrow-down folded"; - - return ( -
    -

    - -

    -
    - ); -}; - -export default CardCaret; diff --git a/src/components/presentational/Card/Category.js b/src/components/presentational/Card/Category.js deleted file mode 100644 index 0e50a9a..0000000 --- a/src/components/presentational/Card/Category.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from "react"; - -import { capitalize } from "../../../common/utilities.js"; - -const CardCategory = ({ categoryTitle, categoryLabel, color }) => ( -
    -

    {categoryTitle}

    -

    - {capitalize(categoryLabel)} - -

    -
    -); - -export default CardCategory; diff --git a/src/components/presentational/Card/CustomField.js b/src/components/presentational/Card/CustomField.js deleted file mode 100644 index 64184ce..0000000 --- a/src/components/presentational/Card/CustomField.js +++ /dev/null @@ -1,14 +0,0 @@ -import React from "react"; -import marked from "marked"; - -const CardCustomField = ({ field, value }) => ( -
    -

    - {field.icon} - {field.title ? `${field.title}: ` : "- "} - {field.kind === "text" ? value : marked(`[${value}](${field.value})`)} -

    -
    -); - -export default CardCustomField; diff --git a/src/components/presentational/Card/Location.js b/src/components/presentational/Card/Location.js deleted file mode 100644 index 5f7320d..0000000 --- a/src/components/presentational/Card/Location.js +++ /dev/null @@ -1,28 +0,0 @@ -import React from "react"; - -import copy from "../../../common/data/copy.json"; - -const CardLocation = ({ language, location, isPrecise }) => { - if (location !== "") { - return ( -
    -

    - location_on - {`${location}${isPrecise ? "" : " (Approximated)"}`} -

    -
    - ); - } else { - const unknown = copy[language].cardstack.unknown_location; - return ( -
    -

    - location_on - {unknown} -

    -
    - ); - } -}; - -export default CardLocation; diff --git a/src/components/presentational/Card/Source.js b/src/components/presentational/Card/Source.js deleted file mode 100644 index c45143a..0000000 --- a/src/components/presentational/Card/Source.js +++ /dev/null @@ -1,79 +0,0 @@ -import React from "react"; -import Img from "react-image"; -import Spinner from "../Spinner"; -import { typeForPath } from "../../../common/utilities"; - -const CardSource = ({ source, isLoading, onClickHandler }) => { - function renderIconText(type) { - switch (type) { - case "Eyewitness Testimony": - return "visibility"; - case "Government Data": - return "public"; - case "Satellite Imagery": - return "satellite"; - case "Second-Hand Testimony": - return "visibility_off"; - case "Video": - return "videocam"; - case "Photo": - return "photo"; - case "Photobook": - return "photo_album"; - case "Document": - return "picture_as_pdf"; - default: - return "help"; - } - } - - if (!source) { - return ( -
    -
    Error: this source was not found
    -
    - ); - } - - const isImgUrl = /\.(jpg|png)$/; - let thumbnail = source.thumbnail; - - if (!thumbnail || thumbnail === "" || !thumbnail.match(isImgUrl)) { - // default to first image in paths, null if no images - const imgs = source.paths.filter((p) => p.match(isImgUrl)); - thumbnail = imgs.length > 0 ? imgs[0] : null; - } - - if (source.type === "" && source.paths.length >= 1) { - source.type = typeForPath(source.paths[0]); - } - const fallbackIcon = ( - {renderIconText(source.type)} - ); - - return ( -
    - {isLoading ? ( - - ) : ( -
    onClickHandler(source)}> - {thumbnail ? ( - } - unloader={fallbackIcon} - width={30} - height={30} - /> - ) : ( - fallbackIcon - )} -

    {source.title ? source.title : source.id}

    -
    - )} -
    - ); -}; - -export default CardSource; diff --git a/src/components/presentational/Card/Summary.js b/src/components/presentational/Card/Summary.js deleted file mode 100644 index b7ca71f..0000000 --- a/src/components/presentational/Card/Summary.js +++ /dev/null @@ -1,18 +0,0 @@ -import React from "react"; - -import copy from "../../../common/data/copy.json"; - -const CardSummary = ({ language, description, isHighlighted }) => { - const summary = copy[language].cardstack.description; - - return ( -
    -
    -

    {summary}

    -

    {description}

    -
    -
    - ); -}; - -export default CardSummary; diff --git a/src/components/presentational/Card/Time.js b/src/components/presentational/Card/Time.js deleted file mode 100644 index c86766c..0000000 --- a/src/components/presentational/Card/Time.js +++ /dev/null @@ -1,33 +0,0 @@ -import React from "react"; - -import copy from "../../../common/data/copy.json"; -import { isNotNullNorUndefined } from "../../../common/utilities"; - -const CardTime = ({ timelabel, language, precision }) => { - // const daytimeLang = copy[language].cardstack.timestamp - // const estimatedLang = copy[language].cardstack.estimated - const unknownLang = copy[language].cardstack.unknown_time; - - if (isNotNullNorUndefined(timelabel)) { - return ( -
    -

    - today - {timelabel} - {precision && precision !== "" ? ` - ${precision}` : ""} -

    -
    - ); - } else { - return ( -
    -

    - today - {unknownLang} -

    -
    - ); - } -}; - -export default CardTime; diff --git a/src/components/space/Space.js b/src/components/space/Space.js new file mode 100644 index 0000000..4a5e39e --- /dev/null +++ b/src/components/space/Space.js @@ -0,0 +1,14 @@ +import React from "react"; +import MapCarto from "./carto/Map"; +// import Map3d from "./3d/Map"; + +const Space = (props) => { + switch (props.kind) { + // case "3d": + // return ; + default: + return ; + } +}; + +export default Space; diff --git a/src/components/Map.jsx b/src/components/space/carto/Map.js similarity index 96% rename from src/components/Map.jsx rename to src/components/space/carto/Map.js index 030b552..864b1bd 100644 --- a/src/components/Map.jsx +++ b/src/components/space/carto/Map.js @@ -1,21 +1,20 @@ /* global L */ +import "leaflet"; import React from "react"; import { Portal } from "react-portal"; import Supercluster from "supercluster"; import { connect } from "react-redux"; -import * as selectors from "../selectors"; +import * as selectors from "../../../selectors"; -import "leaflet"; - -import Sites from "./presentational/Map/Sites.jsx"; -import Shapes from "./presentational/Map/Shapes.jsx"; -import Events from "./presentational/Map/Events.jsx"; -import Clusters from "./presentational/Map/Clusters.jsx"; -import SelectedEvents from "./presentational/Map/SelectedEvents.jsx"; -import Narratives from "./presentational/Map/Narratives"; -import DefsMarkers from "./presentational/Map/DefsMarkers.jsx"; -import LoadingOverlay from "../components/Overlay/Loading"; +import Sites from "./atoms/Sites"; +import Shapes from "./atoms/Shapes"; +import Events from "./atoms/Events"; +import Clusters from "./atoms/Clusters"; +import SelectedEvents from "./atoms/SelectedEvents"; +import Narratives from "./atoms/Narratives"; +import DefsMarkers from "./atoms/DefsMarkers"; +import LoadingOverlay from "../../atoms/Loading"; import { mapClustersToLocations, @@ -24,7 +23,7 @@ import { isLongitude, calculateTotalClusterPoints, calcClusterSize, -} from "../common/utilities"; +} from "../../../common/utilities"; // NB: important constants for map, TODO: make statics const supportedMapboxMap = ["streets", "satellite"]; diff --git a/src/components/presentational/Map/Clusters.jsx b/src/components/space/carto/atoms/Clusters.js similarity index 96% rename from src/components/presentational/Map/Clusters.jsx rename to src/components/space/carto/atoms/Clusters.js index 3158395..e204241 100644 --- a/src/components/presentational/Map/Clusters.jsx +++ b/src/components/space/carto/atoms/Clusters.js @@ -1,7 +1,7 @@ import React, { useState } from "react"; import { Portal } from "react-portal"; -import colors from "../../../common/global.js"; -import ColoredMarkers from "./ColoredMarkers.jsx"; +import colors from "../../../../common/global"; +import ColoredMarkers from "../../../atoms/ColoredMarkers"; import { calcClusterOpacity, calcClusterSize, @@ -10,7 +10,7 @@ import { calculateColorPercentages, zipColorsToPercentages, calculateTotalClusterPoints, -} from "../../../common/utilities"; +} from "../../../../common/utilities"; const DefsClusters = () => ( diff --git a/src/components/presentational/Map/DefsMarkers.jsx b/src/components/space/carto/atoms/DefsMarkers.js similarity index 100% rename from src/components/presentational/Map/DefsMarkers.jsx rename to src/components/space/carto/atoms/DefsMarkers.js diff --git a/src/components/presentational/Map/Events.jsx b/src/components/space/carto/atoms/Events.js similarity index 97% rename from src/components/presentational/Map/Events.jsx rename to src/components/space/carto/atoms/Events.js index d3f1efc..bfd7b1e 100644 --- a/src/components/presentational/Map/Events.jsx +++ b/src/components/space/carto/atoms/Events.js @@ -1,13 +1,13 @@ import React from "react"; import { Portal } from "react-portal"; -import colors from "../../../common/global.js"; -import ColoredMarkers from "./ColoredMarkers.jsx"; +import colors from "../../../../common/global"; +import ColoredMarkers from "../../../atoms/ColoredMarkers"; import { calcOpacity, getCoordinatesForPercent, calculateColorPercentages, zipColorsToPercentages, -} from "../../../common/utilities"; +} from "../../../../common/utilities"; function MapEvents({ getCategoryColor, diff --git a/src/components/presentational/Map/Narratives.js b/src/components/space/carto/atoms/Narratives.js similarity index 100% rename from src/components/presentational/Map/Narratives.js rename to src/components/space/carto/atoms/Narratives.js diff --git a/src/components/presentational/Map/SelectedEvents.jsx b/src/components/space/carto/atoms/SelectedEvents.js similarity index 95% rename from src/components/presentational/Map/SelectedEvents.jsx rename to src/components/space/carto/atoms/SelectedEvents.js index 122340c..6d341c5 100644 --- a/src/components/presentational/Map/SelectedEvents.jsx +++ b/src/components/space/carto/atoms/SelectedEvents.js @@ -1,6 +1,6 @@ import React from "react"; import { Portal } from "react-portal"; -import colors from "../../../common/global.js"; +import colors from "../../../../common/global"; class MapSelectedEvents extends React.Component { renderMarker(marker) { diff --git a/src/components/presentational/Map/Shapes.jsx b/src/components/space/carto/atoms/Shapes.js similarity index 100% rename from src/components/presentational/Map/Shapes.jsx rename to src/components/space/carto/atoms/Shapes.js diff --git a/src/components/presentational/Map/Sites.jsx b/src/components/space/carto/atoms/Sites.js similarity index 100% rename from src/components/presentational/Map/Sites.jsx rename to src/components/space/carto/atoms/Sites.js diff --git a/src/components/TimelineAxis.jsx b/src/components/time/Axis.js similarity index 97% rename from src/components/TimelineAxis.jsx rename to src/components/time/Axis.js index 7f4245c..1d2b89a 100644 --- a/src/components/TimelineAxis.jsx +++ b/src/components/time/Axis.js @@ -1,6 +1,6 @@ import React from "react"; import * as d3 from "d3"; -import { setD3Locale } from "../common/utilities"; +import { setD3Locale } from "../../common/utilities"; const TEXT_HEIGHT = 15; setD3Locale(d3); diff --git a/src/components/TimelineCategories.jsx b/src/components/time/Categories.js similarity index 100% rename from src/components/TimelineCategories.jsx rename to src/components/time/Categories.js diff --git a/src/components/Timeline.jsx b/src/components/time/Timeline.js similarity index 96% rename from src/components/Timeline.jsx rename to src/components/time/Timeline.js index 3476f1c..77b09c4 100644 --- a/src/components/Timeline.jsx +++ b/src/components/time/Timeline.js @@ -2,19 +2,20 @@ import React from "react"; import { bindActionCreators } from "redux"; import { connect } from "react-redux"; import * as d3 from "d3"; -import * as selectors from "../selectors"; -import { setLoading, setNotLoading } from "../actions"; import hash from "object-hash"; -import copy from "../common/data/copy.json"; -import Header from "./presentational/Timeline/Header"; -import Axis from "./TimelineAxis.jsx"; -import Clip from "./presentational/Timeline/Clip"; -import Handles from "./presentational/Timeline/Handles.js"; -import ZoomControls from "./presentational/Timeline/ZoomControls.js"; -import Markers from "./presentational/Timeline/Markers.js"; -import Events from "./presentational/Timeline/Events.js"; -import Categories from "./TimelineCategories.jsx"; +import { setLoading, setNotLoading } from "../../actions"; +import * as selectors from "../../selectors"; +import copy from "../../common/data/copy.json"; + +import Header from "./atoms/Header"; +import Axis from "./Axis"; +import Clip from "./atoms/Clip"; +import Handles from "./atoms/Handles.js"; +import ZoomControls from "./atoms/ZoomControls.js"; +import Markers from "./atoms/Markers.js"; +import Events from "./atoms/Events.js"; +import Categories from "./Categories"; class Timeline extends React.Component { constructor(props) { diff --git a/src/components/presentational/Timeline/Clip.js b/src/components/time/atoms/Clip.js similarity index 100% rename from src/components/presentational/Timeline/Clip.js rename to src/components/time/atoms/Clip.js diff --git a/src/components/presentational/Timeline/DatetimeBar.js b/src/components/time/atoms/DatetimeBar.js similarity index 100% rename from src/components/presentational/Timeline/DatetimeBar.js rename to src/components/time/atoms/DatetimeBar.js diff --git a/src/components/presentational/Timeline/DatetimeDot.js b/src/components/time/atoms/DatetimeDot.js similarity index 100% rename from src/components/presentational/Timeline/DatetimeDot.js rename to src/components/time/atoms/DatetimeDot.js diff --git a/src/components/presentational/Timeline/DatetimeSquare.js b/src/components/time/atoms/DatetimeSquare.js similarity index 100% rename from src/components/presentational/Timeline/DatetimeSquare.js rename to src/components/time/atoms/DatetimeSquare.js diff --git a/src/components/presentational/Timeline/DatetimeStar.js b/src/components/time/atoms/DatetimeStar.js similarity index 100% rename from src/components/presentational/Timeline/DatetimeStar.js rename to src/components/time/atoms/DatetimeStar.js diff --git a/src/components/presentational/Timeline/Events.js b/src/components/time/atoms/Events.js similarity index 98% rename from src/components/presentational/Timeline/Events.js rename to src/components/time/atoms/Events.js index 50756e3..0d50f82 100644 --- a/src/components/presentational/Timeline/Events.js +++ b/src/components/time/atoms/Events.js @@ -3,7 +3,7 @@ import DatetimeBar from "./DatetimeBar"; import DatetimeSquare from "./DatetimeSquare"; import DatetimeStar from "./DatetimeStar"; import Project from "./Project"; -import ColoredMarkers from "../Map/ColoredMarkers.jsx"; +import ColoredMarkers from "../../atoms/ColoredMarkers"; import { calcOpacity, getEventCategories, diff --git a/src/components/presentational/Timeline/Handles.js b/src/components/time/atoms/Handles.js similarity index 100% rename from src/components/presentational/Timeline/Handles.js rename to src/components/time/atoms/Handles.js diff --git a/src/components/presentational/Timeline/Header.js b/src/components/time/atoms/Header.js similarity index 100% rename from src/components/presentational/Timeline/Header.js rename to src/components/time/atoms/Header.js diff --git a/src/components/presentational/Timeline/Labels.js b/src/components/time/atoms/Labels.js similarity index 100% rename from src/components/presentational/Timeline/Labels.js rename to src/components/time/atoms/Labels.js diff --git a/src/components/presentational/Timeline/Markers.js b/src/components/time/atoms/Markers.js similarity index 100% rename from src/components/presentational/Timeline/Markers.js rename to src/components/time/atoms/Markers.js diff --git a/src/components/presentational/Timeline/Project.js b/src/components/time/atoms/Project.js similarity index 100% rename from src/components/presentational/Timeline/Project.js rename to src/components/time/atoms/Project.js diff --git a/src/components/presentational/Timeline/ZoomControls.js b/src/components/time/atoms/ZoomControls.js similarity index 100% rename from src/components/presentational/Timeline/ZoomControls.js rename to src/components/time/atoms/ZoomControls.js diff --git a/src/index.jsx b/src/index.jsx index 91f7582..23f0204 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -1,8 +1,8 @@ import React from "react"; import ReactDOM from "react-dom"; import { Provider } from "react-redux"; -import store from "./store/index.js"; -import App from "./components/App.jsx"; +import store from "./store"; +import App from "./components/App"; ReactDOM.render( diff --git a/src/reducers/validate/eventSchema.js b/src/reducers/validate/eventSchema.js index 2231c2c..3a038ac 100644 --- a/src/reducers/validate/eventSchema.js +++ b/src/reducers/validate/eventSchema.js @@ -21,13 +21,20 @@ function createEventSchema(custom) { date: Joi.string().allow(""), time: Joi.string().allow(""), time_precision: Joi.string().allow(""), + + /* map */ location: Joi.string().allow(""), latitude: Joi.string().allow(""), longitude: Joi.string().allow(""), + /* space */ + x: Joi.string().allow(""), + y: Joi.string().allow(""), + z: Joi.string().allow(""), + type: Joi.string().allow(""), category: Joi.string().allow(""), category_full: Joi.string().allow(""), - associations: Joi.array().required().default([]), + associations: Joi.array().default([]), sources: Joi.array(), comments: Joi.string().allow(""), time_display: Joi.string().allow(""), diff --git a/src/scss/main.scss b/src/scss/main.scss index 413a87c..c13a178 100644 --- a/src/scss/main.scss +++ b/src/scss/main.scss @@ -12,4 +12,4 @@ @import "notification"; @import "mediaplayer"; @import "cover"; -@import "stateoptions"; +@import "search"; diff --git a/src/scss/stateoptions.scss b/src/scss/stateoptions.scss deleted file mode 100644 index 7be70d4..0000000 --- a/src/scss/stateoptions.scss +++ /dev/null @@ -1,28 +0,0 @@ -.stateoptions-panel { - position: absolute; - right: 0; - box-sizing: border-box; - margin: 1px 0 0 0; - padding: 15px; - border: 1px solid $black; - transition: 0.2 ease; - background: $midwhite; - color: $darkgrey; - box-shadow: 0 19px 19px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22); - font-size: $large; - line-height: $xxlarge; - height: auto; - opacity: 0.9; - transition: background-color 0.4s; - - .button { - border: 1px solid black; - padding: 0.3em; - transition: all 0.3s ease; - &:hover { - background-color: black; - color: white; - cursor: pointer; - } - } -} diff --git a/src/store/initial.js b/src/store/initial.js index 7ebc176..9d27db6 100644 --- a/src/store/initial.js +++ b/src/store/initial.js @@ -5,6 +5,19 @@ import copy from "../common/data/copy.json"; import { language } from "../common/utilities"; const isSmallLaptop = window.innerHeight < 800; +const mapIniital = { + anchor: [31.356397, 34.784818], + startZoom: 11, + minZoom: 2, + maxZoom: 16, + bounds: null, + maxBounds: [ + [180, -180], + [-180, 180], + ], +}; +const space3dInitial = {}; + const initial = { /* * The Domain or 'domain' of this state refers to the tree of data @@ -51,17 +64,6 @@ const initial = { }, isMobile: /Mobi/.test(navigator.userAgent), language: "en-US", - map: { - anchor: [31.356397, 34.784818], - startZoom: 11, - minZoom: 2, - maxZoom: 16, - bounds: null, - maxBounds: [ - [180, -180], - [-180, 180], - ], - }, cluster: { radius: 30, minZoom: 2, @@ -173,7 +175,14 @@ if (process.env.store) { // NB: config.js dates get implicitly converted to strings in mergeDeepLeft appStore.app.timeline.range[0] = new Date(appStore.app.timeline.range[0]); appStore.app.timeline.range[1] = new Date(appStore.app.timeline.range[1]); - appStore.app.flags.isIntropopup = !!appStore.app.intro; +if ("map" in appStore.app) { + appStore.app.map = mergeDeepLeft(appStore.app.map, mapIniital); +} + +if ("space3d" in appStore.app) { + appStore.app.space3d = mergeDeepLeft(appStore.app.space3d, space3dInitial); +} + export default appStore;