summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/nfvo-components/modal/Modal.jsx
diff options
context:
space:
mode:
authorMichael Lando <ml636r@att.com>2017-02-19 12:57:33 +0200
committerMichael Lando <ml636r@att.com>2017-02-19 13:47:13 +0200
commitefa037d34be7b1570efdc767c79fad8d4005f10e (patch)
treecf1036ba2728dea8a61492b678fa91954e629403 /openecomp-ui/src/nfvo-components/modal/Modal.jsx
parentf5f13c4f6b6fe3b4d98e349dfd7db59339803436 (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.jsx69
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>
+ );
+ }
+}