Merge pull request #1 from dragonwocky/dev

Update
This commit is contained in:
Alejandro Romano 2020-10-12 13:46:49 -03:00 committed by GitHub
commit 252c4a0b3f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 241 additions and 126 deletions

View File

@ -17,6 +17,8 @@ a flexibility update.
- new: in-page columns disabled/wrapped and wider pages when the window is narrower than 600px
for improved responsiveness.
- new: relaunch button in tray menu.
- new: a core mod option for a default page id/url (all new windows will load it instead of the
normal "most recent" page).
- improved: a core mod option to make transitions snappy/0s.
- improved: menu will now respect integrated titlebar setting.
- improved: use keyup listeners instead of a globalShortcut for the enhancements menu toggle.
@ -32,6 +34,7 @@ a flexibility update.
- bugfix: remove focus mode footer from neutral theme.
- bugfix: improvements to the colour theming, particularly to make real- and fake-light/dark
modes (as applied by the night shift extension) look consistent.
- bugfix: font sizing applied to overlays/previews.
- tweak: sticky table/list rows.
- theme: "material ocean" = an oceanic colour palette.
- theme: "dracula" = a theme based on the popular dracula color palette

View File

@ -15,7 +15,7 @@ module.exports = (store) => {
buttons = {
element: helpers.createElement('<div class="window-buttons-area"></div>'),
insert: [
...((store('mods', {})['72886371-dada-49a7-9afc-9f275ecf29d3'] || {})
...((store('mods')['72886371-dada-49a7-9afc-9f275ecf29d3'] || {})
.enabled
? ['alwaysontop']
: []),

View File

@ -19,12 +19,16 @@ module.exports = (store, __exports) => {
// additional hotkeys
document.defaultView.addEventListener('keyup', (event) => {
if (event.code === 'F5') location.reload();
// open menu on hotkey toggle
const hotkey = toKeyEvent(store().menu_toggle);
let triggered = true;
for (let prop in hotkey)
if (hotkey[prop] !== event[prop]) triggered = false;
if (triggered) electron.ipcRenderer.send('enhancer:open-menu');
if (
!(store('mods')['e1692c29-475e-437b-b7ff-3eee872e1a42'] || {}).enabled
) {
// open menu on hotkey toggle
const hotkey = toKeyEvent(store().menu_toggle);
let triggered = true;
for (let prop in hotkey)
if (hotkey[prop] !== event[prop]) triggered = false;
if (triggered) electron.ipcRenderer.send('enhancer:open-menu');
}
});
const attempt_interval = setInterval(enhance, 500);
@ -43,7 +47,11 @@ module.exports = (store, __exports) => {
document.body.classList.add('snappy-transitions');
// frameless
if (store().frameless && !store().tiling_mode && !store().tabs) {
if (
store().frameless &&
!store().tiling_mode &&
!(store('mods')['e1692c29-475e-437b-b7ff-3eee872e1a42'] || {}).enabled
) {
document.body.classList.add('frameless');
// draggable area
document
@ -56,7 +64,9 @@ module.exports = (store, __exports) => {
}
// window buttons
if (!store().tabs) {
if (
!(store('mods')['e1692c29-475e-437b-b7ff-3eee872e1a42'] || {}).enabled
) {
const buttons = require('./buttons.js')(store);
document
.querySelector('.notion-topbar > div[style*="display: flex"]')
@ -153,7 +163,9 @@ module.exports = (store, __exports) => {
'--theme--code_inline-background',
].map((rule) => [rule, getStyle(rule)])
);
if (store().tabs) {
if (
(store('mods')['e1692c29-475e-437b-b7ff-3eee872e1a42'] || {}).enabled
) {
electron.ipcRenderer.sendToHost(
'enhancer:set-tab-theme',
[
@ -179,7 +191,7 @@ module.exports = (store, __exports) => {
);
electron.ipcRenderer.on('enhancer:get-menu-theme', setThemeVars);
if (store().tabs) {
if ((store('mods')['e1692c29-475e-437b-b7ff-3eee872e1a42'] || {}).enabled) {
let tab_title = '';
__electronApi.setWindowTitle = (title) => {
if (tab_title !== title) {

View File

@ -152,7 +152,8 @@
[style*='SFMono-Regular'] {
font-family: var(--theme--font_code) !important;
}
.notion-frame .notion-page-block div[placeholder='Untitled'] {
.notion-frame .notion-page-block div[placeholder='Untitled'],
.notion-overlay-container .notion-page-block div[placeholder='Untitled']{
font-size: calc(
var(--theme--font_body-size) * (var(--theme--font_heading1-size) / 1em)
) !important;
@ -172,15 +173,16 @@
var(--theme--font_body-size) * (var(--theme--font_heading3-size) / 1em)
) !important;
}
.notion-frame .notion-scroller.vertical.horizontal [style*='font-size: 14px'] {
.notion-frame .notion-scroller.vertical.horizontal [style*='font-size: 14px'],
.notion-overlay-container .notion-scroller.vertical [style*='font-size: 14px']{
font-size: var(--theme--font_label-size) !important;
}
.notion-frame .notion-scroller.vertical.horizontal .notion-page-content {
.notion-frame .notion-scroller.vertical.horizontal .notion-page-content,
.notion-overlay-container .notion-scroller.vertical .notion-page-content {
font-size: var(--theme--font_body-size) !important;
}
.notion-frame
.notion-scroller.vertical.horizontal
.notion-page-content[style*='font-size: 14px'] {
.notion-frame .notion-scroller.vertical.horizontal .notion-page-content[style*='font-size: 14px'],
.notion-overlay-container .notion-scroller.vertical .notion-page-content[style*='font-size: 14px'] {
font-size: var(--theme--font_body-size_small) !important;
}
.notion-code-block [placeholder=' '] {

View File

@ -14,47 +14,43 @@ const store = require('../../pkg/store.js'),
{ toKeyEvent } = require('keyboardevent-from-electron-accelerator');
window['__start'] = async () => {
// mod loader
const modules = helpers.getEnhancements();
if (modules.loaded.length)
console.info(
`<notion-enhancer> enhancements loaded: ${modules.loaded
.map((mod) => mod.name)
.join(', ')}.`
);
if (modules.invalid.length) {
createAlert(
'error',
`invalid mods found: ${modules.invalid
.map((mod) => `<b>${mod}</b>`)
.join(', ')}.`
).append();
}
const coreStore = (...args) => {
const mod = modules.loaded.find(
(m) => m.id === '0f0bf8b6-eae6-4273-b307-8fc43f2ee082'
);
return !args.length
? store(mod.id, mod.defaults)
: args.length === 1 && typeof args[0] === 'object'
? store(mod.id, { ...mod.defaults, ...args[0] })
: store(args[0], { ...mod.defaults, ...args[1] });
};
const buttons = require('./buttons.js')(() => ({
'72886371-dada-49a7-9afc-9f275ecf29d3': {
enabled: (store('mods')['72886371-dada-49a7-9afc-9f275ecf29d3'] || {})
.enabled,
},
tiling_mode: store('0f0bf8b6-eae6-4273-b307-8fc43f2ee082').tiling_mode,
frameless: store('0f0bf8b6-eae6-4273-b307-8fc43f2ee082').frameless,
tiling_mode: coreStore().tiling_mode,
frameless: coreStore().frameless,
}));
document.querySelector('#titlebar').appendChild(buttons.element);
document.defaultView.addEventListener('keyup', (event) => {
if (event.code === 'F5') location.reload();
const meta =
!(event.ctrlKey || event.metaKey) && !event.altKey && !event.shiftKey;
if (
meta &&
document.activeElement.parentElement.id === 'tags' &&
event.key === 'Enter'
)
document.activeElement.click();
if (document.activeElement.tagName.toLowerCase() === 'input') {
if (document.activeElement.type === 'checkbox' && event.key === 'Enter')
document.activeElement.checked = !document.activeElement.checked;
if (
['Escape', 'Enter'].includes(event.key) &&
document.activeElement.type !== 'checkbox' &&
(document.activeElement.parentElement.id !== 'search' ||
event.key === 'Escape')
)
document.activeElement.blur();
} else if (meta && event.key === '/')
document.querySelector('#search > input').focus();
if (
(event.ctrlKey || event.metaKey) &&
event.key === 'f' &&
!event.altKey &&
!event.shiftKey
)
document.querySelector('#search > input').focus();
});
electron.ipcRenderer.send('enhancer:get-menu-theme');
electron.ipcRenderer.on('enhancer:set-menu-theme', (event, theme) => {
for (const style of theme)
@ -120,26 +116,10 @@ window['__start'] = async () => {
).prepend();
});
// mod loader
const modules = helpers.getEnhancements();
if (modules.loaded.length)
console.info(
`<notion-enhancer> enhancements loaded: ${modules.loaded
.map((mod) => mod.name)
.join(', ')}.`
);
if (modules.invalid.length) {
createAlert(
'error',
`invalid mods found: ${modules.invalid
.map((mod) => `<b>${mod}</b>`)
.join(', ')}.`
).append();
}
// further-configuration popup
const $popup = document.querySelector('#popup');
document.addEventListener('keyup', (event) => {
if (event.code === 'F5') location.reload();
// further-configuration popup
if (
$popup.classList.contains('visible') &&
['Enter', 'Escape'].includes(event.key)
@ -147,18 +127,41 @@ window['__start'] = async () => {
$popup.classList.remove('visible');
// close window on hotkey toggle
console.log();
const hotkey = toKeyEvent(
store('0f0bf8b6-eae6-4273-b307-8fc43f2ee082', {
menu_toggle: modules.loaded
.find((m) => m.id === '0f0bf8b6-eae6-4273-b307-8fc43f2ee082')
.options.find((o) => o.key === 'menu_toggle').value,
}).menu_toggle
);
const hotkey = toKeyEvent(coreStore().menu_toggle);
let triggered = true;
for (let prop in hotkey)
if (hotkey[prop] !== event[prop]) triggered = false;
if (triggered) electron.remote.getCurrentWindow().close();
// focus search
const meta =
!(event.ctrlKey || event.metaKey) && !event.altKey && !event.shiftKey;
if (
meta &&
document.activeElement.parentElement.id === 'tags' &&
event.key === 'Enter'
)
document.activeElement.click();
if (document.activeElement.tagName.toLowerCase() === 'input') {
if (document.activeElement.type === 'checkbox' && event.key === 'Enter')
document.activeElement.checked = !document.activeElement.checked;
if (
['Escape', 'Enter'].includes(event.key) &&
document.activeElement.type !== 'checkbox' &&
(document.activeElement.parentElement.id !== 'search' ||
event.key === 'Escape')
)
document.activeElement.blur();
} else if (meta && event.key === '/')
document.querySelector('#search > input').focus();
if (
(event.ctrlKey || event.metaKey) &&
event.key === 'f' &&
!event.altKey &&
!event.shiftKey
)
document.querySelector('#search > input').focus();
});
let colorpicker_target = null;
const $colorpicker = colorjoe
.rgb('colorpicker')
@ -171,7 +174,6 @@ window['__start'] = async () => {
store(colorpicker_target.id)[colorpicker_target.key] = color.css();
})
.update();
document
.querySelector('#colorpicker')
.appendChild(
@ -424,11 +426,13 @@ window['__start'] = async () => {
};
mod.elem = helpers.createElement(`
<section class="${
mod.tags.includes('core') || enabled ? 'enabled' : 'disabled'
mod.id === '0f0bf8b6-eae6-4273-b307-8fc43f2ee082' || enabled
? 'enabled'
: 'disabled'
}" id="${mod.id}">
<div class="meta">
<h3 ${
mod.tags.includes('core')
mod.id === '0f0bf8b6-eae6-4273-b307-8fc43f2ee082'
? `>${mod.name}`
: `class="toggle">
<input type="checkbox" id="enable_${mod.id}"

View File

@ -14,12 +14,6 @@ module.exports = {
version: require('../../package.json').version,
author: 'dragonwocky',
options: [
{
key: 'tabs',
label: 'tabbable windows',
type: 'toggle',
value: false,
},
{
key: 'openhidden',
label: 'hide app on open',
@ -80,6 +74,12 @@ module.exports = {
type: 'input',
value: 'Alt+E',
},
{
key: 'default_page',
label: 'open to default page id/url:',
type: 'input',
value: '',
},
],
hacks: {
'main/main.js': require('./tray.js'),

View File

@ -9,7 +9,6 @@
const url = require('url'),
path = require('path'),
electron = require('electron'),
browserWindow = electron.remote.getCurrentWindow(),
{ __notion } = require('../../pkg/helpers.js'),
config = require(`${__notion}/app/config.js`),
constants = require(`${__notion}/app/shared/constants.js`),
@ -19,17 +18,22 @@ const url = require('url'),
koMessages = require(`${__notion}/app/i18n/ko_KR/messages.json`),
schemeHelpers = require(`${__notion}/app/shared/schemeHelpers.js`),
React = require(`${__notion}/app/node_modules/react/index.js`),
ReactDOM = require(`${__notion}/app/node_modules/react-dom/index.js`);
ReactDOM = require(`${__notion}/app/node_modules/react-dom/index.js`),
{ toKeyEvent } = require('keyboardevent-from-electron-accelerator');
const insertCSP = `
const csp = document.createElement('meta');
csp.httpEquiv = 'Content-Security-Policy';
csp.content = "script-src 'self' 'unsafe-inline' 'unsafe-eval' enhancement: https://gist.github.com https://apis.google.com https://api.amplitude.com https://widget.intercom.io https://js.intercomcdn.com https://logs-01.loggly.com https://cdn.segment.com https://analytics.pgncs.notion.so https://checkout.stripe.com https://embed.typeform.com https://admin.typeform.com https://platform.twitter.com https://cdn.syndication.twimg.com; connect-src 'self' https://msgstore.www.notion.so wss://msgstore.www.notion.so https://notion-emojis.s3-us-west-2.amazonaws.com https://s3-us-west-2.amazonaws.com https://s3.us-west-2.amazonaws.com https://notion-production-snapshots-2.s3.us-west-2.amazonaws.com https: http: https://api.amplitude.com https://api.embed.ly https://js.intercomcdn.com https://api-iam.intercom.io wss://nexus-websocket-a.intercom.io https://logs-01.loggly.com https://api.segment.io https://api.pgncs.notion.so https://checkout.stripe.com https://cdn.contentful.com https://preview.contentful.com https://images.ctfassets.net https://api.unsplash.com https://boards-api.greenhouse.io; font-src 'self' data: enhancement: https: http:; img-src 'self' data: blob: https: https://platform.twitter.com https://syndication.twitter.com https://pbs.twimg.com https://ton.twimg.com; style-src 'self' 'unsafe-inline' enhancement: https: http:; frame-src https: http:; media-src https: http:";
document.head.appendChild(csp);
`;
`,
idToNotionURL = (id) =>
`notion://www.notion.so/${
url.parse(id).pathname.split('/').reverse()[0] || ''
}/${url.parse(id).search || ''}`;
module.exports = (store, __exports) => {
if (store().tabs) {
if ((store('mods')['e1692c29-475e-437b-b7ff-3eee872e1a42'] || {}).enabled) {
class Index extends React.PureComponent {
constructor() {
super(...arguments);
@ -157,22 +161,39 @@ module.exports = (store, __exports) => {
const list = new Map(this.state.tabs);
while (this.state.tabs.get(id)) id++;
list.delete(id);
if (this.views.html[id]) {
this.views.html[id].style.opacity = '0';
let unhide;
unhide = () => {
this.views.html[id].style.opacity = '';
this.views.html[id].removeEventListener('did-stop-loading', unhide);
};
this.views.html[id].addEventListener('did-stop-loading', unhide);
this.views.html[id].loadURL(this.views.current.$el().src);
}
this.openTab(id, list);
this.openTab(id, list, true);
}
openTab(id, state = new Map(this.state.tabs)) {
openTab(id, state = new Map(this.state.tabs), load) {
if (!id && id !== 0) return;
this.views.current.id = id;
this.setState({ tabs: state.set(id, true) }, this.focusTab.bind(this));
this.setState({ tabs: state.set(id, true) }, async () => {
this.focusTab();
if (load) {
await new Promise((res, rej) => {
let attempt;
attempt = setInterval(() => {
if (!document.body.contains(this.views.html[id])) return;
clearInterval(attempt);
res();
}, 50);
});
this.views.html[id].style.opacity = '0';
let unhide;
unhide = () => {
this.views.html[id].style.opacity = '';
this.views.html[id].removeEventListener(
'did-stop-loading',
unhide
);
};
this.views.html[id].addEventListener('did-stop-loading', unhide);
this.views.html[id].loadURL(
store().default_page
? idToNotionURL(store().default_page)
: this.views.current.$el().src
);
}
});
}
closeTab(id) {
if ((!id && id !== 0) || !this.state.tabs.get(id)) return;
@ -219,11 +240,12 @@ module.exports = (store, __exports) => {
) {
this.views.tabs[event.target.id].children[0].innerText =
event.args[0];
const electronWindow = electron.remote.getCurrentWindow();
if (
event.target.id == this.views.current.id &&
browserWindow.getTitle() !== event.args[0]
electronWindow.getTitle() !== event.args[0]
)
browserWindow.setTitle(event.args[0]);
electronWindow.setTitle(event.args[0]);
}
}
startSearch(isPeekView) {
@ -426,25 +448,41 @@ module.exports = (store, __exports) => {
this.setState({ zoomFactor });
}
);
let electronWindow;
try {
electronWindow = electron.remote.getCurrentWindow();
} catch (error) {
notionIpc.sendToMain('notion:log-error', {
level: 'error',
from: 'index',
type: 'GetCurrentWindowError',
error: error.message,
});
}
if (!electronWindow) {
this.setState({ error: true });
this.handleReload();
return;
}
const sendFullScreenChangeEvent = () => {
notionIpc.sendIndexToNotion(
$notion,
'notion:full-screen-changed'
);
};
browserWindow.addListener(
electronWindow.addListener(
'enter-full-screen',
sendFullScreenChangeEvent
);
browserWindow.addListener(
electronWindow.addListener(
'leave-full-screen',
sendFullScreenChangeEvent
);
browserWindow.addListener(
electronWindow.addListener(
'enter-html-full-screen',
sendFullScreenChangeEvent
);
browserWindow.addListener(
electronWindow.addListener(
'leave-html-full-screen',
sendFullScreenChangeEvent
);
@ -717,13 +755,24 @@ module.exports = (store, __exports) => {
window['__start'] = () => {
document.head.innerHTML += `<link rel="stylesheet" href="${__dirname}/css/tabs.css" />`;
// open menu on hotkey toggle
document.addEventListener('keyup', (event) => {
const hotkey = toKeyEvent(store().menu_toggle);
let triggered = true;
for (let prop in hotkey)
if (hotkey[prop] !== event[prop]) triggered = false;
if (triggered) electron.ipcRenderer.send('enhancer:open-menu');
});
const parsed = url.parse(window.location.href, true),
notionUrl =
parsed.query.path ||
schemeHelpers.getSchemeUrl({
httpUrl: config.default.baseURL,
protocol: config.default.protocol,
});
(store().default_page
? idToNotionURL(store().default_page)
: schemeHelpers.getSchemeUrl({
httpUrl: config.default.baseURL,
protocol: config.default.protocol,
}));
delete parsed.search;
delete parsed.query;
const plainUrl = url.format(parsed);
@ -753,6 +802,31 @@ module.exports = (store, __exports) => {
const __start = window['__start'];
window['__start'] = () => {
__start();
if (store().default_page) {
new Promise((res, rej) => {
let attempt;
attempt = setInterval(() => {
if (
!document.getElementById('notion') ||
!document.getElementById('notion').loadURL
)
return;
clearInterval(attempt);
res();
}, 50);
}).then(() => {
if (
document.getElementById('notion').getAttribute('src') ===
'notion://www.notion.so'
) {
document
.getElementById('notion')
.loadURL(idToNotionURL(store().default_page));
}
});
}
const dragarea = document.querySelector(
'#root [style*="-webkit-app-region: drag"]'
),

19
mods/tabs/mod.js Normal file
View File

@ -0,0 +1,19 @@
/*
* tabs
* (c) 2020 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
* under the MIT license
*/
'use strict';
// this is just a pseudo mod to "separate" the options
// from the core module - the core still handles actually
// making it work.
module.exports = {
id: 'e1692c29-475e-437b-b7ff-3eee872e1a42',
tags: ['core', 'extension'],
name: 'tabs',
desc: 'have multiple notion pages open in a single window.',
version: '0.1.0',
author: 'dragonwocky',
};

View File

@ -130,6 +130,11 @@ function getEnhancements() {
))
)
throw Error;
mod.defaults = {};
for (let opt of mod.options || [])
mod.defaults[opt.key] = Array.isArray(opt.value)
? opt.value[0]
: opt.value;
modules.IDs.push(mod.id);
modules.loaded.push({
...mod,

View File

@ -60,7 +60,7 @@ module.exports = function (__file, __exports) {
...modules.loaded.filter((m) => !m.tags.includes('core')).reverse(),
]) {
if (
(mod.tags || []).includes('core') ||
mod.id === '0f0bf8b6-eae6-4273-b307-8fc43f2ee082' ||
store('mods', { [mod.id]: { enabled: false } })[mod.id].enabled
) {
if (
@ -84,20 +84,16 @@ module.exports = function (__file, __exports) {
});
}
if (mod.hacks && mod.hacks[__file]) {
mod.defaults = {};
for (let opt of mod.options || [])
mod.defaults[opt.key] = Array.isArray(opt.value)
? opt.value[0]
: opt.value;
mod.hacks[__file](
(...args) =>
!args.length
? store(mod.id, mod.defaults)
: args.length === 1 && typeof args[0] === 'object'
? store(mod.id, { ...mod.defaults, ...args[0] })
: store(args[0], { ...mod.defaults, ...args[1] }),
__exports
);
mod.hacks[__file]((...args) => {
if (!args.length) return store(mod.id, mod.defaults);
if (args.length === 1 && typeof args[0] === 'object')
return store(mod.id, { ...mod.defaults, ...args[0] });
const other_mod = modules.loaded.find((m) => m.id === args[0]);
return store(args[0], {
...(other_mod ? other_mod.defaults : {}),
...args[1],
});
}, __exports);
}
}
}