diff --git a/CHANGELOG.md b/CHANGELOG.md index 038b7b8..49a8d6d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,18 @@ - [improved responsiveness](https://chrome.google.com/webstore/detail/notion%20%20-responsiveness-f/leadcilhbmibbkgbnjgmmnfgnnhmeddk) - [highlight/mark viewer](https://chrome.google.com/webstore/detail/notion%2B-mark-manager/hipgmnlpnimedfepbfbfiaobohhffcfc) - [advanced math editor](https://github.com/Manueloccorso/NotionMathEditor_BrowserExtension) +- re-orderable extensions + +### v0.9.1 (2020-09-26) + +- bugfix: font chooser will continue iterating through fonts after encountering a blank option. +- bugfix: block indents are no longer overriden. +- bugfix: neutral does not force full width pages. +- bugfix: bypass preview extension works with the back/forward arrows. +- bugfix: check all views on a page for a weekly calendar. +- bugfix: emoji sets no longer modifies the user agent = doesn't break hotkeys. + +> 📥 `npm i -g notion-enhancer@0.9.1` ### v0.9.0 (2020-09-20) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 0a08d6d..515c48f 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -30,6 +30,7 @@ download: ```sh git clone https://github.com/dragonwocky/notion-enhancer cd notion-enhancer +git checkout dev npm link ``` @@ -52,6 +53,12 @@ to keep a consistent informative code style it is preferred to name variables wi `snake_case`, functions/methods with `camelCase`, and classes with `PascalCase`. if a variable is a reference to a DOM element, it may be helpful to prefix it with a `$`. +some variables beginning with a double underscore are `__folder` paths and `ALL_CAPS` variables +are constant. this is not required, but these styles should not be used for any other purpose. + +the master branch is kept consistent with the current release, +so all changes should be made to the dev branch. + ## review active core devs will manually look through each pull request and communicate with contributors before merging to diff --git a/mods/bypass-preview/mod.js b/mods/bypass-preview/mod.js index 4047275..0a12995 100644 --- a/mods/bypass-preview/mod.js +++ b/mods/bypass-preview/mod.js @@ -19,23 +19,48 @@ module.exports = { if (document.readyState !== 'complete') return false; const attempt_interval = setInterval(enhance, 500); function enhance() { - const notion_elem = document.querySelector( - '.notion-default-overlay-container' - ); + const notion_elem = document.querySelector('.notion-app-inner'); if (!notion_elem) return; clearInterval(attempt_interval); - - process(); - const observer = new MutationObserver(process); + const observer = new MutationObserver(handle); observer.observe(notion_elem, { childList: true, subtree: true, }); - function process(list, observer) { - let preview = document.querySelector( - '.notion-peek-renderer [style*="height: 45px;"] a' - ); - if (preview) preview.click(); + + let pageHistory = []; + handle(); + function handle(list, observer) { + const pageID = (location.search + .slice(1) + .split('&') + .map((opt) => opt.split('=')) + .find((opt) => opt[0] === 'p') || [ + '', + ...location.pathname.split(/(-|\/)/g).reverse(), + ])[1], + preview = document.querySelector( + '.notion-peek-renderer [style*="height: 45px;"] a' + ); + if ( + pageID && + (!pageHistory[0] || + pageHistory[0][0] !== pageID || + pageHistory[0][1] !== !!preview) + ) { + if (preview) { + if ( + pageHistory[1] && + pageHistory[0][0] === pageID && + pageHistory[1][0] === pageID && + pageHistory[1][1] + ) { + document.querySelector('.notion-history-back-button').click(); + } else preview.click(); + } + // most recent is at start for easier access + pageHistory.unshift([pageID, !!preview]); + } } } }); diff --git a/mods/bypass-preview/styles.css b/mods/bypass-preview/styles.css new file mode 100644 index 0000000..95f2308 --- /dev/null +++ b/mods/bypass-preview/styles.css @@ -0,0 +1,9 @@ +/* + * bypass preview + * (c) 2020 dragonwocky (https://dragonwocky.me/) + * under the MIT license + */ + +.notion-peek-renderer { + opacity: 0; +} diff --git a/mods/calendar-scroll/mod.js b/mods/calendar-scroll/mod.js index 9925117..0d2f2ff 100644 --- a/mods/calendar-scroll/mod.js +++ b/mods/calendar-scroll/mod.js @@ -55,13 +55,13 @@ module.exports = { ); }); - process(); - const observer = new MutationObserver(process); + handle(); + const observer = new MutationObserver(handle); observer.observe(notion_elem, { childList: true, subtree: true, }); - function process(list, observer) { + function handle(list, observer) { if (document.querySelector('#calendar-scroll-to-week')) return; const arrow = document.querySelector( '.notion-selectable.notion-collection_view_page-block .chevronLeft' diff --git a/mods/core/css/theme.css b/mods/core/css/theme.css index ff38b69..052c6c0 100644 --- a/mods/core/css/theme.css +++ b/mods/core/css/theme.css @@ -52,7 +52,6 @@ [style*='pointer-events:'][style*='max-width: 100%; width: 100%'] { width: var(--theme--page_full-width) !important; } -.notion-text-block [style*='padding-left: 1.5em'], .notion-frame .notion-scroller [style*='padding-left: 136.5px;'] { padding-left: 0 !important; } diff --git a/mods/emoji-sets/mod.js b/mods/emoji-sets/mod.js index acce9ba..289da8b 100644 --- a/mods/emoji-sets/mod.js +++ b/mods/emoji-sets/mod.js @@ -11,7 +11,7 @@ module.exports = { tags: ['extension'], name: 'emoji sets', desc: 'pick from a variety of emoji styles to use.', - version: '0.2.0', + version: '0.3.0', author: 'dragonwocky', options: [ { @@ -38,58 +38,109 @@ module.exports = { ], hacks: { 'renderer/preload.js'(store, __exports) { - const useNative = - (store().style === 'microsoft' && process.platform === 'win32') || - (store().style === 'apple' && process.platform === 'darwin'); + let tweaked = false; - Object.defineProperty(navigator, 'userAgent', { - get: function () { - // macOS useragent uses system emojis instead of images - // = no need to download - return useNative - ? 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Safari/605.1.15 Notion/2.0.9 Electron/6.1.5' - : 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Notion/2.0.9 Chrome/76.0.3809.146 Electron/6.1.5 Safari/537.36'; - }, - }); - - if (!useNative) { - let tweaked = false; - - document.addEventListener('readystatechange', (event) => { - if (document.readyState !== 'complete') return false; - let queue = []; - const observer = new MutationObserver((list, observer) => { - if (!queue.length) requestAnimationFrame(process); - queue.push(...list); - }); - observer.observe(document.body, { - childList: true, - subtree: true, - characterData: true, - }); - function process() { - queue = []; - if (store().style !== 'twitter' || tweaked) { + document.addEventListener('readystatechange', (event) => { + if (document.readyState !== 'complete') return false; + let queue = []; + const observer = new MutationObserver((list, observer) => { + if (!queue.length) requestAnimationFrame(handle); + queue.push(...list); + }); + observer.observe(document.body, { + childList: true, + subtree: true, + characterData: true, + }); + function handle() { + queue = []; + const isMac = process.platform === 'darwin', + native = + (store().style === 'microsoft' && process.platform === 'win32') || + (store().style === 'apple' && isMac); + if (store().style !== (isMac ? 'apple' : 'twitter') || tweaked) { + if (isMac) { + if (native) { + document + .querySelectorAll('span[role="image"][aria-label]') + .forEach((el) => { + el.style.background = ''; + el.style.color = 'currentColor'; + }); + } else { + document + .querySelectorAll('span[role="image"][aria-label]') + .forEach((el) => { + if (!el.style.background.includes(store().style)) { + el.style.background = `url(https://emojicdn.elk.sh/${el.getAttribute( + 'aria-label' + )}?style=${store().style})`; + el.style.width = el.parentElement.style.fontSize; + el.style.backgroundSize = 'contain'; + el.style.backgroundRepeat = 'no-repeat'; + el.style.color = 'transparent'; + } + }); + } + } else { document .querySelectorAll( '[src*="notion-emojis.s3"]:not(.notion-emoji)' ) .forEach((el) => el.remove()); - document.querySelectorAll('.notion-emoji').forEach((el) => { - el.style.setProperty( - 'background', - `url(https://emojicdn.elk.sh/${el.getAttribute( - 'alt' - )}?style=${store().style})` - ); - el.style.setProperty('background-size', 'contain'); - el.style.setProperty('opacity', '1'); - }); - tweaked = true; + if (native) { + document.querySelectorAll('.notion-emoji').forEach((el) => { + if ( + el.parentElement.querySelectorAll( + 'span[role="image"][aria-label]' + ).length !== + el.parentElement.querySelectorAll('.notion-emoji').length + ) { + el.insertAdjacentHTML( + 'beforebegin', + `${el.getAttribute('alt')}` + ); + el.style.display = 'none'; + if (el.parentElement.getAttribute('contenteditable')) + el.remove(); + } + }); + } else { + document.querySelectorAll('.notion-emoji').forEach((el) => { + el.parentElement + .querySelectorAll('span[role="image"][aria-label]') + .forEach((text) => text.remove()); + if (!el.style.background.includes(store().style)) { + el.style.background = `url(https://emojicdn.elk.sh/${el.getAttribute( + 'aria-label' + )}?style=${store().style})`; + el.style.display = 'inline-block'; + el.style.backgroundSize = 'contain'; + el.style.backgroundRepeat = 'no-repeat'; + el.style.opacity = 1; + } + }); + } } + tweaked = true; } - }); - } + } + }); }, }, }; +// span[role="image"][aria-label] +/* */ + +//
+// 😀 +// 😀 +//
+ +// ✝ diff --git a/mods/emoji-sets/styles.css b/mods/emoji-sets/styles.css new file mode 100644 index 0000000..600e758 --- /dev/null +++ b/mods/emoji-sets/styles.css @@ -0,0 +1,5 @@ +.notion-emoji::after { + content: attr(aria-label, ''); + width: 1em; + height: 1em; +} diff --git a/mods/neutral/styles.css b/mods/neutral/styles.css index 1627c2c..8b28df9 100644 --- a/mods/neutral/styles.css +++ b/mods/neutral/styles.css @@ -12,7 +12,6 @@ --theme_dark--sidebar: #171717; --theme_dark--overlay: rgba(15, 15, 15, 0.6); --theme_dark--dragarea: #111111; - --theme_dark--page_normal-width: 100%; --theme_dark--font_sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, 'Apple Color Emoji', Arial, sans-serif, diff --git a/mods/weekly-view/mod.js b/mods/weekly-view/mod.js index e18bede..95a240e 100644 --- a/mods/weekly-view/mod.js +++ b/mods/weekly-view/mod.js @@ -30,23 +30,24 @@ module.exports = { subtree: true, }); function process(list, observer) { - const collection_view = document.querySelector( - '.notion-collection-view-select' - ); - if (!collection_view || collection_view.innerText != 'weekly') - return; - const days = collection_view.parentElement.parentElement.parentElement.parentElement.getElementsByClassName( - 'notion-calendar-view-day' - ), - today = [...days].find((day) => day.style.background), - height = today - ? getComputedStyle( - today.parentElement.parentElement - ).getPropertyValue('height') - : 0; - for (let day of days) - day.parentElement.parentElement.style.height = 0; - if (today) today.parentElement.parentElement.style.height = height; + document + .querySelectorAll('.notion-collection-view-select') + .forEach((collection_view) => { + if (collection_view.innerText != 'weekly') return; + const days = collection_view.parentElement.parentElement.parentElement.parentElement.getElementsByClassName( + 'notion-calendar-view-day' + ), + today = [...days].find((day) => day.style.background), + height = today + ? getComputedStyle( + today.parentElement.parentElement + ).getPropertyValue('height') + : 0; + for (let day of days) + day.parentElement.parentElement.style.height = 0; + if (today) + today.parentElement.parentElement.style.height = height; + }); } } }); diff --git a/mods/word-counter/mod.js b/mods/word-counter/mod.js index b6ace83..19edd55 100644 --- a/mods/word-counter/mod.js +++ b/mods/word-counter/mod.js @@ -119,6 +119,7 @@ module.exports = { '' )}`; $page.previousElementSibling.children[0].appendChild($container); + if (!$container.offsetParent) return; $container.offsetParent.appendChild($tooltip); $container .querySelectorAll('p') @@ -130,7 +131,6 @@ module.exports = { $container.querySelectorAll('[data-tooltip]').forEach((el) => { el.addEventListener('mouseenter', (e) => { $tooltip.innerText = el.getAttribute('data-tooltip'); - console.log(e.target); $tooltip.style.top = el.parentElement.offsetTop + 2.5 + 'px'; $tooltip.style.left = el.parentElement.offsetLeft + diff --git a/package.json b/package.json index cebae3a..d0cc94f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "notion-enhancer", - "version": "0.9.0", + "version": "0.9.1", "description": "an enhancer/customiser for the all-in-one productivity workspace notion.so", "main": "index.js", "bin": {