mirror of
https://github.com/notion-enhancer/notion-enhancer.git
synced 2025-04-05 13:19:03 +00:00
mod info boxes
This commit is contained in:
parent
19593e1d01
commit
d8351aa49e
@ -21,30 +21,30 @@ module.exports = (defaults) =>
|
||||
// additional hotkeys
|
||||
document.defaultView.addEventListener('keyup', (event) => {
|
||||
if (event.code === 'F5') window.reload();
|
||||
if (event.key === 'e' && (event.ctrlKey || event.metaKey))
|
||||
electron.ipcRenderer.send('enhancer:open-extension-menu');
|
||||
});
|
||||
|
||||
const interval_attempts = {
|
||||
enhance: setInterval(enhance, 500),
|
||||
};
|
||||
const attempt_interval = setInterval(enhance, 500);
|
||||
async function enhance() {
|
||||
if (!document.querySelector('.notion-frame')) return;
|
||||
clearInterval(interval_attempts.enhance);
|
||||
clearInterval(attempt_interval);
|
||||
|
||||
// scrollbars
|
||||
if (settings.smooth_scrollbars) {
|
||||
document.body.classList.add('smooth-scrollbars');
|
||||
interval_attempts.patchScrollbars = setInterval(patchScrollbars, 50);
|
||||
function patchScrollbars() {
|
||||
const sidebar = document.querySelector(
|
||||
'.notion-scroller.vertical[style*="overflow: hidden auto;"]'
|
||||
);
|
||||
if (!sidebar) return;
|
||||
clearInterval(interval_attempts.patchScrollbars);
|
||||
sidebar.style.overflow = '';
|
||||
setTimeout(() => {
|
||||
sidebar.style.overflow = 'hidden auto';
|
||||
}, 10);
|
||||
}
|
||||
// interval_attempts.patchScrollbars = setInterval(patchScrollbars, 100);
|
||||
// function patchScrollbars() {
|
||||
// const sidebar = document.querySelector(
|
||||
// '.notion-scroller.vertical[style*="overflow: hidden auto;"]'
|
||||
// );
|
||||
// if (!sidebar) return;
|
||||
// clearInterval(interval_attempts.patchScrollbars);
|
||||
// sidebar.style.overflow = '';
|
||||
// setTimeout(() => {
|
||||
// sidebar.style.overflow = 'hidden auto';
|
||||
// }, 10);
|
||||
// }
|
||||
}
|
||||
|
||||
// frameless
|
||||
|
||||
@ -28,6 +28,7 @@ body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body:not([style]) > * {
|
||||
@ -63,6 +64,39 @@ body:not([style])::after {
|
||||
background: var(--theme_light--main);
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 1em;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
main section {
|
||||
border-radius: 2px;
|
||||
padding: 0.75em;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
|
||||
/* inline formatting */
|
||||
|
||||
code {
|
||||
border-radius: 0.1em;
|
||||
padding: 0.2em 0.4em;
|
||||
}
|
||||
.notion-dark-theme code {
|
||||
font: 0.85em var(--theme_dark--font_code);
|
||||
/* color: var(--theme_dark--code_inline-text); */
|
||||
background: var(--theme_dark--code_inline-background);
|
||||
}
|
||||
.notion-light-theme code {
|
||||
font: 0.85em var(--theme_light--font_code);
|
||||
/* color: var(--theme_light--code_inline-text); */
|
||||
background: var(--theme_light--code_inline-background);
|
||||
}
|
||||
|
||||
u {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.notion-dark-theme,
|
||||
.notion-dark-theme button {
|
||||
color: var(--theme_dark--text);
|
||||
@ -74,6 +108,18 @@ body:not([style])::after {
|
||||
font-family: var(--theme_light--font_sans);
|
||||
}
|
||||
|
||||
/* titlebar */
|
||||
|
||||
#menu-titlebar::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
-webkit-app-region: no-drag;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 2px;
|
||||
}
|
||||
|
||||
#menu-titlebar {
|
||||
display: flex;
|
||||
padding: 0.4em;
|
||||
@ -92,14 +138,10 @@ body:not([style])::after {
|
||||
background: var(--theme_light--dragarea);
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 1em;
|
||||
}
|
||||
/* alerts */
|
||||
|
||||
#alerts [role='alert'] {
|
||||
padding: 0.25em;
|
||||
display: flex;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
#alerts [role='alert']::before {
|
||||
content: '!';
|
||||
@ -107,12 +149,12 @@ main {
|
||||
/* margin: auto 0; */
|
||||
font-weight: bold;
|
||||
font-size: 1.2em;
|
||||
padding: 0.5rem;
|
||||
padding-right: 0.5rem;
|
||||
}
|
||||
#alerts [role='alert'] p {
|
||||
font-size: 1rem;
|
||||
margin: auto 0;
|
||||
padding: 0.5em;
|
||||
padding-left: 0.5em;
|
||||
}
|
||||
|
||||
.notion-dark-theme #alerts [role='alert'] p {
|
||||
@ -176,21 +218,66 @@ main {
|
||||
background: var(--theme_light--line_green);
|
||||
}
|
||||
|
||||
code {
|
||||
border-radius: 0.1em;
|
||||
padding: 0.2em 0.4em;
|
||||
/* modules */
|
||||
|
||||
.notion-dark-theme #modules section {
|
||||
background: var(--theme_dark--sidebar);
|
||||
border: 1px solid var(--theme_dark--table-border);
|
||||
}
|
||||
.notion-dark-theme code {
|
||||
font: 0.85em var(--theme_dark--font_code);
|
||||
/* color: var(--theme_dark--code_inline-text); */
|
||||
background: var(--theme_dark--code_inline-background);
|
||||
}
|
||||
.notion-light-theme code {
|
||||
font: 0.85em var(--theme_light--font_code);
|
||||
/* color: var(--theme_light--code_inline-text); */
|
||||
background: var(--theme_light--code_inline-background);
|
||||
.notion-light-theme #modules section {
|
||||
background: var(--theme_light--sidebar);
|
||||
border: 1px solid var(--theme_light--card-border);
|
||||
}
|
||||
|
||||
u {
|
||||
text-decoration: underline;
|
||||
#modules section h3,
|
||||
#modules section p {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
#modules section .desc {
|
||||
margin: 0.3em 0 0.4em 0;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
#modules section .desc a {
|
||||
color: currentColor;
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
#modules section .desc s {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
#modules section .desc img {
|
||||
width: 100%;
|
||||
max-width: 20em;
|
||||
margin: 0.5em 0;
|
||||
}
|
||||
#modules section .desc img:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
#modules section .desc img:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#modules section .author {
|
||||
color: currentColor;
|
||||
}
|
||||
#modules section .author img {
|
||||
max-height: 1em;
|
||||
max-width: 1em;
|
||||
margin-bottom: 0.15625em;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
border-radius: 50%;
|
||||
}
|
||||
#modules section .tags,
|
||||
#modules section .version {
|
||||
font-size: 0.85em;
|
||||
}
|
||||
.notion-dark-theme #modules section .tags,
|
||||
.notion-dark-theme #modules section .version {
|
||||
color: var(--theme_dark--text_ui);
|
||||
}
|
||||
.notion-light-theme #modules section .tags,
|
||||
.notion-light-theme #modules section .version {
|
||||
color: var(--theme_light--text_ui);
|
||||
}
|
||||
|
||||
@ -1,10 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html class="smooth-scrollbars" lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>notion-enhancer menu</title>
|
||||
<link rel="stylesheet" href="./css/menu.css" />
|
||||
<script src="https://unpkg.com/snarkdown@1.0.2/dist/snarkdown.umd.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header id="menu-titlebar"></header>
|
||||
|
||||
@ -9,14 +9,23 @@
|
||||
const __mod = require('./mod.js'),
|
||||
store = require('../../pkg/store.js'),
|
||||
helpers = require('../../pkg/helpers.js'),
|
||||
electron = require('electron');
|
||||
electron = require('electron'),
|
||||
browser = electron.remote.getCurrentWindow();
|
||||
|
||||
window['__start'] = async () => {
|
||||
const buttons = require('./buttons.js');
|
||||
document.querySelector('#menu-titlebar').appendChild(buttons.element);
|
||||
|
||||
document.defaultView.addEventListener('keyup', (event) => {
|
||||
if (event.code === 'F5') window.reload();
|
||||
if (event.key === 'e' && (event.ctrlKey || event.metaKey)) {
|
||||
electron.remote.BrowserWindow.getAllWindows()[0].show();
|
||||
browser.close();
|
||||
}
|
||||
});
|
||||
|
||||
electron.ipcRenderer.on('enhancer:set-theme', (event, theme) => {
|
||||
document.body.className = `notion-${theme.mode}-theme smooth-scrollbars`;
|
||||
document.body.className = `notion-${theme.mode}-theme`;
|
||||
for (const style of theme.rules)
|
||||
document.body.style.setProperty(style[0], style[1]);
|
||||
});
|
||||
@ -85,6 +94,7 @@ window['__start'] = async () => {
|
||||
).prepend();
|
||||
});
|
||||
|
||||
// mod loader
|
||||
const modules = helpers.getEnhancements();
|
||||
if (modules.loaded.length)
|
||||
console.info(
|
||||
@ -100,4 +110,44 @@ window['__start'] = async () => {
|
||||
.join(', ')}.`
|
||||
).append();
|
||||
}
|
||||
|
||||
// mod options
|
||||
function markdown(string) {
|
||||
return snarkdown(
|
||||
string
|
||||
.split('\n')
|
||||
.map((line) => line.trim())
|
||||
.join('<br>')
|
||||
).replace(/([^\\])?~~([^\n]*[^\\])~~/g, '$1<s>$2</s>');
|
||||
}
|
||||
const $modules = document.querySelector('#modules');
|
||||
for (let mod of modules.loaded.sort((a, b) =>
|
||||
store('mods', { [mod.id]: { pinned: false } }).pinned
|
||||
? 1
|
||||
: a.name.localeCompare(b.name)
|
||||
)) {
|
||||
$modules.append(
|
||||
createElement(`
|
||||
<section class="${
|
||||
mod.type === 'core' ||
|
||||
store('mods', { [mod.id]: { enabled: false } }).enabled
|
||||
? 'enabled'
|
||||
: 'disabled'
|
||||
}" id="${mod.id}">
|
||||
<h3>${mod.name}</h3>
|
||||
<p class="tags">${mod.tags
|
||||
.map((tag) => (tag.startsWith('#') ? tag : `#${tag}`))
|
||||
.join(' ')}</p>
|
||||
<p class="desc">${markdown(mod.desc)}</p>
|
||||
<p>
|
||||
<a href="https://github.com/${mod.author}" class="author">
|
||||
<img src="https://github.com/${mod.author}.png" />
|
||||
${mod.author}
|
||||
</a>
|
||||
<span class="version">v${mod.version}</span>
|
||||
</p>
|
||||
</section>
|
||||
`)
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
@ -18,10 +18,10 @@ const defaults = {
|
||||
|
||||
module.exports = {
|
||||
id: '0f0bf8b6-eae6-4273-b307-8fc43f2ee082',
|
||||
type: 'core',
|
||||
tags: ['core', 'extension'],
|
||||
name: 'notion-enhancer core',
|
||||
desc:
|
||||
'the modloader itself, including: the CLI, the menu, and enabling/disabling/insertion/updating of mods.',
|
||||
desc: `the **modloader** itself, _including_: the [CLI](https://github.com), the menu, and ~~enabling/disabling/insertion/updating of~~ mods.
|
||||
`,
|
||||
version: require('../../package.json').version,
|
||||
author: 'dragonwocky',
|
||||
thumb:
|
||||
|
||||
@ -35,6 +35,7 @@ module.exports = (defaults) =>
|
||||
if (!enhancer_menu) return;
|
||||
enhancer_menu.webContents.send('enhancer:set-theme', arg);
|
||||
});
|
||||
electron.ipcMain.on('enhancer:open-extension-menu', openExtensionMenu);
|
||||
|
||||
function calculateWindowPos(width, height) {
|
||||
const screen = electron.screen.getDisplayNearestPoint({
|
||||
@ -70,6 +71,43 @@ module.exports = (defaults) =>
|
||||
};
|
||||
}
|
||||
|
||||
function openExtensionMenu() {
|
||||
if (enhancer_menu) return enhancer_menu.show();
|
||||
const window_state = require(`${__notion.replace(
|
||||
/\\/g,
|
||||
'/'
|
||||
)}/app/node_modules/electron-window-state/index.js`)({
|
||||
file: 'menu-windowstate.json',
|
||||
path: helpers.data_folder,
|
||||
defaultWidth: 275,
|
||||
defaultHeight: 600,
|
||||
});
|
||||
electron.shell.openExternal(JSON.stringify(window_state));
|
||||
enhancer_menu = new electron.BrowserWindow({
|
||||
show: true,
|
||||
frame: false,
|
||||
titleBarStyle: 'hiddenInset',
|
||||
x:
|
||||
window_state.x ||
|
||||
calculateWindowPos(window_state.width, window_state.height).x,
|
||||
y:
|
||||
window_state.y ||
|
||||
calculateWindowPos(window_state.width, window_state.height).y,
|
||||
width: window_state.width,
|
||||
height: window_state.height,
|
||||
webPreferences: {
|
||||
preload: path.resolve(`${__dirname}/menu.js`),
|
||||
nodeIntegration: true,
|
||||
session: electron.session.fromPartition('persist:notion'),
|
||||
},
|
||||
});
|
||||
enhancer_menu.loadURL('enhancement://core/menu.html');
|
||||
enhancer_menu.on('close', (e) => {
|
||||
window_state.saveState(enhancer_menu);
|
||||
enhancer_menu = null;
|
||||
});
|
||||
}
|
||||
|
||||
const contextMenu = electron.Menu.buildFromTemplate([
|
||||
{
|
||||
type: 'normal',
|
||||
@ -104,42 +142,8 @@ module.exports = (defaults) =>
|
||||
{
|
||||
type: 'normal',
|
||||
label: 'Enhancements',
|
||||
click: () => {
|
||||
if (enhancer_menu) return enhancer_menu.show();
|
||||
const window_state = require(`${__notion.replace(
|
||||
/\\/g,
|
||||
'/'
|
||||
)}/app/node_modules/electron-window-state/index.js`)({
|
||||
file: 'menu-windowstate.json',
|
||||
path: helpers.data_folder,
|
||||
defaultWidth: 275,
|
||||
defaultHeight: 600,
|
||||
});
|
||||
electron.shell.openExternal(JSON.stringify(window_state));
|
||||
enhancer_menu = new electron.BrowserWindow({
|
||||
show: true,
|
||||
frame: false,
|
||||
titleBarStyle: 'hiddenInset',
|
||||
x:
|
||||
window_state.x ||
|
||||
calculateWindowPos(window_state.width, window_state.height).x,
|
||||
y:
|
||||
window_state.y ||
|
||||
calculateWindowPos(window_state.width, window_state.height).y,
|
||||
width: window_state.width,
|
||||
height: window_state.height,
|
||||
webPreferences: {
|
||||
preload: path.resolve(`${__dirname}/menu.js`),
|
||||
nodeIntegration: true,
|
||||
session: electron.session.fromPartition('persist:notion'),
|
||||
},
|
||||
});
|
||||
enhancer_menu.loadURL('enhancement://core/menu.html');
|
||||
enhancer_menu.on('close', (e) => {
|
||||
window_state.saveState(enhancer_menu);
|
||||
enhancer_menu = null;
|
||||
});
|
||||
},
|
||||
accelerator: 'CommandOrControl+E',
|
||||
click: openExtensionMenu,
|
||||
},
|
||||
{
|
||||
type: 'separator',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user