fix #69 - option to completely hide window buttons

CHANGELOG.md

@@ -14,6 +14,7 @@ a feature and cleanup update.
 - improved: halved the number of css rules used -> much better performance.
 - improved: font imports must be define in the `mod.js` so that they can also be used in
   the enhancements menu.
+- improved: tiling window-manager support (can hide titlebars entirely without dragarea/buttons).
 - bugfix: enhancer settings should no longer reset on update (though this will not have
   effect until the release after this one).
 - bugfix: blue select tags are no longer purple.
@@ -29,9 +30,10 @@ a feature and cleanup update.
 
 - improved: added individual text-colour rules for different background colours.
 - improved: added variables for callout colouring.
-- improved: tiling window-manager support (can hide titlebars entirely without dragarea/buttons).
 - bugfix: block-level text colours are now changed properly.
 - bugfix: update property-layout to match notion changes again.
+- extension: "always on top" = add an arrow/button to show the notion window on top of other windows
+  even if it's not focused.
 - extension: "calendar scroll" = a button to scroll down to the current week for you.
 
 notion-deb-builder has been discovered to not generate an app.asar and so is no longer supported.

mods/core/buttons.js

@@ -16,7 +16,7 @@ module.exports = (store) => {
       element: helpers.createElement('<div class="window-buttons-area"></div>'),
       insert: [
         'alwaysontop',
-        ...(store().frameless && !is_mac
+        ...(store().frameless && !store().tiling_mode && !is_mac
           ? ['minimize', 'maximize', 'close']
           : []),
       ],
@@ -86,7 +86,7 @@ module.exports = (store) => {
       document.querySelector(`.window-button#btn-${btn}`).onclick =
         buttons.actions[btn];
     }
-    if (store().frameless && !is_mac) {
+    if (store().frameless && !store().tiling_mode && !is_mac) {
       window.addEventListener('resize', (event) => {
         Promise.resolve(buttons.icons.maximize()).then((icon) => {
           icon = icon.toString();

mods/core/client.js

@@ -35,7 +35,7 @@ module.exports = (store, __exports) => {
       document.body.classList.add('smooth-scrollbars');
 
     // frameless
-    if (store().frameless) {
+    if (store().frameless && !store().tiling_mode) {
       document.body.classList.add('frameless');
       // draggable area
       const dragarea = helpers.createElement(
@@ -154,7 +154,7 @@ module.exports = (store, __exports) => {
     });
     let sidebar_width;
     function setSidebarWidth(list) {
-      if (!store().frameless) return;
+      if (!store().frameless && store().tiling_mode) return;
       const new_sidebar_width =
         list[0].target.style.height === 'auto'
           ? '0px'

mods/core/css/menu.css

@@ -117,6 +117,9 @@ s {
 #menu-titlebar {
   background: var(--theme--dragarea);
 }
+#menu-titlebar:empty {
+  display: none;
+}
 
 /* alerts */
 

mods/core/menu.js

@@ -7,6 +7,7 @@
 'use strict';
 
 const store = require('../../pkg/store.js'),
+  { id } = require('./mod.js'),
   helpers = require('../../pkg/helpers.js'),
   fs = require('fs-extra'),
   path = require('path'),
@@ -14,8 +15,10 @@ const store = require('../../pkg/store.js'),
   browser = electron.remote.getCurrentWindow();
 
 window['__start'] = async () => {
+  if (!store(id).tiling_mode) {
     const buttons = require('./buttons.js')(() => ({ frameless: true }));
     document.querySelector('#menu-titlebar').appendChild(buttons.element);
+  }
 
   document.defaultView.addEventListener('keyup', (event) => {
     if (event.code === 'F5') location.reload();

mods/core/mod.js

@@ -44,6 +44,12 @@ module.exports = {
       type: 'input',
       value: 15,
     },
+    {
+      key: 'tiling_mode',
+      label: 'tiling window manager mode',
+      type: 'toggle',
+      value: false,
+    },
     {
       key: 'smooth_scrollbars',
       label: 'integrated scrollbars',

mods/core/render.js

@@ -16,6 +16,9 @@ module.exports = (store, __exports) => {
       ),
       default_styles = dragarea.getAttribute('style');
 
+    if (store().tiling_mode) {
+      dragarea.style.display = 'none';
+    } else {
       document
         .getElementById('notion')
         .addEventListener('ipc-message', (event) => {
@@ -27,5 +30,6 @@ module.exports = (store, __exports) => {
             }px; left: ${event.args[0]};`
           );
         });
+    }
   };
 };