From 1ec694595e148cde3143a3004be0d2b52a060672 Mon Sep 17 00:00:00 2001 From: Tony Murray Date: Fri, 27 Aug 2021 06:48:17 -0500 Subject: [PATCH] Docs link to webui settings in user's install (#13176) * Docs link to webui settings in user's install * Add note to re-assure users --- .../docs-install-tab.js} | 0 doc/js/docs-settings-links.js | 88 +++++++++++++++++++ doc/librenms.css | 46 ++++++++++ mkdocs.yml | 4 +- 4 files changed, 137 insertions(+), 1 deletion(-) rename doc/{librenms-docs.js => js/docs-install-tab.js} (100%) create mode 100644 doc/js/docs-settings-links.js diff --git a/doc/librenms-docs.js b/doc/js/docs-install-tab.js similarity index 100% rename from doc/librenms-docs.js rename to doc/js/docs-install-tab.js diff --git a/doc/js/docs-settings-links.js b/doc/js/docs-settings-links.js new file mode 100644 index 0000000000..7dfe3b8fad --- /dev/null +++ b/doc/js/docs-settings-links.js @@ -0,0 +1,88 @@ +function findGetParameter(parameterName) { + let result = null, tmp = []; + location.search + .substr(1) + .split("&") + .forEach(function (item) { + tmp = item.split("="); + if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]); + }); + return result; +} + +function isValidHttpUrl(string) { + let url; + + try { + url = new URL(string); + } catch (_) { + return false; + } + + return url.protocol === "http:" || url.protocol === "https:"; +} + +function promptSettingUrl(e) { + e.preventDefault(); + let librenmsUrl = prompt("Enter your LibreNMS URL to get direct settings link.\nNote: This URL is only stored in your browser."); + + if (! isValidHttpUrl(librenmsUrl)) { + alert("Invalid url, must start with http:// or https://") + return false; + } + + wrapSettingsLinks(librenmsUrl); + return false; +} + + +function wrapSettingsLinks(librenmsUrl) { + // fetch saved url + if (! librenmsUrl) { + librenmsUrl = localStorage.getItem('librenms_url'); + } + + if (librenmsUrl) { + localStorage.setItem('librenms_url', librenmsUrl); + librenmsUrl = librenmsUrl.replace(/\/+$/i, ''); // trim trailing / + [].forEach.call(document.querySelectorAll('.admonition.setting>.admonition-title'), function (el) { + if (! el.dataset.setting_url) { + el.dataset.setting_url = el.innerText; + } + + let link = document.createElement('a'); + link.classList.add('setting-link'); + link.href = librenmsUrl + '/settings/' + el.dataset.setting_url; + link.innerText = link.href; + link.target = '_blank'; + + let edit = document.createElement('a'); + edit.classList.add('url-edit-link'); + edit.title = "Change setting base url" + edit.onclick = promptSettingUrl; + edit.innerHTML = '' + + el.innerText = ''; + el.appendChild(link); + el.appendChild(document.createTextNode(' ')) + el.appendChild(edit); + }); + } else { + [].forEach.call(document.querySelectorAll('.admonition.setting>.admonition-title'), function (el) { + if (!el.dataset.setting_url) { + el.dataset.setting_url = el.innerText; + } + + let link = document.createElement('a'); + link.classList.add('setting-link'); + link.onclick = promptSettingUrl; + link.innerText = 'https:///' + el.dataset.setting_url; + el.innerText = ''; + el.appendChild(link); + }); + } +} + +document.addEventListener('DOMContentLoaded', function () { + wrapSettingsLinks(findGetParameter('librenms_url')); +}, false); diff --git a/doc/librenms.css b/doc/librenms.css index 0937c25e16..6cbb6bbb96 100644 --- a/doc/librenms.css +++ b/doc/librenms.css @@ -60,4 +60,50 @@ } } +/* Setting admonition */ +:root { + --md-admonition-icon--setting: url('data:image/svg+xml;charset=utf-8, ') +} +.md-typeset .admonition.setting, +.md-typeset details.setting { + border-color: rgb(43, 155, 70); +} +.md-typeset .setting > .admonition-title, +.md-typeset .setting > summary { + background-color: rgba(43, 155, 70, 0.1); + border-color: rgb(43, 155, 70); +} +.md-typeset .setting > .admonition-title::before, +.md-typeset .setting > summary::before { + background-color: rgb(43, 155, 70); + -webkit-mask-image: var(--md-admonition-icon--setting); + mask-image: var(--md-admonition-icon--setting); +} +.url-edit-link > svg { + float: right; + height: 1rem; + width: 1rem; + /*line-height: 1em;*/ + fill: rgb(43, 155, 70); + cursor: pointer; +} +.url-edit-link > svg:hover { + fill: rgb(37, 133, 59); +} +.setting-link { + /*font-size: 1.1em;*/ + /*line-height: 1em;*/ + cursor: pointer; +} +a.setting-link, a.setting-link:visited { + color: #000; +} + +a.setting-link:focus, a.setting-link:hover { + color: rgb(37, 133, 59); +} + +.md-typeset .admonition, .md-typeset details { + font-size: 1em; +} diff --git a/mkdocs.yml b/mkdocs.yml index 3a9fdd6446..6aef223e01 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -11,6 +11,7 @@ theme: site_dir: out site_url: https://docs.librenms.org markdown_extensions: + - admonition - pymdownx.tasklist - pymdownx.tilde - pymdownx.superfences @@ -35,7 +36,8 @@ extra_css: - https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css - librenms.css extra_javascript: - - librenms-docs.js + - js/docs-install-tab.js + - js/docs-settings-links.js extra: article_nav_top: false article_nav_bottom: true