4 * Copyright 2016 RIFT.IO Inc
6 * Licensed under the Apache License, Version 2.0 (the "License");
7 * you may not use this file except in compliance with the License.
8 * You may obtain a copy of the License at
10 * http://www.apache.org/licenses/LICENSE-2.0
12 * Unless required by applicable law or agreed to in writing, software
13 * distributed under the License is distributed on an "AS IS" BASIS,
14 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15 * See the License for the specific language governing permissions and
16 * limitations under the License.
20 * Created by onvelocity on 10/14/15.
24 import React
from 'react'
25 import PureRenderMixin
from 'react-addons-pure-render-mixin'
26 import ClassNames
from 'classnames'
28 import ModalOverlayStore
from '../stores/ModalOverlayStore'
30 import '../styles/ModalOverlay.scss'
32 const ModalOverlay
= React
.createClass({
33 mixins
: [PureRenderMixin
],
35 return ModalOverlayStore
.getState();
39 componentWillMount() {
40 ModalOverlayStore
.listen(this.onChange
);
43 window
.addEventListener('resize', this.onResizeCapture
, true);
44 window
.addEventListener('mousemove', this.onMouseMoveCapture
, true);
46 componentDidUpdate() {
48 componentWillUnmount() {
49 ModalOverlayStore
.unlisten(this.onChange
);
50 window
.removeEventListener('resize', this.onResize
, true);
51 window
.removeEventListener('mousemove', this.onMouseMoveCapture
, true);
56 onResizeCapture(event
) {
57 if (event
.detail
&& event
.detail
.side
) {
58 if (this.state
.visible
) {
59 event
.preventDefault();
60 event
.stopPropagation();
64 onMouseMoveCapture(event
) {
65 if (this.state
.visible
) {
66 event
.preventDefault();
67 event
.stopPropagation();
71 const className
= ClassNames('ModalOverlay', {'-is-visible': this.state
.visible
});
73 <div className
={className
}>
74 <div className
="background" onMouseMoveCapture
={this.onMouseMoveCapture
}></div
>
75 {this.state
.ui
? <div className
="foreground" onMouseMoveCapture
={this.onMouseMoveCapture
}><div className
="ui">{this.state
.ui
}</div></div> : null}
81 export default ModalOverlay
;