diff --git a/DOCUMENTATION.md b/DOCUMENTATION.md index 9a55d14..e152415 100644 --- a/DOCUMENTATION.md +++ b/DOCUMENTATION.md @@ -66,12 +66,13 @@ module.exports = { #### options -| key | value | type | -| ----- | ------------------------------------------------------------------ | --------- | -| key | **required:** key to save value to the mod `store` | _string_ | -| label | **required:** short description/name of option to be shown in menu | _string_ | -| type | **required:** input type (see below) | _string_ | -| value | **optional:** default or possible value/s for option | see below | +| key | value | type | +| ---------- | ---------------------------------------------------------------------------------------- | ----------------- | +| key | **required:** key to save value to the mod `store` | _string_ | +| label | **required:** short description/name of option to be shown in menu | _string_ | +| type | **required:** input type (see below) | _string_ | +| extensions | **optional:** allowed file extensions (only use with a file option), e.g. `['js', 'ts']` | _array\_ | +| value | **optional:** default or possible value/s for option | see below | | type | value | | ------ | ----------------- | @@ -80,6 +81,8 @@ module.exports = { | input | _string_ | | file | none | +> the file option stores only a filepath, not the file itself. + #### hacks each "hack" is a function taking 2 arguments. diff --git a/mods/bracketed-links/mod.js b/mods/bracketed-links/mod.js index c2ad673..981df61 100644 --- a/mods/bracketed-links/mod.js +++ b/mods/bracketed-links/mod.js @@ -10,7 +10,7 @@ module.exports = { id: '60e14feb-a81d-4ffb-9b12-7585d346bad8', tags: ['extension'], name: 'bracketed links', - desc: 'render links surrounded with [brackets] instead of __underlined__.', + desc: 'render links surrounded with [[brackets]] instead of __underlined__.', version: '0.0.1', author: 'arecsu', }; diff --git a/mods/bracketed-links/styles.css b/mods/bracketed-links/styles.css index 3087e62..8bc3f9d 100644 --- a/mods/bracketed-links/styles.css +++ b/mods/bracketed-links/styles.css @@ -9,12 +9,12 @@ border-bottom: none !important; } .notion-link-token:before { - content: '['; + content: '[['; opacity: 0.7; transition: opacity 100ms ease-in; } .notion-link-token:after { - content: ']'; + content: ']]'; opacity: 0.7; transition: opacity 100ms ease-in; } diff --git a/mods/core/create.js b/mods/core/create.js index 1343670..9cee6e8 100644 --- a/mods/core/create.js +++ b/mods/core/create.js @@ -18,7 +18,7 @@ module.exports = (store, __exports) => { helpers = require('../../pkg/helpers.js'), __notion = helpers.getNotion(); - __exports.createWindow = function (relativeUrl) { + __exports.createWindow = function (relativeUrl, focused_window) { if (!relativeUrl) relativeUrl = ''; const window_state = require(`${__notion.replace( /\\/g, @@ -32,8 +32,9 @@ module.exports = (store, __exports) => { y: window_state.y, width: window_state.width, height: window_state.height, - }, - focused_window = electron.BrowserWindow.getFocusedWindow(); + }; + focused_window = + focused_window || electron.BrowserWindow.getFocusedWindow(); if (focused_window && !focused_window.isMaximized()) { rect.x = focused_window.getPosition()[0] + 20; rect.y = focused_window.getPosition()[1] + 20; @@ -81,4 +82,5 @@ module.exports = (store, __exports) => { window.loadURL(__exports.getIndexUrl(relativeUrl)); return window; }; + return __exports.createWindow; }; diff --git a/mods/core/css/menu.css b/mods/core/css/menu.css index 58ee971..a7f8e86 100644 --- a/mods/core/css/menu.css +++ b/mods/core/css/menu.css @@ -205,6 +205,7 @@ s { font-size: 0.9em; } #modules section .desc p { + font-size: inherit; margin: 0; } #modules section .desc blockquote { @@ -265,7 +266,16 @@ s { margin-bottom: 0.5em; } -select { +.toggle *, +.input *, +.select *, +.file * { + cursor: pointer; +} +.select select, +.input input[type='text'], +.input input[type='number'], +.file input[type='file'] + label .choose { width: 100%; margin: 0.25em 0; font-size: 0.9rem; @@ -274,20 +284,59 @@ select { color: var(--theme_local--text); background: var(--theme_local--main); } - -.toggle * { - cursor: pointer; +.select select:focus, +.input input[type='text']:focus, +.input input[type='number']:focus, +.file input[type='file']:focus + label .choose, +.file input[type='file'] + label .choose:hover { + outline: var(--theme_local--table-border) solid 2px; } -.toggle input { +.file input[type='file'], +.toggle input[type='checkbox'] { display: none; } -.toggle input + label { + +.input input[type='text'], +.input input[type='number'] { + padding: 0.4rem; + cursor: text; +} + +.file input[type='file'] + label .label { + position: relative; display: flex; } -.toggle input + label .name { +.file input[type='file'] + label .label .name { + flex-basis: calc(100% - 1.5rem); +} +.file input[type='file'] + label .label .clear { + font-size: 1rem; + position: absolute; + top: 0.4em; + right: 0; + width: 1em; + height: 0.1em; + border: 0.35em solid var(--theme_local--card); + background: currentColor; +} +.file input[type='file'] + label .choose { + display: block; + white-space: nowrap; + overflow: hidden; +} +.file input[type='file'] + label .choose svg { + padding-top: 0.5em; + height: 1.25em; + width: 1.25em; +} + +.toggle input[type='checkbox'] + label { + display: flex; +} +.toggle input[type='checkbox'] + label .name { flex-basis: calc(100% - 2.25em); } -.toggle input + label .switch { +.toggle input[type='checkbox'] + label .switch { position: relative; margin-top: 0.5em; float: right; @@ -296,7 +345,7 @@ select { background: var(--theme_local--main); border-radius: 5px; } -.toggle input + label .switch:before { +.toggle input[type='checkbox'] + label .switch::before { content: ''; position: absolute; left: 0; @@ -312,7 +361,7 @@ select { opacity: var(--menu--toggle_opacity, 0); transition: opacity 300ms; } -.toggle input + label .switch .dot { +.toggle input[type='checkbox'] + label .switch .dot { position: absolute; width: 1em; height: 1em; @@ -323,7 +372,7 @@ select { background: var(--theme_local--todo_ticked-fill); box-shadow: 2px 1px 4px var(--theme_local--table-border); } -.toggle input:checked + label { +.toggle input[type='checkbox']:checked + label { --menu--toggle_offset: 1em; --menu--toggle_opacity: 1; } diff --git a/mods/core/icons/alwaysontop_off.svg b/mods/core/icons/alwaysontop_off.svg index 648339d..e8711d6 100644 --- a/mods/core/icons/alwaysontop_off.svg +++ b/mods/core/icons/alwaysontop_off.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/mods/core/icons/alwaysontop_on.svg b/mods/core/icons/alwaysontop_on.svg index 0c2abaf..4b700e3 100644 --- a/mods/core/icons/alwaysontop_on.svg +++ b/mods/core/icons/alwaysontop_on.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/mods/core/icons/file.svg b/mods/core/icons/file.svg new file mode 100644 index 0000000..159a961 --- /dev/null +++ b/mods/core/icons/file.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/mods/core/icons/maximize_off.svg b/mods/core/icons/maximize_off.svg index ebd1c92..378e3d2 100644 --- a/mods/core/icons/maximize_off.svg +++ b/mods/core/icons/maximize_off.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/mods/core/icons/maximize_on.svg b/mods/core/icons/maximize_on.svg index c7fdcbd..6f19bf5 100644 --- a/mods/core/icons/maximize_on.svg +++ b/mods/core/icons/maximize_on.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/mods/core/icons/minimize.svg b/mods/core/icons/minimize.svg index ec85d9d..3ea3cc9 100644 --- a/mods/core/icons/minimize.svg +++ b/mods/core/icons/minimize.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/mods/core/menu.js b/mods/core/menu.js index f5cea1f..013cf9a 100644 --- a/mods/core/menu.js +++ b/mods/core/menu.js @@ -8,6 +8,8 @@ const store = require('../../pkg/store.js'), helpers = require('../../pkg/helpers.js'), + fs = require('fs-extra'), + path = require('path'), electron = require('electron'), browser = electron.remote.getCurrentWindow(); @@ -17,7 +19,7 @@ window['__start'] = async () => { document.defaultView.addEventListener('keyup', (event) => { if (event.code === 'F5') window.reload(); - if (event.key === 'e' && (event.ctrlKey || event.metaKey)) browser.close(); + if ((event.ctrlKey || event.metaKey) && event.key === 'e') browser.close(); }); electron.ipcRenderer.on('enhancer:set-theme', (event, theme) => { @@ -68,11 +70,11 @@ window['__start'] = async () => { if (version.local == version.repo) return; // compare func from https://github.com/substack/semver-compare version.sorted = [version.local, version.repo].sort((a, b) => { - var pa = a.split('.'); - var pb = b.split('.'); - for (var i = 0; i < 3; i++) { - var na = Number(pa[i]); - var nb = Number(pb[i]); + const pa = a.split('.'), + pb = b.split('.'); + for (let i = 0; i < 3; i++) { + let na = Number(pa[i]), + nb = Number(pb[i]); if (na > nb) return 1; if (nb > na) return -1; if (!isNaN(na) && isNaN(nb)) return 1; @@ -133,7 +135,7 @@ window['__start'] = async () => { // ![image_title](source) .replace( /([^\\])?\!\[([^\]]*[^\\\]]?)\]\(([^)]*[^\\)])\)/g, - '$1$2' + '$1$2' ) // [link](destination) .replace( @@ -153,7 +155,7 @@ window['__start'] = async () => { if (modified_notice) return; modified_notice = createAlert( 'info', - `changes may not apply until app restart.` + `changes may not fully apply until app restart.` ); modified_notice.append(); } @@ -193,7 +195,7 @@ window['__start'] = async () => {
${markdown(mod.desc)}

- + ${mod.author} v${mod.version} @@ -210,7 +212,9 @@ window['__start'] = async () => { menuStore[mod.id].enabled = $enable.checked; mod.elem.className = menuStore[mod.id].enabled ? 'enabled' : 'disabled'; }); + const $options = mod.elem.querySelector('.options'); + let file_icon; if ($options) for (const opt of mod.options) { let $opt; @@ -219,21 +223,17 @@ window['__start'] = async () => { $opt = createElement(`

+ ${ + store(mod.id, { [opt.key]: opt.value })[opt.key] + ? 'checked' + : '' + } />

`); - const $opt_checkbox = $opt.querySelector( - `#toggle_${mod.id}--${opt.key}` - ); - $opt_checkbox.addEventListener('change', (event) => { - store(mod.id)[opt.key] = $opt_checkbox.checked; - modified(); - }); - $options.appendChild($opt); break; case 'select': $opt = createElement(` @@ -246,21 +246,83 @@ window['__start'] = async () => {

`); - const $opt_select = $opt.querySelector( - `#select_${mod.id}--${opt.key}` - ); - $opt_select.value = store(mod.id)[opt.key]; - $opt_select.addEventListener('change', (event) => { - store(mod.id)[opt.key] = $opt_select.value; - modified(); - }); - $options.appendChild($opt); break; case 'input': + $opt = createElement(` +

+ + +

+ `); break; case 'file': + if (!file_icon) + file_icon = await fs.readFile( + path.resolve(`${__dirname}/icons/file.svg`) + ); + $opt = createElement(` +

+ + +

+ `); + $opt.querySelector('.clear').addEventListener('click', (event) => { + store(mod.id)[opt.key] = ''; + $opt.querySelector('.path').innerText = store(mod.id)[opt.key] + ? store(mod.id)[opt.key].split(path.sep).reverse()[0] + : 'choose a file...'; + }); break; } + + if (opt.type !== 'file') { + $opt.querySelector( + `#${opt.type}_${mod.id}--${opt.key}` + ).value = store(mod.id, { + [opt.key]: opt.type === 'select' ? opt.value[0] : opt.value, + })[opt.key]; + } + $opt + .querySelector(`#${opt.type}_${mod.id}--${opt.key}`) + .addEventListener('change', (event) => { + if (opt.type === 'toggle') { + store(mod.id)[opt.key] = event.target.checked; + } else if (opt.type === 'file') { + if (event.target.files.length) + store(mod.id)[opt.key] = event.target.files[0].path; + $opt.querySelector('.path').innerText = store(mod.id)[opt.key] + ? store(mod.id)[opt.key].split(path.sep).reverse()[0] + : 'choose a file...'; + } else + store(mod.id)[opt.key] = + typeof opt.value === 'number' + ? Number(event.target.value) + : event.target.value; + modified(); + }); + $options.appendChild($opt); } $modules.append(mod.elem); } diff --git a/mods/core/mod.js b/mods/core/mod.js index 6d02054..feca362 100644 --- a/mods/core/mod.js +++ b/mods/core/mod.js @@ -10,8 +10,7 @@ module.exports = { id: '0f0bf8b6-eae6-4273-b307-8fc43f2ee082', tags: ['core', 'extension'], name: 'notion-enhancer core', - desc: `> the **modloader** itself, _including_: the [CLI](https://github.com), the \`menu\`, and ~~enabling/disabling/insertion/updating of~~ mods. - ![](https://preview.redd.it/vtiw9ulqlt951.png?width=1368&format=png&auto=webp&s=733d8b27ec62151c7858b4eca463f809ead6395a)`, + desc: 'what makes this whole thing possible: cli, modloader, menu, & tray.', version: require('../../package.json').version, author: 'dragonwocky', options: [ @@ -35,27 +34,27 @@ module.exports = { }, { key: 'frameless', - label: 'integrate titlebar into notion', + label: 'integrated titlebar', type: 'toggle', value: true, }, { key: 'dragarea_height', - label: 'height of frameless dragarea', + label: 'height of frameless dragarea:', type: 'input', value: 15, }, { key: 'smooth_scrollbars', - label: 'integrate scrollbars into notion', + label: 'integrated scrollbars', type: 'toggle', value: true, }, { key: 'hotkey', - label: 'window display hotkey', + label: 'window display hotkey:', type: 'input', - value: 'CmdOrCtrl+Shift+A', + value: 'CommandOrControl+Shift+A', }, ], hacks: { diff --git a/mods/core/tray.js b/mods/core/tray.js index cc7ddcf..4e98c60 100644 --- a/mods/core/tray.js +++ b/mods/core/tray.js @@ -143,6 +143,22 @@ module.exports = (store, __exports) => { accelerator: 'CommandOrControl+E', click: openExtensionMenu, }, + { + type: 'normal', + label: 'New Window', + click: () => { + require('./create.js')( + store, + require(path.resolve(`${__notion}/app/main/createWindow.js`)) + )( + '', + electron.BrowserWindow.getAllWindows().find( + (win) => win !== enhancer_menu + ) + ); + }, + accelerator: 'CommandOrControl+Shift+N', + }, { type: 'separator', }, diff --git a/mods/custom-inserts/mod.js b/mods/custom-inserts/mod.js new file mode 100644 index 0000000..54ca1ff --- /dev/null +++ b/mods/custom-inserts/mod.js @@ -0,0 +1,30 @@ +/* + * notion-enhancer + * (c) 2020 dragonwocky + * (https://dragonwocky.me/) under the MIT license + */ + +'use strict'; + +module.exports = { + id: 'b4b0aced-2059-43bf-8d1d-ccd757ee5ebb', + tags: ['extension'], + name: 'custom inserts', + desc: 'directly link files for small client-side tweaks.', + version: '0.0.2', + author: 'dragonwocky', + options: [ + { + key: 'css', + label: 'css insert', + type: 'file', + extensions: ['css'], + }, + { + key: 'js', + label: 'client-side js insert', + type: 'file', + extensions: ['js'], + }, + ], +}; diff --git a/package.json b/package.json index 832ec92..8e3ab81 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "notion-enhancer", - "version": "0.8.0-beta", + "version": "0.8.0-wip", "description": "an enhancer/customiser for the all-in-one productivity workspace notion.so", "main": "index.js", "bin": {