update + port: bypass-preview, calendar-scroll

This commit is contained in:
dragonwocky 2021-10-04 22:44:51 +11:00
parent 022c08fe75
commit f2928371b6
3 changed files with 70 additions and 60 deletions

View File

@ -7,27 +7,32 @@
'use strict'; 'use strict';
export default async function (api, db) { export default async function (api, db) {
const { web, components } = api; const { web, notion } = api;
await web.whenReady(); await web.whenReady();
let _lastPage = {}; let _openPage = {};
function getCurrentPage() { function getCurrentPage() {
if (web.queryParams().get('p')) return { type: 'preview', id: web.queryParams().get('p') }; return {
return { type: 'page', id: location.pathname.split(/(-|\/)/g).reverse()[0] }; type: web.queryParams().get('p') ? 'preview' : 'page',
id: notion.getPageID(),
};
} }
web.addDocumentObserver((event) => { web.addDocumentObserver(
const currentPage = getCurrentPage(); (event) => {
if (currentPage.id !== _lastPage.id || currentPage.type !== _lastPage.type) { const currentPage = getCurrentPage();
const openAsPage = document.querySelector( if (currentPage.id !== _openPage.id || currentPage.type !== _openPage.type) {
'.notion-peek-renderer [style*="height: 45px;"] a' const openAsPage = document.querySelector(
); '.notion-peek-renderer [style*="height: 45px;"] a'
if (openAsPage) { );
if (currentPage.id === _lastPage.id && currentPage.type === 'preview') { if (openAsPage) {
history.back(); if (currentPage.id === _openPage.id && currentPage.type === 'preview') {
} else openAsPage.click(); history.back();
} else openAsPage.click();
}
_openPage = getCurrentPage();
} }
_lastPage = getCurrentPage(); },
} ['.notion-peek-renderer']
}); );
} }

View File

@ -5,9 +5,9 @@
*/ */
#calendar-scroll-to-week { #calendar-scroll-to-week {
background: var(--theme--button_hover); background: var(--theme--ui_interactive-hover);
border: 1px solid transparent; border: 1px solid transparent;
font-size: var(--theme--font_label-size); font-size: 14px;
color: var(--theme--text); color: var(--theme--text);
height: 24px; height: 24px;
border-radius: 3px; border-radius: 3px;
@ -15,7 +15,11 @@
padding: 0 0.5em; padding: 0 0.5em;
margin-right: 5px; margin-right: 5px;
} }
#calendar-scroll-to-week:focus,
#calendar-scroll-to-week:hover { #calendar-scroll-to-week:hover {
background: transparent; background: transparent;
border: 1px solid var(--theme--button_hover); border: 1px solid var(--theme--ui_interactive-hover);
}
#calendar-scroll-to-week:active {
background: var(--theme--ui_interactive-active);
} }

View File

@ -6,19 +6,17 @@
'use strict'; 'use strict';
import { web } from '../../api/_.mjs'; export default async function (api, db) {
const { web } = api;
const $button = web.createElement( const toolbarSelector = '.notion-calendar-view > :first-child > :first-child > :first-child',
web.html`<button id="calendar-scroll-to-week">Scroll</button>` $scrollButton = web.html`<button id="calendar-scroll-to-week">Scroll</button>`;
); $scrollButton.addEventListener('click', async (event) => {
$button.addEventListener('click', async (event) => { const $toolbar = document.querySelector(toolbarSelector),
let $day = document.querySelector('.notion-calendar-view-day[style*="background:"]'); now = new Date(),
while (!$day) { thisYear = now.getFullYear(),
const $toolbar = document.querySelector( thisMonth = now.getMonth(),
'.notion-calendar-view > :first-child > :first-child > :first-child' allMonths = {
),
year = +$toolbar.children[0].innerText.split(' ')[1],
month = {
'January': 0, 'January': 0,
'February': 1, 'February': 1,
'March': 2, 'March': 2,
@ -31,34 +29,37 @@ $button.addEventListener('click', async (event) => {
'October': 9, 'October': 9,
'November': 10, 'November': 10,
'December': 11, 'December': 11,
}[$toolbar.children[0].innerText.split(' ')[0]], };
now = new Date(); let $today;
switch (true) { while (!$today) {
case now.getFullYear() < year: const visibleYear = +$toolbar.children[0].innerText.split(' ')[1],
case now.getFullYear() === year && now.getMonth() < month: visibleMonth = allMonths[$toolbar.children[0].innerText.split(' ')[0]];
$toolbar.children[3].click(); switch (true) {
break; case thisYear < visibleYear:
case now.getFullYear() > year: case thisYear === visibleYear && thisMonth < visibleMonth:
case now.getFullYear() === year && now.getMonth() > month: $toolbar.children[3].click();
$toolbar.children[5].click(); break;
break; case thisYear > visibleYear:
default: case thisYear === visibleYear && thisMonth > visibleMonth:
await new Promise((res, rej) => requestAnimationFrame(res)); $toolbar.children[5].click();
$day = document.querySelector('.notion-calendar-view-day[style*="background:"]'); break;
default:
$today = document.querySelector('.notion-calendar-view-day[style*="background:"]');
}
await new Promise((res, rej) => requestAnimationFrame(res));
} }
await new Promise((res, rej) => requestAnimationFrame(res)); const $scroller = document.querySelector('.notion-frame .notion-scroller');
} $scroller.scroll({
const $scroller = document.querySelector('.notion-frame .notion-scroller'); top: $today.offsetParent.offsetParent.offsetTop + 70,
$scroller.scroll({ behavior: 'auto',
top: $day.offsetParent.offsetParent.offsetTop + 70, });
behavior: 'auto',
}); });
});
web.addDocumentObserver((event) => { const insertButton = () => {
if (document.contains($button)) return; if (document.contains($scrollButton)) return;
const toolbar = document.querySelector( const toolbar = document.querySelector(toolbarSelector);
'.notion-calendar-view > :first-child > :first-child > :first-child' if (toolbar) toolbar.insertBefore($scrollButton, toolbar.children[2]);
); };
if (toolbar) toolbar.insertBefore($button, toolbar.children[2]); web.addDocumentObserver(insertButton, [toolbarSelector]);
}); insertButton();
}