From 988b78085a82d1240d0aed5c6eb8a3293bc1aaa5 Mon Sep 17 00:00:00 2001 From: dragonwocky Date: Wed, 2 Sep 2020 22:56:40 +1000 Subject: [PATCH] calendar scroll extension - #74 --- repo/calendar-scroll/mod.js | 79 +++++++++++++++++++++++++++++++++ repo/calendar-scroll/styles.css | 20 +++++++++ 2 files changed, 99 insertions(+) create mode 100644 repo/calendar-scroll/mod.js create mode 100644 repo/calendar-scroll/styles.css diff --git a/repo/calendar-scroll/mod.js b/repo/calendar-scroll/mod.js new file mode 100644 index 0000000..44cf64f --- /dev/null +++ b/repo/calendar-scroll/mod.js @@ -0,0 +1,79 @@ +/* + * calendar scroll + * (c) 2020 dragonwocky (https://dragonwocky.me/) + * under the MIT license + */ + +'use strict'; + +const helpers = require('../../pkg/helpers.js'); + +module.exports = { + id: 'b1c7db33-dfee-489a-a76c-0dd66f7ed29a', + tags: ['extension'], + name: 'calendar scroll', + desc: + 'add a button to scroll down to the current week of a calendar for you.', + version: '0.1.0', + author: 'dragonwocky', + hacks: { + 'renderer/preload.js'(store, __exports) { + document.addEventListener('readystatechange', (event) => { + if (document.readyState !== 'complete') return false; + const attempt_interval = setInterval(enhance, 500); + function enhance() { + const notion_elem = document.querySelector('.notion-frame'); + if (!notion_elem) return; + clearInterval(attempt_interval); + + const button = helpers.createElement( + '' + ); + button.addEventListener('click', (event) => { + const collection_view = document.querySelector( + '.notion-collection-view-select' + ); + if (!collection_view) return; + const day = [ + ...collection_view.parentElement.parentElement.parentElement.parentElement.getElementsByClassName( + 'notion-calendar-view-day' + ), + ].find((day) => day.style.background); + if (!day) return; + const scroller = document.querySelector( + '.notion-frame .notion-scroller' + ); + scroller.scroll({ + top: day.offsetParent.offsetParent.offsetTop + 70, + }); + setTimeout( + () => + scroller.scroll({ + top: day.offsetParent.offsetParent.offsetTop + 70, + }), + 100 + ); + }); + + process(); + const observer = new MutationObserver(process); + observer.observe(notion_elem, { + childList: true, + subtree: true, + }); + function process(list, observer) { + if (document.querySelector('#calendar-scroll-to-week')) return; + const arrow = document.querySelector( + '.notion-selectable.notion-collection_view_page-block .chevronLeft' + ); + if (arrow) + arrow.parentElement.parentElement.insertBefore( + button, + arrow.parentElement + ); + } + } + }); + }, + }, +}; diff --git a/repo/calendar-scroll/styles.css b/repo/calendar-scroll/styles.css new file mode 100644 index 0000000..ed41f12 --- /dev/null +++ b/repo/calendar-scroll/styles.css @@ -0,0 +1,20 @@ +/* + * calendar scroll + * (c) 2020 dragonwocky (https://dragonwocky.me/) + * under the MIT license + */ + +#calendar-scroll-to-week { + background: var(--theme--interactive_hover); + border: 1px solid transparent; + font-size: var(--theme--font_label-size); + color: var(--theme--text); + height: 24px; + border-radius: 3px; + line-height: 1.2; + padding: 0 0.5em; +} +#calendar-scroll-to-week:hover { + background: transparent; + border: 1px solid var(--theme--interactive_hover); +}