clarify tampermonkey prerequisite

This commit is contained in:
Holly 2021-05-09 06:37:46 +00:00
parent f40932c66a
commit 32c27201d8
2 changed files with 72 additions and 66 deletions

View File

@ -1,66 +1,68 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Remote Instance Actions</title> <title>Remote Instance Actions</title>
<link rel="stylesheet" type="text/css" href="style.css"> <link rel="stylesheet" type="text/css" href="style.css">
<script src="install_form.js"></script> <script src="install_form.js"></script>
</head> </head>
<body> <body>
<h1>Remote Instance Actions</h1> <h1>Remote Instance Actions</h1>
<figure><img src="ria.png" alt="The userscript in action, suspending badfaith.instance." /><figcaption>Quickly suspend or silence remote instances from the Mastodon frontend</figure> <figure><img src="ria.png" alt="The userscript in action, suspending badfaith.instance." /><figcaption>Quickly suspend or silence remote instances from the Mastodon frontend</figure>
<h2>Installation Form</h2> <div id="prereqs"><h2>Prerequisites</h2>
<h5 id="whyformlink"><a href="#whyform">Why?</a></h5>
<p>Ensure Tampermonkey is installed: <a href="https://www.tampermonkey.net/">Tampermonkey Home Page</a> <a href="https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo">Chrome Extension</a> <s><a href="https://addons.mozilla.org/en-US/firefox/addon/tampermonkey/">Firefox Add-On</a></s></p>
<form id="install-form" action="remote_instance_actions.user.js" method="get">
<p>Enter each instance you wish to use the script on. This should be just "domain.tld", no extra formatting. One domain per line.</p> <p>At time of writing, the script doesn't work in Firefox and I haven't the foggiest idea why. Working on it.</p></div>
<textarea id="instance-input" placeholder="glaceon.social"></textarea><br>
<input id="install-button" type="submit" value="Install"> <div id="installation"><h2>Installation Form</h2>
</form> <h5 id="whyformlink"><a href="#whyform">Why?</a></h5>
<hr> <form id="install-form" action="remote_instance_actions.user.js" method="get">
<p>Enter each instance you wish to use the script on. This should be just "domain.tld", no extra formatting. One domain per line.</p>
<h2>FAQ</h2> <textarea id="instance-input" placeholder="glaceon.social"></textarea><br>
<input id="install-button" type="submit" value="Install">
<h3>What's this?</h2> </form></div>
<p>Remote Instance Actions is a userscript I've written to aid in Mastodon moderation.</p> <hr>
<p>(That really is just "Mastodon", not "fediverse". Sorry, Misskey admins).</p> <div id="faq"><h2>FAQ</h2>
<p>It's as simple as the image at the top makes it look! Just highlight the URL of an instance you want to silence or suspend, and select the new context option. It does a little bit of simple sanitizing and validation to make sure you highlighted what you wanted to highlight. Then, it checks to see if the instance is already limited. Finally, it opens a new tab to your instance's "New Domain Block" form.</p> <h3>What's this?</h2>
<h3>What is a userscript?</h3> <p>Remote Instance Actions is a userscript I've written to aid in Mastodon moderation.</p>
<p>A userscript is sort of like a browser extension, but smaller! Just a little bit of Javascript code that gets run on certain pages to enhance the experience.</p> <p>(That really is just "Mastodon", not "fediverse". Sorry, Misskey admins).</p>
<p>If you're asking this question, you should probably know that you do actually need a browser extension to run userscripts. The most popular and feature-complete one by far (as well as the one this userscript was tested with!) is Tampermonkey.</p> <p>It's as simple as the image at the top makes it look! Just highlight the URL of an instance you want to silence or suspend, and select the new context option. It does a little bit of simple sanitizing and validation to make sure you highlighted what you wanted to highlight. Then, it checks to see if the instance is already limited. Finally, it opens a new tab to your instance's "New Domain Block" form.</p>
<p><a href="https://www.tampermonkey.net/">Tampermonkey Home Page</a> <a href="https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo">Chrome Extension</a> <s><a href="https://addons.mozilla.org/en-US/firefox/addon/tampermonkey/">Firefox Add-On</a></s></p> <h3>What is a userscript?</h3>
<p>At time of writing, the script doesn't work in Firefox and I haven't the foggiest idea why. Working on it.</p> <p>A userscript is sort of like a browser extension, but smaller! Just a little bit of Javascript code that gets run on certain pages to enhance the experience.</p>
<div id="whyform"><h3>It's just a userscript? Why the complex installation process?</h3> <p>Of course, most browsers do actually need a browser extension to run userscripts. The most popular and feature-complete one by far (as well as the one this userscript was tested with!) is Tampermonkey.</p>
<p>When writing a userscript, you have to hardcode in the URL of websites it will work on. That's fine for, say, Twitter, where it's always found at "twitter.com" (for the time being, anyway). Mastodon instances are a lot harder to write for. If I wrote it to, for example, check if the current page is a Mastodon instance and conditionally add the context menu item, it would have to run on <em>every page you visit</em> to make that check.</p> <div id="whyform"><h3>It's just a userscript? Why the complex installation process?</h3>
<p>The usual way to solve this problem is to just tell the user to modify the userscript to add the pages you'd like it to run on. That sucks for a number of reasons. The most obvious are that users don't want to have to go in and mess with the code, and that it breaks with Tampermonkey's update functionality. This page here is my overengineered solution.</p> <p>When writing a userscript, you have to hardcode in the URL of websites it will work on. That's fine for, say, Twitter, where it's always found at "twitter.com" (for the time being, anyway). Mastodon instances are a lot harder to write for. If I wrote it to, for example, check if the current page is a Mastodon instance and conditionally add the context menu item, it would have to run on <em>every page you visit</em> to make that check.</p>
<p>The userscript itself, in a usable state, isn't <em>exactly</em> stored anywhere on my server. There is a version that's very similar, but with a little bit of PHP where you would expect the @match directives to be. That PHP code fills in the match directives with domains provided via GET parameters before sending it to your browser. Since the script was installed from a URL with those parameters in it, Tampermonkey will include those same parameters when checking for updates.</p> <p>The usual way to solve this problem is to just tell the user to modify the userscript to add the pages you'd like it to run on. That sucks for a number of reasons. The most obvious are that users don't want to have to go in and mess with the code, and that it breaks with Tampermonkey's update functionality. This page here is my overengineered solution.</p>
<p>The slightly less technical answer is that using this install page generates the userscript with the proper domains set on the fly, and does so in a way such that Tampermonkey will fetch updates that are generated with the same domains.</p></div> <p>The userscript itself, in a usable state, isn't <em>exactly</em> stored anywhere on my server. There is a version that's very similar, but with a little bit of PHP where you would expect the @match directives to be. That PHP code fills in the match directives with domains provided via GET parameters before sending it to your browser. Since the script was installed from a URL with those parameters in it, Tampermonkey will include those same parameters when checking for updates.</p>
<h3>Can I see the source code?</h3> <p>The slightly less technical answer is that using this install page generates the userscript with the proper domains set on the fly, and does so in a way such that Tampermonkey will fetch updates that are generated with the same domains.</p></div>
<p>Well, your browser will show you the code before installing, but if you want to inspect it beforehand it's available on <a href="https://git.hollymcfarland.com/monorail/remote_instance_actions">my gitea instance</a>. <h3>Can I see the source code?</h3>
<h3>How can I contact you?</h3> <p>Well, your browser will show you the code before installing, but if you want to inspect it it's available on <a href="https://git.hollymcfarland.com/monorail/remote_instance_actions">my gitea instance</a>.
<p>If you're on the fediverse, I can be found at <a href="https://glaceon.social/@monorail">@monorail@glaceon.social</a>.</p> <h3>How can I contact you?</h3>
<p>If you aren't... How exactly did you get here?</p> <p>If you're on the fediverse, I can be found at <a href="https://glaceon.social/@monorail">@monorail@glaceon.social</a>.</p>
</body> <p>If you aren't... How exactly did you get here?</p></div>
</html>
</body>
</html>

View File

@ -15,6 +15,10 @@ body {
} }
*/ */
#prereqs {
text-align: center;
}
footer { footer {
padding: 0 4em; padding: 0 4em;
font-size: 10pt; font-size: 10pt;