diff --git a/.gitignore b/.gitignore index 4fb48d9..0ce313e 100644 --- a/.gitignore +++ b/.gitignore @@ -9,3 +9,4 @@ __tests__/integration/editioncrafter/css/ .cache/ storybook-static .DS_Store +.github diff --git a/editioncrafter/src/component/DocumentView.js b/editioncrafter/src/component/DocumentView.js index 5d394f8..00a50f0 100644 --- a/editioncrafter/src/component/DocumentView.js +++ b/editioncrafter/src/component/DocumentView.js @@ -39,6 +39,49 @@ const DocumentView = (props) => { navigate(pathname + location.search); }; + useEffect(() => { + const reloadDocument = async (document) => { + if (!document.loaded) { + // handle the case where we've passed in an array of manifest URLs, in which case the `variorum` parameter should be set to `true` + if (document.variorum) { + const variorumData = {}; + for (const key of Object.keys(document.manifestURL)) { + const response = await fetch(document.manifestURL[key]).then((res) => (res.json())); + variorumData[key] = response.data; + } + const variorumManifest = { + type: 'variorum', + documentData: variorumData, + }; + return variorumManifest; + } + const singleResponse = await fetch(document.manifestURL).then((res) => (res.json())); + return singleResponse; + } + + return null; + }; + + const reloadGlossary = async (glossary) => { + if (!glossary.loaded && glossary.URL) { + const glossaryData = fetch(glossary.URL).then((res) => (res.json())); + return glossaryData; + } + } + // if the top-level component props have been updated such that the document initial state has been reinitialized, dispatch the loadDocument action with the new data + if (!props.document.loaded) { + reloadDocument(props.document).then((res) => { + dispatchAction(props, 'DocumentActions.loadDocument', res); + }); + } + // update the glossary as well if necessary + if (!props.glossary.loaded && props.glossary.URL) { + reloadGlossary(props.glossary).then((res) => { + dispatchAction(props, 'GlossaryActions.loadGlossary', res); + }) + } + }, [props.config]); + const getViewports = () => { const { folioID, transcriptionType, folioID2, transcriptionType2, folioID3, transcriptionType3 @@ -62,19 +105,21 @@ const DocumentView = (props) => { } }; } - - const leftFolioID = folioID; + const leftFolioValid = Object.keys(document.folioIndex).includes(folioID); + const leftFolioID = leftFolioValid ? folioID : '-1'; let leftTranscriptionType; let rightFolioID; let rightTranscriptionType; let thirdFolioID; let thirdTranscriptionType; if (folioID2) { // route /ec/:folioID/:transcriptionType/:folioID2/:transcriptionType2 - leftTranscriptionType = transcriptionType; - rightFolioID = folioID2; - rightTranscriptionType = transcriptionType2 || firstTranscriptionType; + const rightFolioValid = Object.keys(document.folioIndex).includes(folioID2); + leftTranscriptionType = leftFolioValid ? transcriptionType : 'g'; + rightFolioID = rightFolioValid ? folioID2 : '-1'; + rightTranscriptionType = rightFolioValid ? transcriptionType2 ? transcriptionType2 : firstTranscriptionType : 'g'; if (folioID3) { // route /ec/:folioID/:transcriptionType/:folioID2/:transcriptionType2/:folioID3/:transcriptionType3 - thirdFolioID = folioID3; - thirdTranscriptionType = transcriptionType3 || firstTranscriptionType; + const thirdFolioValid = Object.keys(document.folioIndex).includes(folioID3); + thirdFolioID = thirdFolioValid ? folioID3 : '-1'; + thirdTranscriptionType = thirdFolioValid ? transcriptionType3 ? transcriptionType3 : firstTranscriptionType : 'g'; } else { thirdFolioID = '-1'; thirdTranscriptionType = 'g'; @@ -83,8 +128,8 @@ const DocumentView = (props) => { // route /ec/:folioID // route /ec/:folioID/:transcriptionType leftTranscriptionType = 'f'; - rightFolioID = folioID; - rightTranscriptionType = transcriptionType || firstTranscriptionType; + rightFolioID = leftFolioValid ? folioID : '-1'; + rightTranscriptionType = leftFolioValid ? transcriptionType ? transcriptionType : firstTranscriptionType : 'g'; thirdFolioID = '-1'; thirdTranscriptionType = 'g'; } @@ -504,6 +549,7 @@ const DocumentView = (props) => { function mapStateToProps(state) { return { document: state.document, + glossary: state.glossary }; } diff --git a/editioncrafter/stories/EditionCrafter.stories.js b/editioncrafter/stories/EditionCrafter.stories.js index 52ab0c4..c02c833 100644 --- a/editioncrafter/stories/EditionCrafter.stories.js +++ b/editioncrafter/stories/EditionCrafter.stories.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useEffect, useState } from 'react'; import EditionCrafter from '../src/index'; export const BowInTheCloud = () => ( @@ -131,6 +131,29 @@ export const fullScreen = () => ( ) +export const stateChange = () => { + const [manifest, setManifest] = useState('https://cu-mkp.github.io/editioncrafter/taos-baptisms-example/iiif/manifest.json'); + const [glossary, setGlossary] = useState(undefined); + + useEffect(() => { + setTimeout(() => { + setManifest('https://cu-mkp.github.io/dyngleyfamily-editioncrafter-data/O_8_35/iiif/manifest.json'); + setGlossary('https://cu-mkp.github.io/editioncrafter-data/fr640_3r-3v-example/glossary.json'); + }, 10000); + }, []) + + return () + +} + export default { title: 'EditionCrafter', };