Commit 10e602e5 authored by Marcel Stör's avatar Marcel Stör
Browse files

Experiment with MutationObserver

parent 6a8fb8fe
...@@ -8,11 +8,6 @@ var nodemcu = nodemcu || {}; ...@@ -8,11 +8,6 @@ var nodemcu = nodemcu || {};
$(document).ready(function () { $(document).ready(function () {
hideNavigationForAllButSelectedLanguage(); hideNavigationForAllButSelectedLanguage();
addLanguageSelectorToRtdFlyOutMenu(); addLanguageSelectorToRtdFlyOutMenu();
document.addEventListener("DOMSubtreeModified", function(e) {
// Notify of change!
debugger;
console.warn("change!", e);
}, false);
}); });
function hideNavigationForAllButSelectedLanguage() { function hideNavigationForAllButSelectedLanguage() {
...@@ -42,21 +37,42 @@ var nodemcu = nodemcu || {}; ...@@ -42,21 +37,42 @@ var nodemcu = nodemcu || {};
* <dd><a href="http://nodemcu.readthedocs.org/en/<branch>/en/">en</a></dd> * <dd><a href="http://nodemcu.readthedocs.org/en/<branch>/en/">en</a></dd>
* </strong> * </strong>
* </dl> * </dl>
*
* UGLY. That menu is added by RTD with an AJAX call after page load. Hence, we need to react to
* the subsequent DOM manipulation using a DOM4 MutationObserver.
*/ */
function addLanguageSelectorToRtdFlyOutMenu() { function addLanguageSelectorToRtdFlyOutMenu() {
var flyOutWrapper = $('.rst-other-versions .injected'); var observer, observerConfig = {childList: true};
// only works on RTD var flyOutWrapper = $('.rst-other-versions');
if (flyOutWrapper.length > 0) {
var selectedLanguageCode = determineSelectedLanguageCode(); // Create an observer instance
var dl = document.createElement('dl'); observer = new MutationObserver(function (mutations) {
var dt = document.createElement('dt'); mutations.forEach(function (mutation) {
dl.appendChild(dt); debugger;
dt.appendChild(document.createTextNode('Languages')); var newNodes = mutation.addedNodes; // DOM NodeList
for (var languageCode in languageCodeToNameMap) { if (newNodes !== null) { // If there are new nodes added
dl.appendChild(createLanguageLinkFor(languageCode, selectedLanguageCode === languageCode)); var $nodes = $(newNodes); // jQuery set
} $nodes.each(function () {
flyOutWrapper.prepend(dl); var $node = $(this);
}
});
var selectedLanguageCode = determineSelectedLanguageCode();
var dl = document.createElement('dl');
var dt = document.createElement('dt');
dl.appendChild(dt);
dt.appendChild(document.createTextNode('Languages'));
for (var languageCode in languageCodeToNameMap) {
dl.appendChild(createLanguageLinkFor(languageCode, selectedLanguageCode === languageCode));
}
flyOutWrapper.prepend(dl);
// Later, you can stop observing
observer.disconnect();
}
});
});
// Pass in the target node, as well as the observer options
observer.observe(flyOutWrapper, config);
} }
function createLanguageLinkFor(languageCode, isCurrentlySelected) { function createLanguageLinkFor(languageCode, isCurrentlySelected) {
var strong; var strong;
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment