From 277ee1c6d3aa00c0087f5308419f8283acdc358e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marcel=20St=C3=B6r?= Date: Mon, 28 Dec 2015 23:36:58 +0100 Subject: [PATCH] JavaScript clean-up and documenting --- docs/js/extra.js | 58 +++++++++++++++++++++++++++++++----------------- 1 file changed, 38 insertions(+), 20 deletions(-) diff --git a/docs/js/extra.js b/docs/js/extra.js index 3f5a3fb4..5a222508 100644 --- a/docs/js/extra.js +++ b/docs/js/extra.js @@ -29,7 +29,8 @@ var nodemcu = nodemcu || {}; } /** - * Adds a language selector to the RTD fly out menu found bottom left. Example + * Adds a language selector to the RTD fly-out menu found bottom left. Example: + * *
*
Languages
*
de
@@ -38,28 +39,37 @@ var nodemcu = nodemcu || {}; * *
* - * 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. + * UGLY! That fly-out 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. The provided structure + * is as follows: + * + *
+ * + *
*/ function addLanguageSelectorToRtdFlyOutMenu() { - var observer = new MutationObserver(function (mutations) { - // since mutation on the target node was triggered we can safely assume the inject RTD div has now been added - var injectedDiv = $('.rst-other-versions .injected'); - 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)); - } - injectedDiv.prepend(dl); - // no need for that observer anymore - observer.disconnect(); - }); + var flyOutWrapper = $('.rst-other-versions'); + // only relevant on RTD + if (flyOutWrapper.size() > 0) { + var observer = new MutationObserver(function (mutations) { + // since mutation on the target node was triggered we can safely assume the injected RTD div has now been added + var injectedDiv = $('.rst-other-versions .injected'); + 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)); + } + injectedDiv.prepend(dl); + // no need for that observer anymore + observer.disconnect(); + }); - // observed target node is the fly-out wrapper, the only event we care about is when children are modified - observer.observe($('.rst-other-versions')[0], {childList: true}); + // observed target node is the fly-out wrapper, the only event we care about is when children are modified + observer.observe(flyOutWrapper[0], {childList: true}); + } } function createLanguageLinkFor(languageCode, isCurrentlySelected) { var strong; @@ -79,6 +89,14 @@ var nodemcu = nodemcu || {}; } } + /** + * Analyzes the URL of the current page to find out what the selected language is. It's usually + * part of the location path. The code needs to distinguish between running MkDocs standalone + * and docs served from RTD. If no valid language could be determined the default language is + * returned. + * + * @returns 2-char language code + */ function determineSelectedLanguageCode() { var selectedLanguageCode, path = window.location.pathname; if (window.location.origin.indexOf('readthedocs') > -1) {