Skip to content

Commit

Permalink
Fixed #1961 - Reimplement EventBus
Browse files Browse the repository at this point in the history
  • Loading branch information
mertsincan committed Apr 16, 2021
1 parent 5e44633 commit 0c2bc06
Show file tree
Hide file tree
Showing 5 changed files with 59 additions and 47 deletions.
14 changes: 11 additions & 3 deletions src/components/confirmpopup/ConfirmPopup.js
Original file line number Diff line number Diff line change
Expand Up @@ -216,17 +216,20 @@ export class ConfirmPopup extends Component {

show() {
this.setState({ visible: true }, () => {
OverlayEventBus.on('overlay-click', (e) => {
this.overlayEventListener = (e) => {
if (!this.isOutsideClicked(e.target)) {
this.isPanelClicked = true;
}
});
};

OverlayEventBus.on('overlay-click', this.overlayEventListener);
});
}

hide(result) {
this.setState({ visible: false }, () => {
OverlayEventBus.off('overlay-click');
OverlayEventBus.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;

if (this.props.onHide) {
this.props.onHide(result);
Expand Down Expand Up @@ -296,6 +299,11 @@ export class ConfirmPopup extends Component {
this.scrollHandler = null;
}

if (this.overlayEventListener) {
OverlayEventBus.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}

ZIndexUtils.clear(this.overlayRef.current);
}

Expand Down
16 changes: 11 additions & 5 deletions src/components/datatable/BodyCell.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,6 @@ export class BodyCell extends Component {
this.onMouseDown = this.onMouseDown.bind(this);
this.onMouseUp = this.onMouseUp.bind(this);
this.onEditorFocus = this.onEditorFocus.bind(this);

this.eventBusKey = `${this.props.field}_${this.props.rowIndex}`;
}

onExpanderClick(event) {
Expand Down Expand Up @@ -136,11 +134,13 @@ export class BodyCell extends Component {
if (this.props.editorValidatorEvent === 'click') {
this.bindDocumentEditListener();

OverlayEventBus.on('overlay-click', (e) => {
this.overlayEventListener = (e) => {
if (!this.isOutsideClicked(e.target)) {
this.selfClick = true;
}
}, this.eventBusKey);
};

OverlayEventBus.on('overlay-click', this.overlayEventListener);
}
});
}
Expand Down Expand Up @@ -230,7 +230,8 @@ export class BodyCell extends Component {
editing: false
}, () => {
this.unbindDocumentEditListener();
OverlayEventBus.off('overlay-click', this.eventBusKey);
OverlayEventBus.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
});
}, 1);
}
Expand Down Expand Up @@ -364,6 +365,11 @@ export class BodyCell extends Component {

componentWillUnmount() {
this.unbindDocumentEditListener();

if (this.overlayEventListener) {
OverlayEventBus.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
}

render() {
Expand Down
14 changes: 11 additions & 3 deletions src/components/overlaypanel/OverlayPanel.js
Original file line number Diff line number Diff line change
Expand Up @@ -163,18 +163,21 @@ export class OverlayPanel extends Component {
}
else {
this.setState({ visible: true }, () => {
OverlayEventBus.on('overlay-click', (e) => {
this.overlayEventListener = (e) => {
if (!this.isOutsideClicked(e.target)) {
this.isPanelClicked = true;
}
});
};

OverlayEventBus.on('overlay-click', this.overlayEventListener);
});
}
}

hide() {
this.setState({ visible: false }, () => {
OverlayEventBus.off('overlay-click');
OverlayEventBus.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
});
}

Expand Down Expand Up @@ -262,6 +265,11 @@ export class OverlayPanel extends Component {
this.styleElement = null;
}

if (this.overlayEventListener) {
OverlayEventBus.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}

ZIndexUtils.clear(this.overlayRef.current);
}

Expand Down
16 changes: 11 additions & 5 deletions src/components/treetable/TreeTableBodyCell.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,6 @@ export class TreeTableBodyCell extends Component {
this.onClick = this.onClick.bind(this);
this.onKeyDown = this.onKeyDown.bind(this);
this.onEditorFocus = this.onEditorFocus.bind(this);

this.eventBusKey = `${this.props.field}_${this.props.rowIndex}`;
}

onClick() {
Expand All @@ -29,11 +27,13 @@ export class TreeTableBodyCell extends Component {
}, () => {
this.bindDocumentEditListener();

OverlayEventBus.on('overlay-click', (e) => {
this.overlayEventListener = (e) => {
if (!this.isOutsideClicked(e.target)) {
this.selfClick = true;
}
}, this.eventBusKey);
};

OverlayEventBus.on('overlay-click', this.overlayEventListener);
});
}
}
Expand Down Expand Up @@ -77,7 +77,8 @@ export class TreeTableBodyCell extends Component {
editing: false
}, () => {
this.unbindDocumentEditListener();
OverlayEventBus.off('overlay-click', this.eventBusKey);
OverlayEventBus.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
});
}, 1);
}
Expand Down Expand Up @@ -126,6 +127,11 @@ export class TreeTableBodyCell extends Component {

componentWillUnmount() {
this.unbindDocumentEditListener();

if (this.overlayEventListener) {
OverlayEventBus.off('overlay-click', this.overlayEventListener);
this.overlayEventListener = null;
}
}

render() {
Expand Down
46 changes: 15 additions & 31 deletions src/components/utils/EventBus.js
Original file line number Diff line number Diff line change
@@ -1,39 +1,23 @@
export default function() {
let eventTarget, eventListener, eventKey;
const allHandlers = new Map();

return {
on(type, listener, key) {
eventTarget = eventTarget || document.body.appendChild(document.createComment(''));
eventKey = key;
eventListener = function(e) { listener(e.detail); };
eventTarget.addEventListener(type, eventListener);
return this;
},
once(type, listener, key) {
eventTarget = eventTarget || document.body.appendChild(document.createComment(''));
eventKey = key;
eventListener = function(e) { listener(e.detail); };
eventTarget.addEventListener(type, eventListener, { once: true });
return this;
},
off(type, key) {
if (eventTarget && eventListener && eventKey === key) {
eventTarget.removeEventListener(type, eventListener);
}
return this;
on(type, handler) {
let handlers = allHandlers.get(type);
if (!handlers)
handlers = [handler];
else
handlers.push(handler);

allHandlers.set(type, handlers);
},
emit(type, detail) {
if (eventTarget) {
eventTarget.dispatchEvent(new CustomEvent(type, { detail }));
}
return this;
off(type, handler) {
let handlers = allHandlers.get(type);
handlers && handlers.splice(handlers.indexOf(handler) >>> 0, 1);
},
reset() {
if (eventTarget) {
document.body.removeChild(eventTarget);
eventTarget = eventListener = eventKey = undefined;
}
return this;
emit(type, evt) {
let handlers = allHandlers.get(type);
handlers && handlers.slice().forEach(handler => handler(evt));
}
}
}

0 comments on commit 0c2bc06

Please sign in to comment.