cognito-forms
/
cognitoforms-wordpress
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Formatting fixes

This commit is contained in:
Michael Thomas 2021-12-23 21:41:43 +00:00
parent c90f945430
commit 037fe88a3d
1 changed files with 21 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/block/select-dialog.js
View File

@ -5,41 +5,41 @@ import React from 'react';
import { Button, Modal, FocusableIframe } from '@wordpress/components'; import { Button, Modal, FocusableIframe } from '@wordpress/components';
class SelectDialog extends React.Component { class SelectDialog extends React.Component {
constructor(props) { constructor( props ) {
super(props); super( props );
this.state = { this.state = {
isOpen: false isOpen: false,
};
}; };
}
componentDidMount() { componentDidMount() {
window.addEventListener('message', this.handlePostMessage, false); window.addEventListener( 'message', this.handlePostMessage, false );
} }
componentWillUnmount() { componentWillUnmount() {
window.removeEventListener('message', this.handlePostMessage); window.removeEventListener( 'message', this.handlePostMessage );
} }
handlePostMessage = (event) => { handlePostMessage = ( event ) => {
console.log('PostMessage recieved:', event.data); console.log( 'PostMessage recieved:', event.data );
this.props.onSelectForm(event.data); this.props.onSelectForm( event.data );
} }
render() { render() {
return ( return (
<div> <div>
<Button variant="primary" onClick={ () => this.setState({isOpen: true}) }> <Button variant="primary" onClick={ () => this.setState( { isOpen: true } ) }>
Choose a form Choose a form
</Button> </Button>
{ this.state.isOpen && ( { this.state.isOpen && (
<Modal title="Cognito Forms Embed" className="cognito-modal" onRequestClose={ () => this.setState({isOpen: false}) } shouldCloseOnClickOutside={ false }> <Modal title="Cognito Forms Embed" className="cognito-modal" onRequestClose={ () => this.setState( { isOpen: false } ) } shouldCloseOnClickOutside={ false }>
<FocusableIframe style={{ width: "500px", height: "500px" }} src="/wp-content/plugins/cognitoforms/testing/dialog.html"></FocusableIframe> <FocusableIframe style={ { width: '500px', height: '500px' } } src="/wp-content/plugins/cognitoforms/testing/dialog.html"></FocusableIframe>
</Modal> </Modal>
) } ) }
</div> </div>
); );
}; }
}; }
export default SelectDialog export default SelectDialog;