@@ -120,8 +142,12 @@ const SecondPopin = React.createClass({
You have 3 choices which are "full", "from-menu" and "from-right". The modal attribute is, by default, set to true so you can click outside of the Popin to close it.
Check the notification icon which is in the Focus menu bar now.
+
+ You can add as much popin as you want and close them with esc, from newer to older ones.
+
+ {this._renderDynamicPopin()}
);
}
@@ -129,6 +155,7 @@ const SecondPopin = React.createClass({
const ThirdPopin = React.createClass({
togglePopin() {
+ this.refs.thirdPopin.setLevel(getLevel());
this.refs.thirdPopin.toggleOpen();
},
render() {
@@ -169,4 +196,5 @@ const ThirdPopin = React.createClass({
}
});
+
module.exports = MyMenu;
diff --git a/src/application/popin/index.js b/src/application/popin/index.js
index 09e4c0350..56650bc28 100644
--- a/src/application/popin/index.js
+++ b/src/application/popin/index.js
@@ -155,6 +155,12 @@ const popin = {
}, timeout);
},
+ componentDidMount() {
+ if (this.state.opened){
+ window.addEventListener('keydown', this.handleKeyDown, true);
+ }
+ },
+
componentWillUnmount() {
window.clearTimeout(this._openTimeoutID);
},
@@ -174,7 +180,7 @@ const popin = {
e.preventDefault();
if (e.code === "Escape") {
if (this.state.opened) {
- const popins = [].slice.call(document.querySelectorAll("[data-focus='popin']")).reduce((prec, current) => {
+ const popins = [...document.querySelectorAll("[data-focus='popin']")].reduce((prec, current) => {
if (current.hasChildNodes()) {
prec.push(Number(current.getAttribute('data-level')));
}