reduce lag due to maximization detect + wip property layout

mods/core/buttons.js

@@ -7,7 +7,8 @@
 'use strict';
 
 module.exports = (store) => {
-  const path = require('path'),
+  const electron = require('electron'),
+    path = require('path'),
     fs = require('fs-extra'),
     browser = require('electron').remote.getCurrentWindow(),
     is_mac = process.platform === 'darwin',
@@ -81,19 +82,19 @@ module.exports = (store) => {
       buttons.element.innerHTML += `<button class="window-button" id="btn-${btn}">${await buttons.icons[
         btn
       ]()}</button>`;
-      setTimeout(
+    }
-        () =>
+    for (let btn of buttons.insert) {
-          (document.querySelector(`.window-button#btn-${btn}`).onclick =
+      document.querySelector(`.window-button#btn-${btn}`).onclick =
-            buttons.actions[btn]),
+        buttons.actions[btn];
-        10
-      );
     }
     if (store().frameless && !is_mac) {
-      setInterval(async () => {
+      window.addEventListener('resize', (event) => {
-        const icon = (await buttons.icons.maximize()).toString(),
+        Promise.resolve(buttons.icons.maximize()).then((icon) => {
-          el = buttons.element.querySelector('#btn-maximize');
+          icon = icon.toString();
-        if (el.innerHTML != icon) el.innerHTML = icon;
+          const el = buttons.element.querySelector('#btn-maximize');
-      }, 100);
+          if (el.innerHTML != icon) el.innerHTML = icon;
+        });
+      });
     }
   })();
 

mods/core/client.js

@@ -127,14 +127,17 @@ module.exports = (store, __exports) => {
     observer.observe(document.querySelector('.notion-sidebar'), {
       attributes: true,
     });
+    let sidebar_width;
     function setSidebarWidth(list, observer) {
       if (!store().frameless) return;
-      electron.ipcRenderer.sendToHost(
+      const new_sidebar_width =
-        'enhancer:sidebar-width',
         list[0].target.style.height === 'auto'
           ? '0px'
-          : list[0].target.style.width
+          : list[0].target.style.width;
-      );
+      if (new_sidebar_width !== sidebar_width) {
+        sidebar_width = new_sidebar_width;
+        electron.ipcRenderer.sendToHost('enhancer:sidebar-width');
+      }
     }
   }
 };

mods/property-layout/mod.js

@@ -0,0 +1,84 @@
+/*
+ * property layout
+ * (c) 2020 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
+ * (c) 2020 alexander-kazakov
+ * under the MIT license
+ */
+
+'use strict';
+
+module.exports = {
+  id: '4034a578-7dd3-4633-80c6-f47ac5b7b160',
+  tags: ['extension'],
+  name: 'property layout',
+  desc: 'auto-collapse page properties that usually push down page content.',
+  version: '0.2.1',
+  author: 'alexander-kazakov',
+  hacks: {
+    'renderer/preload.js'(store, __exports) {
+      document.addEventListener('readystatechange', (event) => {
+        if (document.readyState !== 'complete') return false;
+
+        var isVisible = false;
+
+        function setPropertiesListVisibility(propertiesList, visible) {
+          if (visible) {
+            // Show properties list section
+            propertiesList.style.height = null;
+            propertiesList.style.display = null;
+            isVisible = true;
+          } else {
+            // Hide properties list section
+            propertiesList.style.height = 0;
+            propertiesList.style.display = 'none';
+            isVisible = false;
+          }
+        }
+
+        // Called every time something new loads inside Notion window
+        // e.g. you navigate to a different Notion page
+        var onPageChange = function () {
+          console.log('Notion Layout Improver: Something changed');
+
+          // Find the block with properties list
+          var propertiesLists = document.querySelectorAll(
+            ".notion-scroller.vertical > div:nth-child(2)[style='width: 100%; font-size: 14px;']"
+          );
+
+          // For each found properties list
+          propertiesLists.forEach(function (propertiesList) {
+            console.log('Found properties list');
+
+            // Set up the toggle button
+            let toggleButton = document.createElement('button');
+            toggleButton.setAttribute('class', 'propertiesToggleBar');
+            toggleButton.innerHTML = '-';
+            toggleButton.onclick = function () {
+              setPropertiesListVisibility(propertiesList, !isVisible);
+            };
+
+            // If not already processed this properties list,
+            // add the toggle button and hide the list
+            if (!(propertiesList.id === 'already_processed')) {
+              console.log(
+                'Notion Layout Improver: Processing new properties list'
+              );
+              var parentBlockForButton =
+                propertiesList.parentElement.firstChild.firstChild;
+              parentBlockForButton.appendChild(toggleButton);
+              setPropertiesListVisibility(propertiesList, false);
+              propertiesList.id = 'already_processed';
+            }
+          });
+        };
+
+        // This calls onPageChange function each time Notion window changes
+        // e.g. you navigate to a new Notion page
+        const targetNode = document.body;
+        const config = { attributes: false, childList: true, subtree: true };
+        const observer = new MutationObserver(onPageChange);
+        observer.observe(targetNode, config);
+      });
+    },
+  },
+};

mods/weekly-view/mod.js

@@ -48,61 +48,6 @@ module.exports = {
           }
         }
       });
-
-      // document.addEventListener('readystatechange', (event) => {
-      //   if (document.readyState !== 'complete') return false;
-      //   let queue = [];
-      //   const observer = new MutationObserver((list, observer) => {
-      //     if (!queue.length) requestAnimationFrame(() => process(queue));
-      //     queue.push(...list);
-      //   });
-      //   observer.observe(document, {
-      //     // subtree: true,
-      //   });
-      //   function process(list) {
-      //     queue = [];
-      //     if (
-      //       list.find((e) => e.target.matches('.notion-collection-view-select'))
-      //     )
-      //       console.log(list);
-
-      // for (let elem of document.getElementsByClassName(
-      //   'notion-collection-view-select'
-      // )) {
-      //   // console.log("this is working2");
-      //   if (elem.innerText === 'weekly') {
-      //     // console.log("this is working3");
-      //     var days_list = elem.parentElement.parentElement.parentElement.parentElement.getElementsByClassName(
-      //       'notion-calendar-view-day'
-      //     );
-      //     for (let index = 0; index < days_list.length; index++) {
-      //       // const element = array[index];
-      //       if (days_list[index].style.background) {
-      //         days_list[index].parentElement.parentElement.classList.add(
-      //           'this_week'
-      //         );
-      //         // console.log("yay");
-      //       }
-      //     }
-      //     var weeks = document.getElementsByClassName('this_week')[0]
-      //       .parentElement.children;
-      //     // delete al div that not contain a class of "this_week"
-      //     while (weeks.length > 1) {
-      //       for (let index = 0; index < weeks.length; index++) {
-      //         // const element = array[index];
-
-      //         if (weeks[index].classList.contains('this_week')) {
-      //           console.log('yes');
-      //         } else {
-      //           // console.log(index);
-      //           weeks[index].style.display = 'none';
-      //         }
-      //       }
-      //     }
-      //   }
-      // }
-      //   }
-      // });
     },
   },
 };