From fbe5a3fede670c422a5245d58e253b908c6ca5f0 Mon Sep 17 00:00:00 2001 From: Bauke Date: Mon, 3 Aug 2020 00:22:17 +0200 Subject: [PATCH] Add a userscripts page. --- package.json | 6 ++- source/css/userscripts.css | 28 +++++++++++ source/userscripts.js | 65 ++++++++++++++++++++++++++ source/userscripts/index.html | 74 ++++++++++++++++++++++++++++++ source/{index.js => userstyles.js} | 2 +- source/userstyles/index.html | 6 +-- 6 files changed, 175 insertions(+), 6 deletions(-) create mode 100644 source/css/userscripts.css create mode 100644 source/userscripts.js create mode 100644 source/userscripts/index.html rename source/{index.js => userstyles.js} (98%) diff --git a/package.json b/package.json index 118c9f8..6f789a5 100644 --- a/package.json +++ b/package.json @@ -8,9 +8,11 @@ "license": "MIT", "scripts": { "start": "nodemon --watch 'source/' --exec 'yarn build' --ext 'html css'", - "build": "cpy '**' '!index.js' '!userstyles/*' '../public/' --cwd='source' --parents && yarn build:css && yarn build:userstyles", + "build": "yarn build:cpy && yarn build:css && yarn build:userscripts && yarn build:userstyles", + "build:cpy": "cpy '**' '!index.js' '!userstyles/*' '!userscripts/*' '../public/' --cwd='source' --parents", "build:css": "cpy 'node_modules/modern-normalize/modern-normalize.css' 'public/css/'", - "build:userstyles": "node 'source/index.js'", + "build:userscripts": "node 'source/userscripts.js'", + "build:userstyles": "node 'source/userstyles.js'", "test": "xo && stylelint 'source/css/*.css'", "deploy": "rm -rf 'public/' && yarn build && yarn deploy:netlify", "deploy:netlify": "netlify deploy --prod --dir 'public/' -s 37bb1f7c-2abb-419f-9a31-a4b72209c1c8" diff --git a/source/css/userscripts.css b/source/css/userscripts.css new file mode 100644 index 0000000..942a8ac --- /dev/null +++ b/source/css/userscripts.css @@ -0,0 +1,28 @@ +header { + align-items: center; + background-color: #2a2041; + border: 1px solid #3bd18a; + display: flex; + justify-content: center; + padding: 16px; + width: 100%; +} + +h2 { + margin-right: auto; + padding: 0; +} + +a.install { + background-color: #3bd18a; + color: #1f1731; +} + +a.install:hover { + background-color: #96c839; +} + +.remove-padding, +.remove-a-padding a { + padding: 0; +} diff --git a/source/userscripts.js b/source/userscripts.js new file mode 100644 index 0000000..fb88a75 --- /dev/null +++ b/source/userscripts.js @@ -0,0 +1,65 @@ +const {promises: fsp} = require('fs'); +const nunjucks = require('nunjucks'); +const {join} = require('path'); + +const { + readScriptMetadata, + scripts +} = require('../submodules/userscripts/source'); + +async function main() { + // Make sure the `public/userscripts` directory exists. + await fsp.mkdir(join(__dirname, '../public/userscripts/'), {recursive: true}); + + // Configure Nunjucks to use the current directory for templates. + nunjucks.configure(__dirname, { + lstripBlocks: true, + trimBlocks: true, + throwOnUndefined: true + }); + + // Create an array to hold all the script metadatas we'll use to render the template. + const scriptMetadatas = []; + + // Define the source directory where the userscripts are located. + const sourceDir = join(__dirname, '../submodules/userscripts/source/'); + + for (const script of scripts) { + // Read the script metadata and add it to our array. + const metadata = await readScriptMetadata(script); + + // The way the metadata is parsed is inside arrays, so extract + // all of them so we don't have to in the template. + metadata.description = metadata.description[0]; + metadata.downloadURL = metadata.downloadURL[0]; + metadata.name = metadata.name[0]; + metadata.version = metadata.version[0]; + // Remove the `https://` and trailing `/*` from the domain. + metadata.domain = metadata.match[0].slice( + metadata.match[0].indexOf('://') + 3, + metadata.match[0].lastIndexOf('/') + ); + + scriptMetadatas.push(metadata); + + // Define the filename for the script. + const filename = `${script}.user.js`; + + // Copy all the userscripts to the `public/userscripts/` directory. + await fsp.copyFile( + join(sourceDir, filename), + join(__dirname, '../public/userscripts/', filename) + ); + } + + // Render the userscripts template and write it to file. + await fsp.writeFile( + join(__dirname, '../public/userscripts/index.html'), + nunjucks.render('userscripts/index.html', {scripts: scriptMetadatas}) + ); +} + +// Run `main()` if this script was called directly (like `node source/userscripts.js`). +if (require.main === module) { + main(); +} diff --git a/source/userscripts/index.html b/source/userscripts/index.html new file mode 100644 index 0000000..c6ec280 --- /dev/null +++ b/source/userscripts/index.html @@ -0,0 +1,74 @@ + + + + + + + Userscripts + + + + + + +
+

Userscripts

+ + + +
+ + {% for script in scripts %} +
+

+ {{ script.name }} +

+ Install +
+ + + + {% if not loop.last %} +
+ {% endif %} + {% endfor %} +
+ + + + + diff --git a/source/index.js b/source/userstyles.js similarity index 98% rename from source/index.js rename to source/userstyles.js index c628ed0..1343c22 100644 --- a/source/index.js +++ b/source/userstyles.js @@ -52,7 +52,7 @@ async function main() { ); } -// Run `main()` if this script was called directly (like `node source/index.js`). +// Run `main()` if this script was called directly (like `node source/userstyles.js`). if (require.main === module) { main(); } diff --git a/source/userstyles/index.html b/source/userstyles/index.html index 9c131f6..d36a801 100644 --- a/source/userstyles/index.html +++ b/source/userstyles/index.html @@ -28,12 +28,12 @@ Encounter an issue with any of the styles? Email (me@bauke.xyz) or message me on Matrix (@baukexyz:matrix.org) and I'll try to fix - your problem as soon as possible. + the problem as soon as possible.
  • Open-sourced with the MIT license, available at - git.holllo.cc/Bauke/userstyles. + git.holllo.cc/Bauke/userstyles.
    • @@ -53,7 +53,7 @@
  • Licensed under {{ style.license }}.
  • Applies to - {{ style.domain }}. + {{ style.domain }}.