diff --git a/src/CanvasListItem.js b/src/CanvasListItem.js index bf2313ad0a249e4fa96830379a18194b69a1fd42..f3a6526e50853a6efb6658c37f9a4716deca3232 100644 --- a/src/CanvasListItem.js +++ b/src/CanvasListItem.js @@ -6,7 +6,6 @@ import ToggleButton from '@material-ui/lab/ToggleButton'; import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup'; import flatten from 'lodash/flatten'; import AnnotationActionsContext from './AnnotationActionsContext'; -import { SingleCanvasDialog } from './SingleCanvasDialog'; /** */ class CanvasListItem extends Component { @@ -16,14 +15,11 @@ class CanvasListItem extends Component { this.state = { isHovering: false, - singleCanvasDialogOpen: false, }; this.handleMouseHover = this.handleMouseHover.bind(this); this.handleDelete = this.handleDelete.bind(this); this.handleEdit = this.handleEdit.bind(this); - this.toggleSingleCanvasDialogOpen = this.toggleSingleCanvasDialogOpen.bind(this); - this.switchCanvas = this.switchCanvas.bind(this); } /** */ @@ -86,41 +82,11 @@ class CanvasListItem extends Component { return flatten(annoIds).includes(annotationid); } - /** */ - switchCanvas() { - const { annotationsOnCanvases, canvases, setCanvas } = this.context; - const { annotationid } = this.props; - let canvasId; - canvases.forEach((canvas) => { - if (annotationsOnCanvases[canvas.id]) { - Object.entries(annotationsOnCanvases[canvas.id]).forEach(([key, value], i) => { - if (value.json && value.json.items) { - const annotation = value.json.items.find((anno) => anno.id === annotationid); - if (annotation) { - canvasId = canvas.id; - } - } - }); - } - }); - if (canvasId) { - setCanvas(canvasId); - } - } - - /** */ - toggleSingleCanvasDialogOpen() { - const { singleCanvasDialogOpen } = this.state; - this.setState({ - singleCanvasDialogOpen: !singleCanvasDialogOpen, - }); - } - /** */ render() { const { children } = this.props; - const { isHovering, singleCanvasDialogOpen } = this.state; - const { windowViewType, switchToSingleCanvasView } = this.context; + const { isHovering } = this.state; + const { windowViewType, toggleSingleCanvasDialogOpen } = this.context; return ( <div onMouseEnter={this.handleMouseHover} @@ -144,7 +110,7 @@ class CanvasListItem extends Component { > <ToggleButton aria-label="Edit" - onClick={windowViewType === 'single' ? this.handleEdit : this.toggleSingleCanvasDialogOpen} + onClick={windowViewType === 'single' ? this.handleEdit : toggleSingleCanvasDialogOpen} value="edit" > <EditIcon /> @@ -155,15 +121,6 @@ class CanvasListItem extends Component { </ToggleButtonGroup> </div> )} - {windowViewType !== 'single' && ( - <SingleCanvasDialog - handleClose={this.toggleSingleCanvasDialogOpen} - open={singleCanvasDialogOpen} - openCreateAnnotationCompanionWindow={this.handleEdit} - setCanvas={this.switchCanvas} - switchToSingleCanvasView={switchToSingleCanvasView} - /> - )} <li {...this.props} // eslint-disable-line react/jsx-props-no-spreading > diff --git a/src/SingleCanvasDialog.js b/src/SingleCanvasDialog.js index 48a1cd3e577426fb50bc7a4f059290ff4d81ea4d..6d5f043a4dc2d789f9becbad4435539790642ba9 100644 --- a/src/SingleCanvasDialog.js +++ b/src/SingleCanvasDialog.js @@ -11,7 +11,7 @@ import PropTypes from 'prop-types'; /** * Dialog to enforce single view for annotation creation / editing */ -export class SingleCanvasDialog extends Component { +class SingleCanvasDialog extends Component { /** */ constructor(props) { super(props); @@ -22,13 +22,9 @@ export class SingleCanvasDialog extends Component { confirm() { const { handleClose, - openCreateAnnotationCompanionWindow, - setCanvas, switchToSingleCanvasView, } = this.props; switchToSingleCanvasView(); - setCanvas(); - openCreateAnnotationCompanionWindow(); handleClose(); } @@ -55,7 +51,7 @@ export class SingleCanvasDialog extends Component { </DialogContentText> <DialogActions> <Button onClick={this.confirm} variant="contained"> - Switch and start annotating + Switch to single view </Button> <Button onClick={handleClose} variant="contained"> Cancel @@ -70,12 +66,13 @@ export class SingleCanvasDialog extends Component { SingleCanvasDialog.propTypes = { handleClose: PropTypes.func.isRequired, open: PropTypes.bool, - openCreateAnnotationCompanionWindow: PropTypes.func.isRequired, - setCanvas: PropTypes.func, + // openCreateAnnotationCompanionWindow: PropTypes.func.isRequired, + // setCanvas: PropTypes.func, switchToSingleCanvasView: PropTypes.func.isRequired, }; SingleCanvasDialog.defaultProps = { open: false, - setCanvas: () => undefined, }; + +export default SingleCanvasDialog; diff --git a/src/plugins/canvasAnnotationsPlugin.js b/src/plugins/canvasAnnotationsPlugin.js index 37e0866b82dc8372221c10a90992887af011d8da..9102709e50af23b914af0843aa28b7a5bd71998e 100644 --- a/src/plugins/canvasAnnotationsPlugin.js +++ b/src/plugins/canvasAnnotationsPlugin.js @@ -5,15 +5,34 @@ import * as actions from 'mirador/dist/es/src/state/actions'; import { getWindowViewType } from 'mirador/dist/es/src/state/selectors'; import CanvasListItem from '../CanvasListItem'; import AnnotationActionsContext from '../AnnotationActionsContext'; +import SingleCanvasDialog from '../SingleCanvasDialog'; /** */ class CanvasAnnotationsWrapper extends Component { + /** */ + constructor(props) { + super(props); + this.state = { + singleCanvasDialogOpen: false, + }; + this.toggleSingleCanvasDialogOpen = this.toggleSingleCanvasDialogOpen.bind(this); + } + + /** */ + toggleSingleCanvasDialogOpen() { + const { singleCanvasDialogOpen } = this.state; + this.setState({ + singleCanvasDialogOpen: !singleCanvasDialogOpen, + }); + } + /** */ render() { const { addCompanionWindow, annotationsOnCanvases, canvases, config, receiveAnnotation, - setCanvas, switchToSingleCanvasView, TargetComponent, targetProps, windowViewType, + switchToSingleCanvasView, TargetComponent, targetProps, windowViewType, } = this.props; + const { singleCanvasDialogOpen } = this.state; const props = { ...targetProps, listContainerComponent: CanvasListItem, @@ -26,9 +45,8 @@ class CanvasAnnotationsWrapper extends Component { canvases, config, receiveAnnotation, - setCanvas, storageAdapter: config.annotation.adapter, - switchToSingleCanvasView, + toggleSingleCanvasDialogOpen: this.toggleSingleCanvasDialogOpen, windowId: targetProps.windowId, windowViewType, }} @@ -36,6 +54,13 @@ class CanvasAnnotationsWrapper extends Component { <TargetComponent {...props} // eslint-disable-line react/jsx-props-no-spreading /> + {windowViewType !== 'single' && ( + <SingleCanvasDialog + handleClose={this.toggleSingleCanvasDialogOpen} + open={singleCanvasDialogOpen} + switchToSingleCanvasView={switchToSingleCanvasView} + /> + )} </AnnotationActionsContext.Provider> ); } @@ -53,7 +78,6 @@ CanvasAnnotationsWrapper.propTypes = { }), }).isRequired, receiveAnnotation: PropTypes.func.isRequired, - setCanvas: PropTypes.func.isRequired, switchToSingleCanvasView: PropTypes.func.isRequired, TargetComponent: PropTypes.oneOfType([ PropTypes.func, @@ -95,9 +119,6 @@ const mapDispatchToProps = (dispatch, props) => ({ receiveAnnotation: (targetId, id, annotation) => dispatch( actions.receiveAnnotation(targetId, id, annotation), ), - setCanvas: (canvasId) => dispatch( - actions.setCanvas(props.targetProps.windowId, canvasId), - ), switchToSingleCanvasView: () => dispatch( actions.setWindowViewType(props.targetProps.windowId, 'single'), ), diff --git a/src/plugins/miradorAnnotationPlugin.js b/src/plugins/miradorAnnotationPlugin.js index 613d74d136b9264f99d148dafa45ea2990c84d39..17b09dce48833f0b46f84d83498722bbfa5d5a6b 100644 --- a/src/plugins/miradorAnnotationPlugin.js +++ b/src/plugins/miradorAnnotationPlugin.js @@ -4,7 +4,7 @@ import * as actions from 'mirador/dist/es/src/state/actions'; import { getWindowViewType } from 'mirador/dist/es/src/state/selectors'; import AddBoxIcon from '@material-ui/icons/AddBox'; import { MiradorMenuButton } from 'mirador/dist/es/src/components/MiradorMenuButton'; -import { SingleCanvasDialog } from '../SingleCanvasDialog'; +import SingleCanvasDialog from '../SingleCanvasDialog'; /** */ class MiradorAnnotation extends Component { @@ -63,7 +63,6 @@ class MiradorAnnotation extends Component { <SingleCanvasDialog open={singleCanvasDialogOpen} handleClose={this.toggleSingleCanvasDialogOpen} - openCreateAnnotationCompanionWindow={this.openCreateAnnotationCompanionWindow} switchToSingleCanvasView={switchToSingleCanvasView} /> )