From 5b5b08ae7ba03b408f92954b9fcc0a40ed8b7756 Mon Sep 17 00:00:00 2001 From: manavortex Date: Sat, 13 Mar 2021 11:20:43 +0100 Subject: [PATCH] extension moveblogselector, see MR 2037 --- Extensions/moveblogselector.css | 13 ++++ Extensions/moveblogselector.icon.js | 1 + Extensions/moveblogselector.js | 97 +++++++++++++++++++++++++++++ 3 files changed, 111 insertions(+) create mode 100644 Extensions/moveblogselector.css create mode 100644 Extensions/moveblogselector.icon.js create mode 100644 Extensions/moveblogselector.js diff --git a/Extensions/moveblogselector.css b/Extensions/moveblogselector.css new file mode 100644 index 000000000..44c84e548 --- /dev/null +++ b/Extensions/moveblogselector.css @@ -0,0 +1,13 @@ +#xkit-interface-buttons.inline { + float: none; + display: inline-block; + padding-right: 0.5em; + border-right: 1px solid lightgray; + height: 2em; +} + +#xkit-interface-buttons.inline > * { + display: inherit; + height: 1.5em; + vertical-align: sub; +} \ No newline at end of file diff --git a/Extensions/moveblogselector.icon.js b/Extensions/moveblogselector.icon.js new file mode 100644 index 000000000..15f2896c8 --- /dev/null +++ b/Extensions/moveblogselector.icon.js @@ -0,0 +1 @@ +data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADAAgMAAAAvsoSUAAAACVBMVEUAAAAAAAAAAACDY+nAAAAAA3RSTlMA/4CE6rqMAAAAoUlEQVR4Ae3PoRUCMQDAUN65DnIj9R6SUViCfcFGpXXwSHzEv1VV/UbzU0NDQ8NqDQ0NDQ0NDQ0NDQ2viS4dTg53HQaHhw4Hh+cmggRHkOAIEhxBgiNIcAQJjiDBESQ4ggRHkOAIEHYQJDiCBEeQ4AgSHEGCI0hwBAirCBIcQYIjSHAECd4AYQ1BgiNI8E4SvEGCd2wQqmpKDQ3/NFRVfUlvNddxSLdUkP4AAAAASUVORK5CYII= \ No newline at end of file diff --git a/Extensions/moveblogselector.js b/Extensions/moveblogselector.js new file mode 100644 index 000000000..d0afa83cc --- /dev/null +++ b/Extensions/moveblogselector.js @@ -0,0 +1,97 @@ +//* TITLE Blog Selector to bottom **// +//* VERSION 1.0.0 **// +//* DESCRIPTION Moves the blog selector from top of form to bottom of form **// +//* DEVELOPER manavortex **// +//* FRAME false **// +//* BETA false **// + +XKit.extensions.moveblogselector = new Object({ + running: false, + + preferences: { + sep0: { + text: 'Form footer tweaks', + type: 'separator', + }, + relocate_btns: { + text: 'Merge xkit button controls into header form? (more compact footer)', + default: true, + value: true, + }, + }, + + run: function() { + this.running = true; + XKit.tools.init_css('moveblogselector'); + XKit.post_listener.add('moveblogselector', () => this.moveElements()); + }, + + destroy: function() { + this.running = false; + XKit.post_listener.remove('moveblogselector'); + }, + + moveElements: async function() { + /* + * move post form header to bottom + */ + if ( + this.insertNodeBefore( + await this.checkElement('.post-form--header'), + await this.checkElement('.post-form--bottom') + ) + ) { + // if successful: add a clearfix to parent so it doesn't look shitty + const firstChild = document.querySelector('.post-container > :first-child'); + if ((firstChild.className || '').indexOf('clearfix') < 0) { + const postContainer = document.querySelector('.post-container'); + const clearfix = document.createElement('div'); + clearfix.className = 'clearfix'; + clearfix.style.height = '1em'; + postContainer.insertBefore(clearfix, firstChild); + } + } + + if (!this.preferences.relocate_btns.value) return; + /* + * move xkit post controls adjacent to settings button + */ + + const xkitBtn = await this.checkElement('.post-form--controls [id*="xkit"]'); + const settingsBtn = await this.checkElement('.post-form--post-settings-button'); + if (this.insertNodeBefore(xkitBtn, settingsBtn)) { + xkitBtn.classList.add('inline'); + } + }, + + /** + * Async function: call with checkElement('#myElement').then((el) { ... }) . + * Or see first block in waitForAndPrepend as per nightpool's suggestion in MR 2037 + * + * @param {string} selector - document query selector. + * @param {string} returnAry - run querySelectorAll rather than querySelector? + */ + checkElement: async function(selector, returnAry = false) { + while (this.running && document.querySelectorAll(selector).length === 0) { + await new Promise((resolve) => setTimeout(resolve, 150)); + } + return returnAry + ? document.querySelectorAll(selector) + : document.querySelector(selector); + }, + + /** + * Be null-safe. Be vewwy, vewwy null-safe. + * + * @param {HTMLElement} elementNode - node to insert. + * @param {HTMLElement} siblingNode - node to insert before. + * @returns {boolean} success check + */ + insertNodeBefore(elementNode, siblingNode) { + return ( + !!elementNode && + !!siblingNode && + !!siblingNode.parentNode.insertBefore(elementNode, siblingNode) + ); + }, +}); \ No newline at end of file