Add a userscripts page.
This commit is contained in:
parent
3542dc72d2
commit
fbe5a3fede
GPG Key ID:
C1C0F29952BCF558
|
|
@ -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"
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
main();
|
||||
}
|
||||
|
|
@ -28,12 +28,12 @@
|
|||
Encounter an issue with any of the styles?
|
||||
<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
|
||||
your problem as soon as possible.
|
||||
the problem as soon as possible.
|
||||
</li>
|
||||
|
||||
<li>
|
||||
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>
|
||||
</ul>
|
||||
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
<li>Licensed under {{ style.license }}.</li>
|
||||
<li>
|
||||
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>
|
||||
</ul>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue