diff --git a/src/CanvasListItem.js b/src/CanvasListItem.js index 97402eba93350643cdd8adb6f724b68f23990b2b..b40198d8b4fa97536351cca53b8cb1e136be66da 100644 --- a/src/CanvasListItem.js +++ b/src/CanvasListItem.js @@ -6,6 +6,7 @@ import ToggleButton from '@mui/material/ToggleButton'; import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import flatten from 'lodash/flatten'; import AnnotationActionsContext from './AnnotationActionsContext'; +import * as actions from "mirador/dist/es/src/state/actions"; /** */ class CanvasListItem extends Component { @@ -15,6 +16,9 @@ class CanvasListItem extends Component { this.state = { isHovering: false, + isEditAnnotationPanelOpen: false, + id: "", + payload:{} }; this.handleMouseHover = this.handleMouseHover.bind(this); @@ -37,7 +41,7 @@ class CanvasListItem extends Component { /** */ handleEdit() { const { - addCompanionWindow, canvases, annotationsOnCanvases, + addCompanionWindow, canvases, annotationsOnCanvases,closeCompanionWindow } = this.context; const { annotationid } = this.props; let annotation; @@ -51,10 +55,28 @@ class CanvasListItem extends Component { } return (annotation); }); - addCompanionWindow('annotationCreation', { + console.log('closeCompanionWindow',closeCompanionWindow) + console.log('this props', this.props) + console.log('this context', this.context) + if(!this.state.isEditAnnotationPanelOpen){ + const myAnnotationPannel = addCompanionWindow('annotationCreation', { annotationid, position: 'right', }); + this.setState({isEditAnnotationPanelOpen:true}) + this.setState({id: myAnnotationPannel.id}) + this.setState({payload: myAnnotationPannel.payload}) + }else{ + closeCompanionWindow(this.state.id) + this.setState({creationAnnotationIsOpen: false}) + const myAnnotationPannel = addCompanionWindow('annotationCreation', { + annotationid, + position: 'right', + }); + this.setState({isEditAnnotationPanelOpen:true}) + this.setState({id: myAnnotationPannel.id}) + this.setState({payload: myAnnotationPannel.payload}) + } } /** */ @@ -137,8 +159,10 @@ CanvasListItem.propTypes = { PropTypes.func, PropTypes.node, ]).isRequired, + closeCompanionWindow: PropTypes.func.isRequired, }; + CanvasListItem.contextType = AnnotationActionsContext; export default forwardRef((props, ref) => <CanvasListItem {...props} containerRef={ref} />); diff --git a/src/plugins/canvasAnnotationsPlugin.js b/src/plugins/canvasAnnotationsPlugin.js index bc919160967ba044c17020a7e604184435c53ea8..771a67a8900e2b3b275070d857bab4ae69da3e28 100644 --- a/src/plugins/canvasAnnotationsPlugin.js +++ b/src/plugins/canvasAnnotationsPlugin.js @@ -30,7 +30,7 @@ class CanvasAnnotationsWrapper extends Component { render() { const { addCompanionWindow, annotationsOnCanvases, canvases, config, receiveAnnotation, - switchToSingleCanvasView, TargetComponent, targetProps, windowViewType, containerRef, + switchToSingleCanvasView, TargetComponent, targetProps, windowViewType, containerRef,closeCompanionWindow } = this.props; const { singleCanvasDialogOpen } = this.state; @@ -51,6 +51,7 @@ class CanvasAnnotationsWrapper extends Component { toggleSingleCanvasDialogOpen: this.toggleSingleCanvasDialogOpen, windowId: targetProps.windowId, windowViewType, + closeCompanionWindow }} > <TargetComponent @@ -92,6 +93,8 @@ CanvasAnnotationsWrapper.propTypes = { ]).isRequired, targetProps: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types windowViewType: PropTypes.string.isRequired, + closeCompanionWindow: PropTypes.func.isRequired, + }; CanvasAnnotationsWrapper.defaultProps = { @@ -117,6 +120,7 @@ function mapStateToProps(state, { targetProps: { windowId } }) { config: state.config, windowViewType: getWindowViewType(state, { windowId }), }; + } /** */ @@ -130,6 +134,9 @@ const mapDispatchToProps = (dispatch, props) => ({ switchToSingleCanvasView: () => dispatch( actions.setWindowViewType(props.targetProps.windowId, 'single'), ), + closeCompanionWindow: (id) => dispatch( + actions.removeCompanionWindow(props.targetProps.windowId, id), + ) }); export default {