extension: weekly view

repo/calendar-scroll/client.mjs

@@ -6,58 +6,36 @@
 
 'use strict';
 
-export default function ({ web }, db) {
+const pageSelector = '.notion-page-content',
-  const toolbarSelector = '.notion-calendar-view > :first-child > :first-child > :first-child',
+  calendarSelector = '.notion-calendar-view:not([data-calendar-scroll])',
-    $scrollButton = web.html`<button id="enhancer--calendar-scroll">Scroll</button>`;
+  scrollerSelector = '.notion-frame > .notion-scroller',
-  $scrollButton.addEventListener('click', async (event) => {
+  toolbarSelector = '.notion-calendar-view > :first-child > :first-child > :first-child',
-    const $toolbar = document.querySelector(toolbarSelector),
+  todaySelector = '.notion-calendar-view-day[style*="background:"]';
-      now = new Date(),
-      thisYear = now.getFullYear(),
-      thisMonth = now.getMonth(),
-      allMonths = {
-        'January': 0,
-        'February': 1,
-        'March': 2,
-        'April': 3,
-        'May': 4,
-        'June': 5,
-        'July': 6,
-        'August': 7,
-        'September': 8,
-        'October': 9,
-        'November': 10,
-        'December': 11,
-      };
-    let $today;
-    while (!$today) {
-      const visibleYear = +$toolbar.children[0].innerText.split(' ')[1],
-        visibleMonth = allMonths[$toolbar.children[0].innerText.split(' ')[0]];
-      switch (true) {
-        case thisYear < visibleYear:
-        case thisYear === visibleYear && thisMonth < visibleMonth:
-          $toolbar.children[3].click();
-          break;
-        case thisYear > visibleYear:
-        case thisYear === visibleYear && thisMonth > visibleMonth:
-          $toolbar.children[5].click();
-          break;
-        default:
-          $today = document.querySelector('.notion-calendar-view-day[style*="background:"]');
-      }
-      await new Promise((res, rej) => requestAnimationFrame(res));
-    }
-    const $scroller = document.querySelector('.notion-frame .notion-scroller');
-    $scroller.scroll({
-      top: $today.offsetParent.offsetParent.offsetTop + 70,
-      behavior: 'auto',
-    });
-  });
 
+export default function ({ web }, db) {
   const insertButton = () => {
-    if (document.contains($scrollButton)) return;
+    document.querySelectorAll(calendarSelector).forEach(($calendar) => {
-    const $toolbar = document.querySelector(toolbarSelector);
+      $calendar.dataset.calendarScroll = true;
-    if ($toolbar) $toolbar.insertBefore($scrollButton, $toolbar.children[2]);
+      const $page = document.querySelector(pageSelector);
+      if ($page) return;
+      const $toolbar = $calendar.querySelector(toolbarSelector),
+        $pageScroller = document.querySelector(scrollerSelector),
+        $scrollButton = web.html`<button id="enhancer--calendar-scroll">Scroll</button>`;
+      $scrollButton.addEventListener('click', async (event) => {
+        let $today = $calendar.querySelector(todaySelector);
+        if (!$today) {
+          $toolbar.children[4].click();
+          await new Promise((res, rej) => setTimeout(res, 500));
+          $today = $calendar.querySelector(todaySelector);
+        }
+        $pageScroller.scroll({
+          top: $today.offsetParent.offsetParent.offsetTop + 70,
+          behavior: 'auto',
+        });
+      });
+      $toolbar.insertBefore($scrollButton, $toolbar.children[2]);
+    });
   };
-  web.addDocumentObserver(insertButton, ['.notion-calendar-view']);
+  web.addDocumentObserver(insertButton, [calendarSelector]);
   insertButton();
 }

repo/registry.json

@@ -27,6 +27,7 @@
   "topbar-icons",
   "word-counter",
   "calendar-scroll",
+  "weekly-view",
   "collapse-properties",
   "focus-mode"
 ]

repo/right-to-left/client.mjs

@@ -9,14 +9,14 @@
 
 export default async function ({ web }, db) {
   const pageContentSelector = `
-    .notion-page-content >
+      .notion-page-content >
-      div[data-block-id]:not([dir]):not(.notion-column_list-block):not(.notion-collection_view_page-block),
+        div[data-block-id]:not([dir]):not(.notion-column_list-block):not(.notion-collection_view_page-block),
-    [placeholder="Untitled"]:not([dir]),
+      [placeholder="Untitled"]:not([dir]),
-    .notion-column-block > div[data-block-id]:not([dir]),
+      .notion-column-block > div[data-block-id]:not([dir]),
-    .notion-collection_view-block:not([dir]),
+      .notion-collection_view-block:not([dir]),
-    .notion-table-view:not([dir]),
+      .notion-table-view:not([dir]),
-    .notion-board-view:not([dir]),
+      .notion-board-view:not([dir]),
-    .notion-gallery-view:not([dir])`,
+      .notion-gallery-view:not([dir])`,
     listItemSelector = `
       div[placeholder="List"]:not([style*="text-align: start"]),
       div[placeholder="To-do"]:not([style*="text-align: start"]),

repo/right-to-left/mod.json

@@ -2,8 +2,8 @@
   "name": "right to left",
   "id": "b28ee2b9-4d34-4e36-be8a-ab5be3d79f51",
   "version": "1.5.0",
-  "description": "enables auto rtl/ltr text direction detection..",
+  "description": "enables auto rtl/ltr text direction detection.",
-  "tags": ["extension", "automation"],
+  "tags": ["extension", "usability"],
   "authors": [
     {
       "name": "obahareth",

repo/weekly-view/client.mjs

@@ -0,0 +1,43 @@
+/*
+ * notion-enhancer: weekly view
+ * (c) 2021 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
+ * (https://notion-enhancer.github.io/) under the MIT license
+ */
+
+'use strict';
+
+export default async function ({ web }, db) {
+  const pageSelector = '.notion-page-content',
+    calendarSelector = '.notion-calendar-view',
+    viewSelector = '.notion-collection-view-select:not([data-weekly-view])',
+    todaySelector = '.notion-calendar-view-day[style*="background"]',
+    weekSelector = '[style="position: relative; display: flex; height: 124px;"]',
+    toolbarBtnSelector =
+      '.notion-calendar-view > :first-child > :first-child > :first-child > :nth-last-child(2)';
+
+  const transformCalendarView = () => {
+    const $page = document.querySelector(pageSelector);
+    document.querySelectorAll(viewSelector).forEach(async ($view) => {
+      if ($view.innerText.toLowerCase() !== 'weekly') return;
+      const $calendar = $view.parentElement.parentElement.parentElement.parentElement;
+      if (!$calendar.querySelector(todaySelector)) {
+        $calendar.querySelector(toolbarBtnSelector).click();
+      }
+      await new Promise((res, rej) => requestAnimationFrame(res));
+      if ($page) {
+        for (const $week of $calendar.querySelectorAll(weekSelector)) {
+          if (!$week.querySelector(todaySelector)) $week.style.height = '0';
+        }
+      } else {
+        const $weekContainer = $calendar.querySelector(weekSelector).parentElement;
+        $weekContainer.style.maxHeight = '124px';
+        for (const $week of $calendar.querySelectorAll(weekSelector)) {
+          if (!$week.querySelector(todaySelector)) {
+            $week.style.height = '0';
+          } else break;
+        }
+      }
+    });
+  };
+  web.addDocumentObserver(transformCalendarView, [calendarSelector]);
+}

repo/weekly-view/mod.json

@@ -0,0 +1,20 @@
+{
+  "name": "weekly view",
+  "id": "4c7acaea-6596-4590-85e5-8ac5a1455e8f",
+  "version": "0.6.0",
+  "description": "calendar views named \"weekly\" will show only the current week.",
+  "tags": ["extension", "layout"],
+  "authors": [
+    {
+      "name": "dragonwocky",
+      "email": "thedragonring.bod@gmail.com",
+      "homepage": "https://dragonwocky.me/",
+      "avatar": "https://dragonwocky.me/avatar.jpg"
+    }
+  ],
+  "js": {
+    "client": ["client.mjs"]
+  },
+  "css": {},
+  "options": []
+}