snuffster/szurubooru
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

client/views: reuse mutation observer

Browse source
This commit is contained in:
rr- 2016-05-29 12:22:59 +02:00
parent 8591449508
commit 79f22d27cd
2 changed files with 21 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
client/js/controls/auto_complete_control.js
View file

@ -61,18 +61,6 @@ class AutoCompleteControl {
this._results = [];
this._activeResult = -1;
this._mutationObserver = new MutationObserver(
mutations => {
for (let mutation of mutations) {
for (let node of mutation.removedNodes) {
if (node.contains(this._sourceInputNode)) {
this._uninstall();
return;
}
}
}
});
this._install();
}
@ -108,8 +96,6 @@ class AutoCompleteControl {
this._sourceInputNode.setAttribute('data-autocomplete', true);
this._sourceInputNode.setAttribute('autocomplete', 'off');
this._mutationObserver.observe(
document.body, {childList: true, subtree: true});
this._sourceInputNode.addEventListener(
'keydown', e => this._evtKeyDown(e));
this._sourceInputNode.addEventListener(
@ -119,11 +105,13 @@ class AutoCompleteControl {
'<div class="autocomplete"><ul></ul></div>');
this._suggestionList = this._suggestionDiv.querySelector('ul');
document.body.appendChild(this._suggestionDiv);
views.monitorNodeRemoval(
this._sourceInputNode, () => { this._uninstall(); });
}
_uninstall() {
window.clearTimeout(this._showTimeout);
this._mutationObserver.disconnect();
document.body.removeChild(this._suggestionDiv);
}

18
client/js/util/views.js
View file

@ -354,6 +354,23 @@ function slideUp(element) {
});
}
function monitorNodeRemoval(monitoredNode, callback) {
const mutationObserver = new MutationObserver(
mutations => {
for (let mutation of mutations) {
for (let node of mutation.removedNodes) {
if (node.contains(monitoredNode)) {
mutationObserver.disconnect();
callback();
return;
}
}
}
});
mutationObserver.observe(
document.body, {childList: true, subtree: true});
}
document.addEventListener('input', e => {
const type = e.target.getAttribute('type');
if (type && type.toLowerCase() === 'color') {
@ -378,4 +395,5 @@ module.exports = {
scrollToHash: scrollToHash,
slideDown: slideDown,
slideUp: slideUp,
monitorNodeRemoval: monitorNodeRemoval,
};