diff options
author | Michael Lando <ml636r@att.com> | 2017-02-19 12:57:33 +0200 |
---|---|---|
committer | Michael Lando <ml636r@att.com> | 2017-02-19 13:47:13 +0200 |
commit | efa037d34be7b1570efdc767c79fad8d4005f10e (patch) | |
tree | cf1036ba2728dea8a61492b678fa91954e629403 /openecomp-ui/src/nfvo-components/modal/Modal.jsx | |
parent | f5f13c4f6b6fe3b4d98e349dfd7db59339803436 (diff) |
Add new code new version
Change-Id: Ic02a76313503b526f17c3df29eb387a29fe6a42a
Signed-off-by: Michael Lando <ml636r@att.com>
Diffstat (limited to 'openecomp-ui/src/nfvo-components/modal/Modal.jsx')
-rw-r--r-- | openecomp-ui/src/nfvo-components/modal/Modal.jsx | 69 |
1 files changed, 69 insertions, 0 deletions
diff --git a/openecomp-ui/src/nfvo-components/modal/Modal.jsx b/openecomp-ui/src/nfvo-components/modal/Modal.jsx new file mode 100644 index 0000000000..be4963ef65 --- /dev/null +++ b/openecomp-ui/src/nfvo-components/modal/Modal.jsx @@ -0,0 +1,69 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import BootstrapModal from 'react-bootstrap/lib/Modal.js'; + +let nextModalId = 0; + +export default class Modal extends React.Component { + + static Header = BootstrapModal.Header; + + static Title = BootstrapModal.Title; + + static Footer = BootstrapModal.Footer; + + static Body = class ModalBody extends React.Component { + + render() { + let {children, ...props} = this.props; + return ( + <BootstrapModal.Body {...props}> + {children} + </BootstrapModal.Body> + ); + } + + componentDidMount() { + let element = ReactDOM.findDOMNode(this); + element.addEventListener('click', event => { + if (event.target.tagName === 'A') { + event.preventDefault(); + } + }); + ['wheel', 'mousewheel', 'DOMMouseScroll'].forEach(eventType => + element.addEventListener(eventType, event => event.stopPropagation()) + ); + } + }; + + componentWillMount() { + this.modalId = `dox-ui-modal-${nextModalId++}`; + } + + componentDidMount() { + this.ensureRootClass(); + } + + componentDidUpdate() { + this.ensureRootClass(); + } + + ensureRootClass() { + let element = document.getElementById(this.modalId); + while(element && !element.hasAttribute('data-reactroot')) { + element = element.parentElement; + } + if (element && !element.classList.contains('dox-ui')) { + element.classList.add('dox-ui'); + } + } + + render() { + let {children, ...props} = this.props; + return ( + <BootstrapModal {...props} id={this.modalId}> + {children} + </BootstrapModal> + ); + } +} |