Add a userscripts page.
This commit is contained in:
parent
3542dc72d2
commit
fbe5a3fede
GPG Key ID:
C1C0F29952BCF558
|
|
@ -8,9 +8,11 @@
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "nodemon --watch 'source/' --exec 'yarn build' --ext 'html css'",
|
"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: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'",
|
"test": "xo && stylelint 'source/css/*.css'",
|
||||||
"deploy": "rm -rf 'public/' && yarn build && yarn deploy:netlify",
|
"deploy": "rm -rf 'public/' && yarn build && yarn deploy:netlify",
|
||||||
"deploy:netlify": "netlify deploy --prod --dir 'public/' -s 37bb1f7c-2abb-419f-9a31-a4b72209c1c8"
|
"deploy:netlify": "netlify deploy --prod --dir 'public/' -s 37bb1f7c-2abb-419f-9a31-a4b72209c1c8"
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
|
}
|
||||||
|
|
@ -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();
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,74 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Userscripts</title>
|
||||||
|
<link rel="stylesheet" href="../css/modern-normalize.css">
|
||||||
|
<link rel="stylesheet" href="../css/index.css">
|
||||||
|
<link rel="stylesheet" href="../css/userscripts.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<main>
|
||||||
|
<h1>Userscripts</h1>
|
||||||
|
|
||||||
|
<ul class="remove-a-padding">
|
||||||
|
<li>A collection of all my userscripts for various websites.</li>
|
||||||
|
|
||||||
|
<li>
|
||||||
|
Don't know how to install userscripts? Install
|
||||||
|
<a href="https://greasyfork.org" target="_blank">a userscript manager</a>
|
||||||
|
and then click on the "Install" button. This should open a new window
|
||||||
|
or tab where your userscript manager will ask you to install the userscript
|
||||||
|
in question.
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li>
|
||||||
|
Encounter an issue with any of the scripts?
|
||||||
|
<a href="mailto:me@bauke.xyz">Email (me@bauke.xyz)</a>
|
||||||
|
or message me on Matrix (@baukexyz:matrix.org) and I'll try to fix
|
||||||
|
the problem as soon as possible.
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li>
|
||||||
|
Open-sourced with the MIT license, available at
|
||||||
|
<a href="https://git.holllo.cc/Bauke/userscripts" target="_blank">git.holllo.cc/Bauke/userscripts</a>.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="divider"></div>
|
||||||
|
|
||||||
|
{% for script in scripts %}
|
||||||
|
<header>
|
||||||
|
<h2 id="{{ script.name | lower | replace(" ", "-") }}">
|
||||||
|
{{ script.name }}
|
||||||
|
</h2>
|
||||||
|
<a class="install" href="{{ script.downloadURL }}" target="_blank">Install</a>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>{{ script.description }}</li>
|
||||||
|
<li>Version {{ script.version }}</li>
|
||||||
|
<li>
|
||||||
|
Applies to
|
||||||
|
<a class="remove-padding" href="https://{{ script.domain }}" target="_blank">{{ script.domain }}</a>.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
{% if not loop.last %}
|
||||||
|
<div class="divider"></div>
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>
|
||||||
|
© Bauke
|
||||||
|
<a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank">CC BY-SA 4.0</a>
|
||||||
|
</p>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -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) {
|
if (require.main === module) {
|
||||||
main();
|
main();
|
||||||
}
|
}
|
||||||
|
|
@ -28,12 +28,12 @@
|
||||||
Encounter an issue with any of the styles?
|
Encounter an issue with any of the styles?
|
||||||
<a href="mailto:me@bauke.xyz">Email (me@bauke.xyz)</a>
|
<a href="mailto:me@bauke.xyz">Email (me@bauke.xyz)</a>
|
||||||
or message me on Matrix (@baukexyz:matrix.org) and I'll try to fix
|
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.
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li>
|
<li>
|
||||||
Open-sourced with the MIT license, available at
|
Open-sourced with the MIT license, available at
|
||||||
<a href="git.holllo.cc/Bauke/userstyles" target="_blank">git.holllo.cc/Bauke/userstyles</a>.
|
<a href="https://git.holllo.cc/Bauke/userstyles" target="_blank">git.holllo.cc/Bauke/userstyles</a>.
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
|
@ -53,7 +53,7 @@
|
||||||
<li>Licensed under {{ style.license }}.</li>
|
<li>Licensed under {{ style.license }}.</li>
|
||||||
<li>
|
<li>
|
||||||
Applies to
|
Applies to
|
||||||
<a class="remove-padding" href="https://{{ style.domain }}">{{ style.domain }}</a>.
|
<a class="remove-padding" href="https://{{ style.domain }}" target="_blank">{{ style.domain }}</a>.
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue