ENERGIZE!
This commit is contained in:
commit
4875e09740
18
LICENSE
Normal file
18
LICENSE
Normal file
|
|
@ -0,0 +1,18 @@
|
||||||
|
Copyright (C) 2022 smpl <smpl@slamkode.ml>
|
||||||
|
|
||||||
|
This software is provided 'as-is', without any express or implied
|
||||||
|
warranty. In no event will the authors be held liable for any damages
|
||||||
|
arising from the use of this software.
|
||||||
|
|
||||||
|
Permission is granted to anyone to use this software for any purpose,
|
||||||
|
including commercial applications, and to alter it and redistribute it
|
||||||
|
freely, subject to the following restrictions:
|
||||||
|
|
||||||
|
1. The origin of this software must not be misrepresented; you must not
|
||||||
|
claim that you wrote the original software. If you use this software
|
||||||
|
in a product, an acknowledgment in the product documentation would
|
||||||
|
be appreciated but is not required.
|
||||||
|
2. Altered source versions must be plainly marked as such, and must not
|
||||||
|
be misrepresented as being the original software.
|
||||||
|
3. This notice may not be removed or altered from any source
|
||||||
|
distribution.
|
||||||
70
README
Normal file
70
README
Normal file
|
|
@ -0,0 +1,70 @@
|
||||||
|
Preparing the HTML embed
|
||||||
|
------------------------
|
||||||
|
If your handle on mastodon is @superman@fortitude.fortress the remote
|
||||||
|
follow portal page is this:
|
||||||
|
|
||||||
|
https://fortitude.fortress/users/superman/remote_follow
|
||||||
|
|
||||||
|
In the following HTML snippet to embed on your site replace {uri} with
|
||||||
|
your remote_follow link corresponding to what was just explained.
|
||||||
|
|
||||||
|
<div style="display: inline-block; position: relative;">
|
||||||
|
<a href="{uri}">
|
||||||
|
<img id="mastodonfollow" onclick="mastodon_follow_show()" style="height: 32px;" src="{icon}"/>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
Next decide on the icon you want to use:
|
||||||
|
mastodon-follow-dark-da.svg
|
||||||
|
mastodon-follow-dark-en.svg
|
||||||
|
mastodon-follow-dark.svg
|
||||||
|
mastodon-follow-light-da.svg
|
||||||
|
mastodon-follow-light-en.svg
|
||||||
|
mastodon-follow-light.svg
|
||||||
|
|
||||||
|
This is the icon you upload to somewhere on your site. Replace {icon}
|
||||||
|
with the path to your icon in the above HTML snippet.
|
||||||
|
|
||||||
|
You can adjust the image size in the style attribute as appropriate for
|
||||||
|
your site.
|
||||||
|
|
||||||
|
Insert the HTML snippet in the place where you want the button on your
|
||||||
|
page.
|
||||||
|
|
||||||
|
I have prepared variants of the script to match the icons. Pick the
|
||||||
|
appropriate one and upload it to your site. Replace {script} in the
|
||||||
|
snippet below and insert it in the <head></head> of your website.
|
||||||
|
|
||||||
|
<script src="{script}" type="text/javascript"></script>
|
||||||
|
|
||||||
|
IMPORTANT: Remember to change the account and portal settings to point
|
||||||
|
to your mastodon account.
|
||||||
|
|
||||||
|
You can change the link that "Create account" points to in the
|
||||||
|
create_url setting and easily translate the strings to other languages.
|
||||||
|
|
||||||
|
Implementation notes
|
||||||
|
--------------------
|
||||||
|
The script reserves the following globals:
|
||||||
|
|
||||||
|
HTML/CSS:
|
||||||
|
#mastodonfollow
|
||||||
|
input[name="mastodon-handle"]
|
||||||
|
.mastodon-follow-container
|
||||||
|
.mastodon-follow-title
|
||||||
|
.mastodon-follow-input
|
||||||
|
.mastodon-follow-button
|
||||||
|
JS:
|
||||||
|
var mastodon_follow_settings
|
||||||
|
var mastodon_follow_strings
|
||||||
|
var mastodon_follow_container
|
||||||
|
function mastodon_follow_create_style
|
||||||
|
function mastodon_follow_go
|
||||||
|
function mastodon_follow_lookup
|
||||||
|
function mastodon_follow_show
|
||||||
|
|
||||||
|
Bugs
|
||||||
|
----
|
||||||
|
Report bugs to smpl@slamkode.ml
|
||||||
|
|
||||||
|
License: Zlib
|
||||||
210
mastodon-follow-dark-da.js
Normal file
210
mastodon-follow-dark-da.js
Normal file
|
|
@ -0,0 +1,210 @@
|
||||||
|
/* SPDX-License-Identifier: Zlib
|
||||||
|
Copyright (C) 2022 smpl <smpl@slamkode.ml> */
|
||||||
|
|
||||||
|
var mastodon_follow_settings = {
|
||||||
|
"account": "superman@fortitude.fortress",
|
||||||
|
"portal": "https://fortitude.fortress/users/superman/remote_follow",
|
||||||
|
"dialog": {
|
||||||
|
"width": "256px",
|
||||||
|
"background": "#282c37",
|
||||||
|
"color": "#9baec8",
|
||||||
|
"title": "#fff",
|
||||||
|
"input": {
|
||||||
|
"bordercolor": "#0a0b0e",
|
||||||
|
"background": "#131419",
|
||||||
|
"color": "#fff",
|
||||||
|
"placeholder": "#c83737"
|
||||||
|
},
|
||||||
|
"button": {
|
||||||
|
"background": "#2b90d9",
|
||||||
|
"color": "#fff"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
var mastodon_follow_strings =
|
||||||
|
{
|
||||||
|
"title": "Tast dit Mastodon id",
|
||||||
|
"button": "Følg",
|
||||||
|
"create": "Opret konto",
|
||||||
|
"create_url": "https://joinmastodon.org/communities",
|
||||||
|
"error": { "handle": "Forkert id" }
|
||||||
|
};
|
||||||
|
|
||||||
|
var mastodon_follow_container = null;
|
||||||
|
|
||||||
|
/* Remove nojs fallback link, when JS enabled. */
|
||||||
|
window.addEventListener("load", function(e) {
|
||||||
|
mastodonfollow.style.cursor = "pointer";
|
||||||
|
var a = mastodonfollow.parentNode;
|
||||||
|
var c = a.parentNode;
|
||||||
|
c.appendChild(mastodonfollow);
|
||||||
|
a.remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
function mastodon_follow_create_style()
|
||||||
|
{
|
||||||
|
var style = document.createElement('style');
|
||||||
|
var d = mastodon_follow_settings.dialog;
|
||||||
|
style.innerHTML =
|
||||||
|
".mastodon-follow-container {" +
|
||||||
|
"display: block;" +
|
||||||
|
"z-index: 1;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 5px;" +
|
||||||
|
"background: " + d.background + ";" +
|
||||||
|
"position: absolute;" +
|
||||||
|
"top:110%;" +
|
||||||
|
"left: 0;" +
|
||||||
|
"width: " + d.width + ";" +
|
||||||
|
'font-family: "Roboto",Roboto,sans-serif;' +
|
||||||
|
"margin: 0 auto;" +
|
||||||
|
"padding: 20px;" +
|
||||||
|
"font-weight: 400;" +
|
||||||
|
"font-size: 13px;" +
|
||||||
|
"color: " + d.color + ";" +
|
||||||
|
"line-height: 18px;" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-title {" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"margin: 0;" +
|
||||||
|
"color: " + d.title + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input {" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.input.background + ";" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.input.color + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input::placeholder {" +
|
||||||
|
"color: " + d.input.placeholder + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-button {" +
|
||||||
|
"display: block;" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-right: 10px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.button.background + ";" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.button.color + ";" +
|
||||||
|
"line-height: inherit;" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"text-transform: uppercase;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"cursor: pointer;" +
|
||||||
|
"}";
|
||||||
|
document.head.appendChild(style);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when request to instance is complete.
|
||||||
|
* Parse the JSON response and find the subscribe uri.
|
||||||
|
* On error goes to the instances remote_follow url. */
|
||||||
|
function mastodon_follow_go(event)
|
||||||
|
{
|
||||||
|
var data;
|
||||||
|
|
||||||
|
if (this.readyState === this.DONE) {
|
||||||
|
if (this.status === 200) {
|
||||||
|
try {
|
||||||
|
data = JSON.parse(this.responseText);
|
||||||
|
} catch {
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
data.links.forEach( function(e) {
|
||||||
|
if(e.rel === "http://ostatus.org/schema/1.0/subscribe") {
|
||||||
|
window.location = e.template.replace('{uri}', encodeURIComponent(mastodon_follow_settings.account));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when user click on follow button in dialog.
|
||||||
|
* Grab the mastodon handle from the input field and request the
|
||||||
|
* appropriate webfinger document from the users instance.
|
||||||
|
* Response is handled by mastodon_follow_go(). */
|
||||||
|
function mastodon_follow_lookup(event)
|
||||||
|
{
|
||||||
|
var handle_element = document.querySelector('input[name="mastodon-handle"]');
|
||||||
|
var handle = handle_element.value;
|
||||||
|
|
||||||
|
// remove any initial @
|
||||||
|
if(handle.charAt(0) == '@') {
|
||||||
|
handle = handle.substring(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
// split into nick and host
|
||||||
|
var uriparts = handle.split('@');
|
||||||
|
if(uriparts.length < 2) {
|
||||||
|
handle_element.value = '';
|
||||||
|
handle_element.setAttribute('placeholder', mastodon_follow_strings.error.handle);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var oReq = new XMLHttpRequest();
|
||||||
|
oReq.addEventListener("load", mastodon_follow_go);
|
||||||
|
oReq.open("GET", "https://" + uriparts[1] + "/.well-known/webfinger?resource=acct:" + encodeURIComponent(handle));
|
||||||
|
oReq.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Activated when icon is clicked.
|
||||||
|
* Create the follow dialog on first run, toggle visibility on further
|
||||||
|
* clicks. */
|
||||||
|
function mastodon_follow_show()
|
||||||
|
{
|
||||||
|
if(!mastodon_follow_container) {
|
||||||
|
mastodon_follow_create_style();
|
||||||
|
|
||||||
|
mastodon_follow_container = document.createElement('div');
|
||||||
|
mastodon_follow_container.setAttribute('class', 'mastodon-follow-container');
|
||||||
|
|
||||||
|
var mastodon_title = document.createElement('p');
|
||||||
|
mastodon_title.setAttribute('class', 'mastodon-follow-title');
|
||||||
|
mastodon_title.innerHTML = mastodon_follow_strings.title;
|
||||||
|
|
||||||
|
var mastodon_follow_handle = document.createElement('input');
|
||||||
|
mastodon_follow_handle.setAttribute('name', 'mastodon-handle');
|
||||||
|
mastodon_follow_handle.setAttribute('type', 'text');
|
||||||
|
mastodon_follow_handle.setAttribute('class', 'mastodon-follow-input');
|
||||||
|
|
||||||
|
var mastodon_follow_follow = document.createElement('button');
|
||||||
|
mastodon_follow_follow.innerHTML = mastodon_follow_strings.button;
|
||||||
|
mastodon_follow_follow.setAttribute('class', 'mastodon-follow-button');
|
||||||
|
mastodon_follow_follow.addEventListener('click', mastodon_follow_lookup);
|
||||||
|
|
||||||
|
var createaccount = document.createElement('div');
|
||||||
|
createaccount.style = "text-align: right;";
|
||||||
|
var createaccount_a = document.createElement('a');
|
||||||
|
createaccount_a.setAttribute('href', mastodon_follow_strings.create_url);
|
||||||
|
createaccount_a.innerHTML = mastodon_follow_strings.create;
|
||||||
|
createaccount.appendChild(createaccount_a);
|
||||||
|
|
||||||
|
mastodon_follow_container.appendChild(mastodon_title);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_handle);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_follow);
|
||||||
|
mastodon_follow_container.appendChild(createaccount);
|
||||||
|
|
||||||
|
mastodonfollow.parentElement.appendChild(mastodon_follow_container);
|
||||||
|
} else {
|
||||||
|
mastodon_follow_container.style.display =
|
||||||
|
mastodon_follow_container.style.display == "none" ? "block" : "none";
|
||||||
|
}
|
||||||
|
}
|
||||||
33
mastodon-follow-dark-da.svg
Normal file
33
mastodon-follow-dark-da.svg
Normal file
|
|
@ -0,0 +1,33 @@
|
||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
version="1.1"
|
||||||
|
height="45.014904mm"
|
||||||
|
width="85.691597mm"
|
||||||
|
viewBox="0 0 85.691597 45.014904">
|
||||||
|
<rect
|
||||||
|
ry="5.9620543"
|
||||||
|
y="1.0440584"
|
||||||
|
x="1.0440561"
|
||||||
|
height="42.926792"
|
||||||
|
width="83.603485"
|
||||||
|
style="fill:#282c37;stroke:#1b1d25;stroke-width:2.08811116;" />
|
||||||
|
<path
|
||||||
|
d="m 36.173854,25.50178 c -0.412679,2.12307 -3.696111,4.44656 -7.467135,4.89685 -1.966427,0.23464 -3.902531,0.4503 -5.96706,0.3556 -3.376344,-0.15469 -6.040514,-0.80589 -6.040514,-0.80589 0,0.32868 0.02027,0.64164 0.06081,0.93432 0.438947,3.33208 3.304025,3.53169 6.017975,3.62476 2.739247,0.0937 5.178349,-0.67536 5.178349,-0.67536 l 0.112534,2.47639 c 0,0 -1.915997,1.02886 -5.329151,1.2181 -1.882107,0.10345 -4.219053,-0.0474 -6.940949,-0.7678 -5.903334,-1.5625 -6.918572,-7.85516 -7.073914,-14.24009 -0.04735,-1.89573 -0.01816,-3.6833 -0.01816,-5.17835 0,-6.52892 4.277753,-8.44265 4.277753,-8.44265 2.156956,-0.99058 5.858093,-1.40716 9.705815,-1.43862 h 0.09453 c 3.847723,0.0315 7.551293,0.44804 9.708087,1.43862 0,0 4.27759,1.91373 4.27759,8.44265 0,0 0.05367,4.81707 -0.59656,8.16147"
|
||||||
|
style="fill:#3088d4;" />
|
||||||
|
<path
|
||||||
|
d="m 31.724706,17.84681 v 7.90543 h -3.131981 v -7.67307 c 0,-1.61747 -0.680555,-2.43845 -2.041827,-2.43845 -1.505102,0 -2.259437,0.97389 -2.259437,2.89962 v 4.19991 h -3.113495 v -4.19991 c 0,-1.92573 -0.754497,-2.89962 -2.259599,-2.89962 -1.361272,0 -2.041827,0.82098 -2.041827,2.43845 v 7.67307 h -3.131981 v -7.90543 c 0,-1.61569 0.411381,-2.89962 1.237712,-3.84951 0.852113,-0.94989 1.968048,-1.43683 3.353319,-1.43683 1.602719,0 2.816432,0.61602 3.618925,1.84822 l 0.780117,1.30776 0.780279,-1.30776 c 0.802332,-1.2322 2.016046,-1.84822 3.618926,-1.84822 1.385109,0 2.501044,0.48694 3.353319,1.43683 0.826168,0.94989 1.23755,2.23382 1.23755,3.84951"
|
||||||
|
style="fill:#ffffff;" />
|
||||||
|
<g style="fill:#3088d4;">
|
||||||
|
<path
|
||||||
|
d="m 69.506087,14.94682 c 2.06847,0 3.74388,-1.67538 3.74388,-3.74388 0,-2.06851 -1.67541,-3.74389 -3.74388,-3.74389 -2.0685,0 -3.74388,1.67538 -3.74388,3.74389 0,2.0685 1.67538,3.74388 3.74388,3.74388 z m -8.42376,-1.87193 v -2.80792 h -1.87197 v 2.80792 h -2.80792 v 1.87193 h 2.80792 v 2.80792 h 1.87197 v -2.80792 h 2.80792 v -1.87193 z m 8.42376,3.74389 c -2.49906,0 -7.48781,1.2542 -7.48781,3.74389 v 1.87196 h 14.97558 v -1.87196 c 0,-2.48969 -4.98874,-3.74389 -7.48777,-3.74389 z" />
|
||||||
|
<path
|
||||||
|
d="M 40.703998,36.83326 V 25.75843 h 7.408579 v 2.06132 h -4.738753 v 2.54812 h 4.305193 v 2.05371 h -4.305193 v 4.41168 z" />
|
||||||
|
<path
|
||||||
|
d="m 53.847757,36.98539 q -1.22462,0 -2.22105,-0.49441 l -0.60851,1.06488 h -1.58212 l 1.0725,-1.86355 q -1.51367,-1.51366 -1.51367,-4.23673 v -0.38032 q 0,-2.54052 1.34633,-4.00094 1.35393,-1.46802 3.49131,-1.46802 1.2018,0 2.19063,0.48681 l 0.46398,-0.80628 h 1.57452 l -0.92037,1.59734 q 1.54408,1.51366 1.54408,4.26715 v 0.37271 q 0,2.54052 -1.36153,4.00094 -1.35393,1.46042 -3.4761,1.46042 z m -2.13738,-5.46136 q 0,1.00404 0.20537,1.71904 l 2.9969,-5.21795 q -0.45638,-0.32708 -1.0801,-0.32708 -1.99286,0 -2.11456,2.96648 z m 4.25955,-0.46398 q 0,-1.01925 -0.22058,-1.74946 l -3.01211,5.25598 q 0.45638,0.33468 1.11052,0.33468 1.01165,0 1.5593,-0.85952 0.55527,-0.86712 0.56287,-2.47206 z" />
|
||||||
|
<path
|
||||||
|
d="m 67.280557,34.77955 v 2.05371 h -7.3173 V 25.75843 h 2.66983 v 9.02112 z" />
|
||||||
|
<path
|
||||||
|
d="m 76.993857,30.91553 v 4.54859 q -0.42595,0.47159 -1.52127,0.99643 -1.09531,0.52484 -2.8828,0.52484 -2.20584,0 -3.54456,-1.39196 -1.33111,-1.39957 -1.33111,-3.98572 v -0.61612 q 0,-2.58616 1.33111,-3.98572 1.33111,-1.40718 3.40004,-1.40718 2.28951,0 3.33158,1.05729 1.04207,1.05728 1.20941,2.71546 h -2.56334 q -0.1217,-0.82148 -0.54005,-1.27026 -0.41835,-0.44877 -1.34632,-0.44877 -0.9584,0 -1.52888,0.81387 -0.57047,0.81388 -0.57808,2.46446 v 0.67697 q 0,1.66578 0.58569,2.49488 0.59329,0.82909 1.76467,0.82909 1.03446,0 1.54409,-0.46399 v -1.71903 h -1.85595 v -1.83313 z" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.8 KiB |
210
mastodon-follow-dark-en.js
Normal file
210
mastodon-follow-dark-en.js
Normal file
|
|
@ -0,0 +1,210 @@
|
||||||
|
/* SPDX-License-Identifier: Zlib
|
||||||
|
Copyright (C) 2022 smpl <smpl@slamkode.ml> */
|
||||||
|
|
||||||
|
var mastodon_follow_settings = {
|
||||||
|
"account": "superman@fortitude.fortress",
|
||||||
|
"portal": "https://fortitude.fortress/users/superman/remote_follow",
|
||||||
|
"dialog": {
|
||||||
|
"width": "256px",
|
||||||
|
"background": "#282c37",
|
||||||
|
"color": "#9baec8",
|
||||||
|
"title": "#fff",
|
||||||
|
"input": {
|
||||||
|
"bordercolor": "#0a0b0e",
|
||||||
|
"background": "#131419",
|
||||||
|
"color": "#fff",
|
||||||
|
"placeholder": "#c83737"
|
||||||
|
},
|
||||||
|
"button": {
|
||||||
|
"background": "#2b90d9",
|
||||||
|
"color": "#fff"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
var mastodon_follow_strings =
|
||||||
|
{
|
||||||
|
"title": "Enter your Mastodon handle",
|
||||||
|
"button": "Follow",
|
||||||
|
"create": "Create account",
|
||||||
|
"create_url": "https://joinmastodon.org/communities",
|
||||||
|
"error": { "handle": "Invalid handle" }
|
||||||
|
};
|
||||||
|
|
||||||
|
var mastodon_follow_container = null;
|
||||||
|
|
||||||
|
/* Remove nojs fallback link, when JS enabled. */
|
||||||
|
window.addEventListener("load", function(e) {
|
||||||
|
mastodonfollow.style.cursor = "pointer";
|
||||||
|
var a = mastodonfollow.parentNode;
|
||||||
|
var c = a.parentNode;
|
||||||
|
c.appendChild(mastodonfollow);
|
||||||
|
a.remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
function mastodon_follow_create_style()
|
||||||
|
{
|
||||||
|
var style = document.createElement('style');
|
||||||
|
var d = mastodon_follow_settings.dialog;
|
||||||
|
style.innerHTML =
|
||||||
|
".mastodon-follow-container {" +
|
||||||
|
"display: block;" +
|
||||||
|
"z-index: 1;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 5px;" +
|
||||||
|
"background: " + d.background + ";" +
|
||||||
|
"position: absolute;" +
|
||||||
|
"top:110%;" +
|
||||||
|
"left: 0;" +
|
||||||
|
"width: " + d.width + ";" +
|
||||||
|
'font-family: "Roboto",Roboto,sans-serif;' +
|
||||||
|
"margin: 0 auto;" +
|
||||||
|
"padding: 20px;" +
|
||||||
|
"font-weight: 400;" +
|
||||||
|
"font-size: 13px;" +
|
||||||
|
"color: " + d.color + ";" +
|
||||||
|
"line-height: 18px;" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-title {" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"margin: 0;" +
|
||||||
|
"color: " + d.title + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input {" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.input.background + ";" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.input.color + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input::placeholder {" +
|
||||||
|
"color: " + d.input.placeholder + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-button {" +
|
||||||
|
"display: block;" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-right: 10px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.button.background + ";" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.button.color + ";" +
|
||||||
|
"line-height: inherit;" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"text-transform: uppercase;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"cursor: pointer;" +
|
||||||
|
"}";
|
||||||
|
document.head.appendChild(style);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when request to instance is complete.
|
||||||
|
* Parse the JSON response and find the subscribe uri.
|
||||||
|
* On error goes to the instances remote_follow url. */
|
||||||
|
function mastodon_follow_go(event)
|
||||||
|
{
|
||||||
|
var data;
|
||||||
|
|
||||||
|
if (this.readyState === this.DONE) {
|
||||||
|
if (this.status === 200) {
|
||||||
|
try {
|
||||||
|
data = JSON.parse(this.responseText);
|
||||||
|
} catch {
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
data.links.forEach( function(e) {
|
||||||
|
if(e.rel === "http://ostatus.org/schema/1.0/subscribe") {
|
||||||
|
window.location = e.template.replace('{uri}', encodeURIComponent(mastodon_follow_settings.account));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when user click on follow button in dialog.
|
||||||
|
* Grab the mastodon handle from the input field and request the
|
||||||
|
* appropriate webfinger document from the users instance.
|
||||||
|
* Response is handled by mastodon_follow_go(). */
|
||||||
|
function mastodon_follow_lookup(event)
|
||||||
|
{
|
||||||
|
var handle_element = document.querySelector('input[name="mastodon-handle"]');
|
||||||
|
var handle = handle_element.value;
|
||||||
|
|
||||||
|
// remove any initial @
|
||||||
|
if(handle.charAt(0) == '@') {
|
||||||
|
handle = handle.substring(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
// split into nick and host
|
||||||
|
var uriparts = handle.split('@');
|
||||||
|
if(uriparts.length < 2) {
|
||||||
|
handle_element.value = '';
|
||||||
|
handle_element.setAttribute('placeholder', mastodon_follow_strings.error.handle);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var oReq = new XMLHttpRequest();
|
||||||
|
oReq.addEventListener("load", mastodon_follow_go);
|
||||||
|
oReq.open("GET", "https://" + uriparts[1] + "/.well-known/webfinger?resource=acct:" + encodeURIComponent(handle));
|
||||||
|
oReq.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Activated when icon is clicked.
|
||||||
|
* Create the follow dialog on first run, toggle visibility on further
|
||||||
|
* clicks. */
|
||||||
|
function mastodon_follow_show()
|
||||||
|
{
|
||||||
|
if(!mastodon_follow_container) {
|
||||||
|
mastodon_follow_create_style();
|
||||||
|
|
||||||
|
mastodon_follow_container = document.createElement('div');
|
||||||
|
mastodon_follow_container.setAttribute('class', 'mastodon-follow-container');
|
||||||
|
|
||||||
|
var mastodon_title = document.createElement('p');
|
||||||
|
mastodon_title.setAttribute('class', 'mastodon-follow-title');
|
||||||
|
mastodon_title.innerHTML = mastodon_follow_strings.title;
|
||||||
|
|
||||||
|
var mastodon_follow_handle = document.createElement('input');
|
||||||
|
mastodon_follow_handle.setAttribute('name', 'mastodon-handle');
|
||||||
|
mastodon_follow_handle.setAttribute('type', 'text');
|
||||||
|
mastodon_follow_handle.setAttribute('class', 'mastodon-follow-input');
|
||||||
|
|
||||||
|
var mastodon_follow_follow = document.createElement('button');
|
||||||
|
mastodon_follow_follow.innerHTML = mastodon_follow_strings.button;
|
||||||
|
mastodon_follow_follow.setAttribute('class', 'mastodon-follow-button');
|
||||||
|
mastodon_follow_follow.addEventListener('click', mastodon_follow_lookup);
|
||||||
|
|
||||||
|
var createaccount = document.createElement('div');
|
||||||
|
createaccount.style = "text-align: right;";
|
||||||
|
var createaccount_a = document.createElement('a');
|
||||||
|
createaccount_a.setAttribute('href', mastodon_follow_strings.create_url);
|
||||||
|
createaccount_a.innerHTML = mastodon_follow_strings.create;
|
||||||
|
createaccount.appendChild(createaccount_a);
|
||||||
|
|
||||||
|
mastodon_follow_container.appendChild(mastodon_title);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_handle);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_follow);
|
||||||
|
mastodon_follow_container.appendChild(createaccount);
|
||||||
|
|
||||||
|
mastodonfollow.parentElement.appendChild(mastodon_follow_container);
|
||||||
|
} else {
|
||||||
|
mastodon_follow_container.style.display =
|
||||||
|
mastodon_follow_container.style.display == "none" ? "block" : "none";
|
||||||
|
}
|
||||||
|
}
|
||||||
37
mastodon-follow-dark-en.svg
Normal file
37
mastodon-follow-dark-en.svg
Normal file
|
|
@ -0,0 +1,37 @@
|
||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
version="1.1"
|
||||||
|
viewBox="0 0 85.691597 45.014904"
|
||||||
|
height="45.014904mm"
|
||||||
|
width="85.691597mm">
|
||||||
|
<rect
|
||||||
|
ry="5.9620543"
|
||||||
|
y="1.0440584"
|
||||||
|
x="1.0440561"
|
||||||
|
height="42.926792"
|
||||||
|
width="83.603485"
|
||||||
|
style="fill:#282c37;stroke:#1b1d25;stroke-width:2.08811116;" />
|
||||||
|
<path
|
||||||
|
d="m 36.173854,25.50178 c -0.412679,2.12307 -3.696111,4.44656 -7.467135,4.89685 -1.966427,0.23464 -3.902531,0.4503 -5.96706,0.3556 -3.376344,-0.15469 -6.040514,-0.80589 -6.040514,-0.80589 0,0.32868 0.02027,0.64164 0.06081,0.93432 0.438947,3.33208 3.304025,3.53169 6.017975,3.62476 2.739247,0.0937 5.178349,-0.67536 5.178349,-0.67536 l 0.112534,2.47639 c 0,0 -1.915997,1.02886 -5.329151,1.2181 -1.882107,0.10345 -4.219053,-0.0474 -6.940949,-0.7678 -5.903334,-1.5625 -6.918572,-7.85516 -7.073914,-14.24009 -0.04735,-1.89573 -0.01816,-3.6833 -0.01816,-5.17835 0,-6.52892 4.277753,-8.44265 4.277753,-8.44265 2.156956,-0.99058 5.858093,-1.40716 9.705815,-1.43862 h 0.09453 c 3.847723,0.0315 7.551293,0.44804 9.708087,1.43862 0,0 4.27759,1.91373 4.27759,8.44265 0,0 0.05367,4.81707 -0.59656,8.16147"
|
||||||
|
style="fill:#3088d4;" />
|
||||||
|
<path
|
||||||
|
d="m 31.724706,17.84681 v 7.90543 h -3.131981 v -7.67307 c 0,-1.61747 -0.680555,-2.43845 -2.041827,-2.43845 -1.505102,0 -2.259437,0.97389 -2.259437,2.89962 v 4.19991 h -3.113495 v -4.19991 c 0,-1.92573 -0.754497,-2.89962 -2.259599,-2.89962 -1.361272,0 -2.041827,0.82098 -2.041827,2.43845 v 7.67307 h -3.131981 v -7.90543 c 0,-1.61569 0.411381,-2.89962 1.237712,-3.84951 0.852113,-0.94989 1.968048,-1.43683 3.353319,-1.43683 1.602719,0 2.816432,0.61602 3.618925,1.84822 l 0.780117,1.30776 0.780279,-1.30776 c 0.802332,-1.2322 2.016046,-1.84822 3.618926,-1.84822 1.385109,0 2.501044,0.48694 3.353319,1.43683 0.826168,0.94989 1.23755,2.23382 1.23755,3.84951"
|
||||||
|
style="fill:#ffffff;" />
|
||||||
|
<g style="fill:#3088d4;">
|
||||||
|
<path
|
||||||
|
d="m 69.506087,14.94682 c 2.06847,0 3.74388,-1.67538 3.74388,-3.74388 0,-2.06851 -1.67541,-3.74389 -3.74388,-3.74389 -2.0685,0 -3.74388,1.67538 -3.74388,3.74389 0,2.0685 1.67538,3.74388 3.74388,3.74388 z m -8.42376,-1.87193 v -2.80792 h -1.87197 v 2.80792 h -2.80792 v 1.87193 h 2.80792 v 2.80792 h 1.87197 v -2.80792 h 2.80792 v -1.87193 z m 8.42376,3.74389 c -2.49906,0 -7.48781,1.2542 -7.48781,3.74389 v 1.87196 h 14.97558 v -1.87196 c 0,-2.48969 -4.98874,-3.74389 -7.48777,-3.74389 z" />
|
||||||
|
<path
|
||||||
|
d="m 38.77358,37.45718 v -7.18419 h 4.805906 v 1.33717 h -3.074004 v 1.65295 h 2.792754 v 1.33224 h -2.792754 v 2.86183 z" />
|
||||||
|
<path
|
||||||
|
d="m 50.378807,34.01311 q 0,1.64802 -0.87829,2.59539 -0.87828,0.94736 -2.25492,0.94736 -1.386512,0 -2.269734,-0.94736 -0.878287,-0.94737 -0.878287,-2.59539 v -0.29112 q 0,-1.64802 0.873353,-2.59538 0.878287,-0.9523 2.264798,-0.9523 1.37664,0 2.25986,0.9523 0.88322,0.94736 0.88322,2.59538 z m -1.75657,-0.30098 q 0,-1.08553 -0.3454,-1.63322 -0.34539,-0.5477 -1.04111,-0.5477 -1.292761,0 -1.371708,1.92434 l -0.0049,0.55756 q 0,1.05592 0.345398,1.62335 0.35032,0.56743 1.04111,0.56743 0.65625,0 1.01151,-0.55756 0.3602,-0.5625 0.36513,-1.60361 z" />
|
||||||
|
<path
|
||||||
|
d="m 56.013657,36.12495 v 1.33223 h -4.74669 v -7.18419 h 1.7319 v 5.85196 z" />
|
||||||
|
<path
|
||||||
|
d="m 61.500487,36.12495 v 1.33223 h -4.7467 v -7.18419 h 1.7319 v 5.85196 z" />
|
||||||
|
<path
|
||||||
|
d="m 68.003757,34.01311 q 0,1.64802 -0.87829,2.59539 -0.87829,0.94736 -2.25493,0.94736 -1.38651,0 -2.26973,-0.94736 -0.87828,-0.94737 -0.87828,-2.59539 v -0.29112 q 0,-1.64802 0.87335,-2.59538 0.87828,-0.9523 2.26479,-0.9523 1.37664,0 2.25987,0.9523 0.88322,0.94736 0.88322,2.59538 z m -1.75658,-0.30098 q 0,-1.08553 -0.34539,-1.63322 -0.34539,-0.5477 -1.04112,-0.5477 -1.29276,0 -1.3717,1.92434 l -0.005,0.55756 q 0,1.05592 0.34539,1.62335 0.35033,0.56743 1.04112,0.56743 0.65625,0 1.01151,-0.55756 0.36019,-0.5625 0.36513,-1.60361 z" />
|
||||||
|
<path
|
||||||
|
d="m 76.993857,30.27299 -1.52466,7.18419 h -1.79112 l -0.96217,-4.09538 -0.94243,4.09538 h -1.79604 l -1.52467,-7.18419 h 1.7171 l 0.82401,4.49505 0.98684,-4.49505 h 1.47039 l 1.00658,4.50986 0.82401,-4.50986 z" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 4 KiB |
24
mastodon-follow-dark.svg
Normal file
24
mastodon-follow-dark.svg
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
version="1.1"
|
||||||
|
width="57.883163mm"
|
||||||
|
height="45.014904mm"
|
||||||
|
viewBox="0 0 57.883163 45.014904">
|
||||||
|
<rect
|
||||||
|
width="56.164337"
|
||||||
|
height="43.296078"
|
||||||
|
x="0.85941321"
|
||||||
|
y="0.85940945"
|
||||||
|
ry="6.0133438"
|
||||||
|
style="fill:#282c37;stroke:#1b1e25;stroke-width:1.71882558;" />
|
||||||
|
<path
|
||||||
|
d="m 36.173854,25.50177 c -0.412679,2.12307 -3.696111,4.44656 -7.467135,4.89685 -1.966427,0.23464 -3.902531,0.4503 -5.96706,0.3556 -3.376344,-0.15469 -6.040514,-0.80589 -6.040514,-0.80589 0,0.32868 0.02027,0.64164 0.06081,0.93432 0.438947,3.33208 3.304025,3.53169 6.017975,3.62476 2.739247,0.0937 5.178349,-0.67536 5.178349,-0.67536 l 0.112534,2.47639 c 0,0 -1.915997,1.02886 -5.329151,1.2181 -1.882107,0.10345 -4.219053,-0.0474 -6.940949,-0.7678 -5.903334,-1.5625 -6.918572,-7.85516 -7.073914,-14.24009 -0.04735,-1.89573 -0.01816,-3.6833 -0.01816,-5.17835 0,-6.52892 4.277753,-8.44265 4.277753,-8.44265 2.156956,-0.99058 5.858093,-1.40716 9.705815,-1.43862 h 0.09453 c 3.847723,0.0315 7.551293,0.44804 9.708087,1.43862 0,0 4.27759,1.91373 4.27759,8.44265 0,0 0.05367,4.81707 -0.59656,8.16147"
|
||||||
|
style="fill:#3088d4;" />
|
||||||
|
<path
|
||||||
|
d="m 31.724706,17.8468 v 7.90543 h -3.131981 v -7.67307 c 0,-1.61747 -0.680555,-2.43845 -2.041827,-2.43845 -1.505102,0 -2.259437,0.97389 -2.259437,2.89962 v 4.19991 h -3.113495 v -4.19991 c 0,-1.92573 -0.754497,-2.89962 -2.259599,-2.89962 -1.361272,0 -2.041827,0.82098 -2.041827,2.43845 v 7.67307 H 13.744559 V 17.8468 c 0,-1.61569 0.411381,-2.89962 1.237712,-3.84951 0.852113,-0.94989 1.968048,-1.43683 3.353319,-1.43683 1.602719,0 2.816432,0.61602 3.618925,1.84822 l 0.780117,1.30776 0.780279,-1.30776 c 0.802332,-1.2322 2.016046,-1.84822 3.618926,-1.84822 1.385109,0 2.501044,0.48694 3.353319,1.43683 0.826168,0.94989 1.23755,2.23382 1.23755,3.84951"
|
||||||
|
style="fill:#ffffff;" />
|
||||||
|
<path
|
||||||
|
d="m 43.314163,32.1437 c 1.49508,0 2.70606,-1.21095 2.70606,-2.70606 0,-1.4951 -1.21098,-2.70606 -2.70606,-2.70606 -1.495103,0 -2.706063,1.21096 -2.706063,2.70606 0,1.49511 1.21096,2.70606 2.706063,2.70606 z m -6.088655,-1.35302 v -2.02955 h -1.353051 v 2.02955 h -2.02955 v 1.35302 h 2.02955 v 2.02955 h 1.353051 V 32.1437 h 2.029552 v -1.35302 z m 6.088655,2.70607 c -1.806313,0 -5.412155,0.90652 -5.412155,2.70606 v 1.35304 h 10.824279 v -1.35304 c 0,-1.79954 -3.605834,-2.70606 -5.412124,-2.70606 z"
|
||||||
|
style="fill:#3088d4;" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
210
mastodon-follow-light-da.js
Normal file
210
mastodon-follow-light-da.js
Normal file
|
|
@ -0,0 +1,210 @@
|
||||||
|
/* SPDX-License-Identifier: Zlib
|
||||||
|
Copyright (C) 2022 smpl <smpl@slamkode.ml> */
|
||||||
|
|
||||||
|
var mastodon_follow_settings = {
|
||||||
|
"account": "superman@fortitude.fortress",
|
||||||
|
"portal": "https://fortitude.fortress/users/superman/remote_follow",
|
||||||
|
"dialog": {
|
||||||
|
"width": "256px",
|
||||||
|
"background": "#d9e1e8",
|
||||||
|
"color": "#282c37",
|
||||||
|
"title": "#282c37",
|
||||||
|
"input": {
|
||||||
|
"bordercolor": "#b3c3d1",
|
||||||
|
"background": "#f9fafb",
|
||||||
|
"color": "#000",
|
||||||
|
"placeholder": "#c83737"
|
||||||
|
},
|
||||||
|
"button": {
|
||||||
|
"background": "#2b90d9",
|
||||||
|
"color": "#fff"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
var mastodon_follow_strings =
|
||||||
|
{
|
||||||
|
"title": "Tast dit Mastodon id",
|
||||||
|
"button": "Følg",
|
||||||
|
"create": "Opret konto",
|
||||||
|
"create_url": "https://joinmastodon.org/communities",
|
||||||
|
"error": { "handle": "Forkert id" }
|
||||||
|
};
|
||||||
|
|
||||||
|
var mastodon_follow_container = null;
|
||||||
|
|
||||||
|
/* Remove nojs fallback link, when JS enabled. */
|
||||||
|
window.addEventListener("load", function(e) {
|
||||||
|
mastodonfollow.style.cursor = "pointer";
|
||||||
|
var a = mastodonfollow.parentNode;
|
||||||
|
var c = a.parentNode;
|
||||||
|
c.appendChild(mastodonfollow);
|
||||||
|
a.remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
function mastodon_follow_create_style()
|
||||||
|
{
|
||||||
|
var style = document.createElement('style');
|
||||||
|
var d = mastodon_follow_settings.dialog;
|
||||||
|
style.innerHTML =
|
||||||
|
".mastodon-follow-container {" +
|
||||||
|
"display: block;" +
|
||||||
|
"z-index: 1;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 5px;" +
|
||||||
|
"background: " + d.background + ";" +
|
||||||
|
"position: absolute;" +
|
||||||
|
"top:110%;" +
|
||||||
|
"left: 0;" +
|
||||||
|
"width: " + d.width + ";" +
|
||||||
|
'font-family: "Roboto",Roboto,sans-serif;' +
|
||||||
|
"margin: 0 auto;" +
|
||||||
|
"padding: 20px;" +
|
||||||
|
"font-weight: 400;" +
|
||||||
|
"font-size: 13px;" +
|
||||||
|
"color: " + d.color + ";" +
|
||||||
|
"line-height: 18px;" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-title {" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"margin: 0;" +
|
||||||
|
"color: " + d.title + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input {" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.input.background + ";" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.input.color + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input::placeholder {" +
|
||||||
|
"color: " + d.input.placeholder + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-button {" +
|
||||||
|
"display: block;" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-right: 10px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.button.background + ";" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.button.color + ";" +
|
||||||
|
"line-height: inherit;" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"text-transform: uppercase;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"cursor: pointer;" +
|
||||||
|
"}";
|
||||||
|
document.head.appendChild(style);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when request to instance is complete.
|
||||||
|
* Parse the JSON response and find the subscribe uri.
|
||||||
|
* On error goes to the instances remote_follow url. */
|
||||||
|
function mastodon_follow_go(event)
|
||||||
|
{
|
||||||
|
var data;
|
||||||
|
|
||||||
|
if (this.readyState === this.DONE) {
|
||||||
|
if (this.status === 200) {
|
||||||
|
try {
|
||||||
|
data = JSON.parse(this.responseText);
|
||||||
|
} catch {
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
data.links.forEach( function(e) {
|
||||||
|
if(e.rel === "http://ostatus.org/schema/1.0/subscribe") {
|
||||||
|
window.location = e.template.replace('{uri}', encodeURIComponent(mastodon_follow_settings.account));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when user click on follow button in dialog.
|
||||||
|
* Grab the mastodon handle from the input field and request the
|
||||||
|
* appropriate webfinger document from the users instance.
|
||||||
|
* Response is handled by mastodon_follow_go(). */
|
||||||
|
function mastodon_follow_lookup(event)
|
||||||
|
{
|
||||||
|
var handle_element = document.querySelector('input[name="mastodon-handle"]');
|
||||||
|
var handle = handle_element.value;
|
||||||
|
|
||||||
|
// remove any initial @
|
||||||
|
if(handle.charAt(0) == '@') {
|
||||||
|
handle = handle.substring(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
// split into nick and host
|
||||||
|
var uriparts = handle.split('@');
|
||||||
|
if(uriparts.length < 2) {
|
||||||
|
handle_element.value = '';
|
||||||
|
handle_element.setAttribute('placeholder', mastodon_follow_strings.error.handle);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var oReq = new XMLHttpRequest();
|
||||||
|
oReq.addEventListener("load", mastodon_follow_go);
|
||||||
|
oReq.open("GET", "https://" + uriparts[1] + "/.well-known/webfinger?resource=acct:" + encodeURIComponent(handle));
|
||||||
|
oReq.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Activated when icon is clicked.
|
||||||
|
* Create the follow dialog on first run, toggle visibility on further
|
||||||
|
* clicks. */
|
||||||
|
function mastodon_follow_show()
|
||||||
|
{
|
||||||
|
if(!mastodon_follow_container) {
|
||||||
|
mastodon_follow_create_style();
|
||||||
|
|
||||||
|
mastodon_follow_container = document.createElement('div');
|
||||||
|
mastodon_follow_container.setAttribute('class', 'mastodon-follow-container');
|
||||||
|
|
||||||
|
var mastodon_title = document.createElement('p');
|
||||||
|
mastodon_title.setAttribute('class', 'mastodon-follow-title');
|
||||||
|
mastodon_title.innerHTML = mastodon_follow_strings.title;
|
||||||
|
|
||||||
|
var mastodon_follow_handle = document.createElement('input');
|
||||||
|
mastodon_follow_handle.setAttribute('name', 'mastodon-handle');
|
||||||
|
mastodon_follow_handle.setAttribute('type', 'text');
|
||||||
|
mastodon_follow_handle.setAttribute('class', 'mastodon-follow-input');
|
||||||
|
|
||||||
|
var mastodon_follow_follow = document.createElement('button');
|
||||||
|
mastodon_follow_follow.innerHTML = mastodon_follow_strings.button;
|
||||||
|
mastodon_follow_follow.setAttribute('class', 'mastodon-follow-button');
|
||||||
|
mastodon_follow_follow.addEventListener('click', mastodon_follow_lookup);
|
||||||
|
|
||||||
|
var createaccount = document.createElement('div');
|
||||||
|
createaccount.style = "text-align: right;";
|
||||||
|
var createaccount_a = document.createElement('a');
|
||||||
|
createaccount_a.setAttribute('href', mastodon_follow_strings.create_url);
|
||||||
|
createaccount_a.innerHTML = mastodon_follow_strings.create;
|
||||||
|
createaccount.appendChild(createaccount_a);
|
||||||
|
|
||||||
|
mastodon_follow_container.appendChild(mastodon_title);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_handle);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_follow);
|
||||||
|
mastodon_follow_container.appendChild(createaccount);
|
||||||
|
|
||||||
|
mastodonfollow.parentElement.appendChild(mastodon_follow_container);
|
||||||
|
} else {
|
||||||
|
mastodon_follow_container.style.display =
|
||||||
|
mastodon_follow_container.style.display == "none" ? "block" : "none";
|
||||||
|
}
|
||||||
|
}
|
||||||
33
mastodon-follow-light-da.svg
Normal file
33
mastodon-follow-light-da.svg
Normal file
|
|
@ -0,0 +1,33 @@
|
||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
version="1.1"
|
||||||
|
height="45.014904mm"
|
||||||
|
width="85.691597mm"
|
||||||
|
viewBox="0 0 85.691597 45.014904">
|
||||||
|
<rect
|
||||||
|
ry="5.9620543"
|
||||||
|
y="1.0440584"
|
||||||
|
x="1.0440561"
|
||||||
|
height="42.926792"
|
||||||
|
width="83.603485"
|
||||||
|
style="fill:#d9e1e8;stroke:#d1d1d1;stroke-width:2.08811116;" />
|
||||||
|
<path
|
||||||
|
d="m 36.173854,25.50178 c -0.412679,2.12307 -3.696111,4.44656 -7.467135,4.89685 -1.966427,0.23464 -3.902531,0.4503 -5.96706,0.3556 -3.376344,-0.15469 -6.040514,-0.80589 -6.040514,-0.80589 0,0.32868 0.02027,0.64164 0.06081,0.93432 0.438947,3.33208 3.304025,3.53169 6.017975,3.62476 2.739247,0.0937 5.178349,-0.67536 5.178349,-0.67536 l 0.112534,2.47639 c 0,0 -1.915997,1.02886 -5.329151,1.2181 -1.882107,0.10345 -4.219053,-0.0474 -6.940949,-0.7678 -5.903334,-1.5625 -6.918572,-7.85516 -7.073914,-14.24009 -0.04735,-1.89573 -0.01816,-3.6833 -0.01816,-5.17835 0,-6.52892 4.277753,-8.44265 4.277753,-8.44265 2.156956,-0.99058 5.858093,-1.40716 9.705815,-1.43862 h 0.09453 c 3.847723,0.0315 7.551293,0.44804 9.708087,1.43862 0,0 4.27759,1.91373 4.27759,8.44265 0,0 0.05367,4.81707 -0.59656,8.16147"
|
||||||
|
style="fill:#3088d4;" />
|
||||||
|
<path
|
||||||
|
d="m 31.724706,17.84681 v 7.90543 h -3.131981 v -7.67307 c 0,-1.61747 -0.680555,-2.43845 -2.041827,-2.43845 -1.505102,0 -2.259437,0.97389 -2.259437,2.89962 v 4.19991 h -3.113495 v -4.19991 c 0,-1.92573 -0.754497,-2.89962 -2.259599,-2.89962 -1.361272,0 -2.041827,0.82098 -2.041827,2.43845 v 7.67307 h -3.131981 v -7.90543 c 0,-1.61569 0.411381,-2.89962 1.237712,-3.84951 0.852113,-0.94989 1.968048,-1.43683 3.353319,-1.43683 1.602719,0 2.816432,0.61602 3.618925,1.84822 l 0.780117,1.30776 0.780279,-1.30776 c 0.802332,-1.2322 2.016046,-1.84822 3.618926,-1.84822 1.385109,0 2.501044,0.48694 3.353319,1.43683 0.826168,0.94989 1.23755,2.23382 1.23755,3.84951"
|
||||||
|
style="fill:#ffffff;" />
|
||||||
|
<g style="fill:#3088d4;">
|
||||||
|
<path
|
||||||
|
d="m 69.506087,14.94682 c 2.06847,0 3.74388,-1.67538 3.74388,-3.74388 0,-2.06851 -1.67541,-3.74389 -3.74388,-3.74389 -2.0685,0 -3.74388,1.67538 -3.74388,3.74389 0,2.0685 1.67538,3.74388 3.74388,3.74388 z m -8.42376,-1.87193 v -2.80792 h -1.87197 v 2.80792 h -2.80792 v 1.87193 h 2.80792 v 2.80792 h 1.87197 v -2.80792 h 2.80792 v -1.87193 z m 8.42376,3.74389 c -2.49906,0 -7.48781,1.2542 -7.48781,3.74389 v 1.87196 h 14.97558 v -1.87196 c 0,-2.48969 -4.98874,-3.74389 -7.48777,-3.74389 z" />
|
||||||
|
<path
|
||||||
|
d="M 40.703998,36.83326 V 25.75843 h 7.408579 v 2.06132 h -4.738753 v 2.54812 h 4.305193 v 2.05371 h -4.305193 v 4.41168 z" />
|
||||||
|
<path
|
||||||
|
d="m 53.847757,36.98539 q -1.22462,0 -2.22105,-0.49441 l -0.60851,1.06488 h -1.58212 l 1.0725,-1.86355 q -1.51367,-1.51366 -1.51367,-4.23673 v -0.38032 q 0,-2.54052 1.34633,-4.00094 1.35393,-1.46802 3.49131,-1.46802 1.2018,0 2.19063,0.48681 l 0.46398,-0.80628 h 1.57452 l -0.92037,1.59734 q 1.54408,1.51366 1.54408,4.26715 v 0.37271 q 0,2.54052 -1.36153,4.00094 -1.35393,1.46042 -3.4761,1.46042 z m -2.13738,-5.46136 q 0,1.00404 0.20537,1.71904 l 2.9969,-5.21795 q -0.45638,-0.32708 -1.0801,-0.32708 -1.99286,0 -2.11456,2.96648 z m 4.25955,-0.46398 q 0,-1.01925 -0.22058,-1.74946 l -3.01211,5.25598 q 0.45638,0.33468 1.11052,0.33468 1.01165,0 1.5593,-0.85952 0.55527,-0.86712 0.56287,-2.47206 z" />
|
||||||
|
<path
|
||||||
|
d="m 67.280557,34.77955 v 2.05371 h -7.3173 V 25.75843 h 2.66983 v 9.02112 z" />
|
||||||
|
<path
|
||||||
|
d="m 76.993857,30.91553 v 4.54859 q -0.42595,0.47159 -1.52127,0.99643 -1.09531,0.52484 -2.8828,0.52484 -2.20584,0 -3.54456,-1.39196 -1.33111,-1.39957 -1.33111,-3.98572 v -0.61612 q 0,-2.58616 1.33111,-3.98572 1.33111,-1.40718 3.40004,-1.40718 2.28951,0 3.33158,1.05729 1.04207,1.05728 1.20941,2.71546 h -2.56334 q -0.1217,-0.82148 -0.54005,-1.27026 -0.41835,-0.44877 -1.34632,-0.44877 -0.9584,0 -1.52888,0.81387 -0.57047,0.81388 -0.57808,2.46446 v 0.67697 q 0,1.66578 0.58569,2.49488 0.59329,0.82909 1.76467,0.82909 1.03446,0 1.54409,-0.46399 v -1.71903 h -1.85595 v -1.83313 z" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.8 KiB |
210
mastodon-follow-light-en.js
Normal file
210
mastodon-follow-light-en.js
Normal file
|
|
@ -0,0 +1,210 @@
|
||||||
|
/* SPDX-License-Identifier: Zlib
|
||||||
|
Copyright (C) 2022 smpl <smpl@slamkode.ml> */
|
||||||
|
|
||||||
|
var mastodon_follow_settings = {
|
||||||
|
"account": "superman@fortitude.fortress",
|
||||||
|
"portal": "https://fortitude.fortress/users/superman/remote_follow",
|
||||||
|
"dialog": {
|
||||||
|
"width": "256px",
|
||||||
|
"background": "#d9e1e8",
|
||||||
|
"color": "#282c37",
|
||||||
|
"title": "#282c37",
|
||||||
|
"input": {
|
||||||
|
"bordercolor": "#b3c3d1",
|
||||||
|
"background": "#f9fafb",
|
||||||
|
"color": "#000",
|
||||||
|
"placeholder": "#c83737"
|
||||||
|
},
|
||||||
|
"button": {
|
||||||
|
"background": "#2b90d9",
|
||||||
|
"color": "#fff"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
var mastodon_follow_strings =
|
||||||
|
{
|
||||||
|
"title": "Enter your Mastodon handle",
|
||||||
|
"button": "Follow",
|
||||||
|
"create": "Create account",
|
||||||
|
"create_url": "https://joinmastodon.org/communities",
|
||||||
|
"error": { "handle": "Invalid handle" }
|
||||||
|
};
|
||||||
|
|
||||||
|
var mastodon_follow_container = null;
|
||||||
|
|
||||||
|
/* Remove nojs fallback link, when JS enabled. */
|
||||||
|
window.addEventListener("load", function(e) {
|
||||||
|
mastodonfollow.style.cursor = "pointer";
|
||||||
|
var a = mastodonfollow.parentNode;
|
||||||
|
var c = a.parentNode;
|
||||||
|
c.appendChild(mastodonfollow);
|
||||||
|
a.remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
function mastodon_follow_create_style()
|
||||||
|
{
|
||||||
|
var style = document.createElement('style');
|
||||||
|
var d = mastodon_follow_settings.dialog;
|
||||||
|
style.innerHTML =
|
||||||
|
".mastodon-follow-container {" +
|
||||||
|
"display: block;" +
|
||||||
|
"z-index: 1;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 5px;" +
|
||||||
|
"background: " + d.background + ";" +
|
||||||
|
"position: absolute;" +
|
||||||
|
"top:110%;" +
|
||||||
|
"left: 0;" +
|
||||||
|
"width: " + d.width + ";" +
|
||||||
|
'font-family: "Roboto",Roboto,sans-serif;' +
|
||||||
|
"margin: 0 auto;" +
|
||||||
|
"padding: 20px;" +
|
||||||
|
"font-weight: 400;" +
|
||||||
|
"font-size: 13px;" +
|
||||||
|
"color: " + d.color + ";" +
|
||||||
|
"line-height: 18px;" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-title {" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"margin: 0;" +
|
||||||
|
"color: " + d.title + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input {" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.input.background + ";" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.input.color + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input::placeholder {" +
|
||||||
|
"color: " + d.input.placeholder + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-button {" +
|
||||||
|
"display: block;" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-right: 10px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.button.background + ";" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.button.color + ";" +
|
||||||
|
"line-height: inherit;" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"text-transform: uppercase;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"cursor: pointer;" +
|
||||||
|
"}";
|
||||||
|
document.head.appendChild(style);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when request to instance is complete.
|
||||||
|
* Parse the JSON response and find the subscribe uri.
|
||||||
|
* On error goes to the instances remote_follow url. */
|
||||||
|
function mastodon_follow_go(event)
|
||||||
|
{
|
||||||
|
var data;
|
||||||
|
|
||||||
|
if (this.readyState === this.DONE) {
|
||||||
|
if (this.status === 200) {
|
||||||
|
try {
|
||||||
|
data = JSON.parse(this.responseText);
|
||||||
|
} catch {
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
data.links.forEach( function(e) {
|
||||||
|
if(e.rel === "http://ostatus.org/schema/1.0/subscribe") {
|
||||||
|
window.location = e.template.replace('{uri}', encodeURIComponent(mastodon_follow_settings.account));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when user click on follow button in dialog.
|
||||||
|
* Grab the mastodon handle from the input field and request the
|
||||||
|
* appropriate webfinger document from the users instance.
|
||||||
|
* Response is handled by mastodon_follow_go(). */
|
||||||
|
function mastodon_follow_lookup(event)
|
||||||
|
{
|
||||||
|
var handle_element = document.querySelector('input[name="mastodon-handle"]');
|
||||||
|
var handle = handle_element.value;
|
||||||
|
|
||||||
|
// remove any initial @
|
||||||
|
if(handle.charAt(0) == '@') {
|
||||||
|
handle = handle.substring(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
// split into nick and host
|
||||||
|
var uriparts = handle.split('@');
|
||||||
|
if(uriparts.length < 2) {
|
||||||
|
handle_element.value = '';
|
||||||
|
handle_element.setAttribute('placeholder', mastodon_follow_strings.error.handle);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var oReq = new XMLHttpRequest();
|
||||||
|
oReq.addEventListener("load", mastodon_follow_go);
|
||||||
|
oReq.open("GET", "https://" + uriparts[1] + "/.well-known/webfinger?resource=acct:" + encodeURIComponent(handle));
|
||||||
|
oReq.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Activated when icon is clicked.
|
||||||
|
* Create the follow dialog on first run, toggle visibility on further
|
||||||
|
* clicks. */
|
||||||
|
function mastodon_follow_show()
|
||||||
|
{
|
||||||
|
if(!mastodon_follow_container) {
|
||||||
|
mastodon_follow_create_style();
|
||||||
|
|
||||||
|
mastodon_follow_container = document.createElement('div');
|
||||||
|
mastodon_follow_container.setAttribute('class', 'mastodon-follow-container');
|
||||||
|
|
||||||
|
var mastodon_title = document.createElement('p');
|
||||||
|
mastodon_title.setAttribute('class', 'mastodon-follow-title');
|
||||||
|
mastodon_title.innerHTML = mastodon_follow_strings.title;
|
||||||
|
|
||||||
|
var mastodon_follow_handle = document.createElement('input');
|
||||||
|
mastodon_follow_handle.setAttribute('name', 'mastodon-handle');
|
||||||
|
mastodon_follow_handle.setAttribute('type', 'text');
|
||||||
|
mastodon_follow_handle.setAttribute('class', 'mastodon-follow-input');
|
||||||
|
|
||||||
|
var mastodon_follow_follow = document.createElement('button');
|
||||||
|
mastodon_follow_follow.innerHTML = mastodon_follow_strings.button;
|
||||||
|
mastodon_follow_follow.setAttribute('class', 'mastodon-follow-button');
|
||||||
|
mastodon_follow_follow.addEventListener('click', mastodon_follow_lookup);
|
||||||
|
|
||||||
|
var createaccount = document.createElement('div');
|
||||||
|
createaccount.style = "text-align: right;";
|
||||||
|
var createaccount_a = document.createElement('a');
|
||||||
|
createaccount_a.setAttribute('href', mastodon_follow_strings.create_url);
|
||||||
|
createaccount_a.innerHTML = mastodon_follow_strings.create;
|
||||||
|
createaccount.appendChild(createaccount_a);
|
||||||
|
|
||||||
|
mastodon_follow_container.appendChild(mastodon_title);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_handle);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_follow);
|
||||||
|
mastodon_follow_container.appendChild(createaccount);
|
||||||
|
|
||||||
|
mastodonfollow.parentElement.appendChild(mastodon_follow_container);
|
||||||
|
} else {
|
||||||
|
mastodon_follow_container.style.display =
|
||||||
|
mastodon_follow_container.style.display == "none" ? "block" : "none";
|
||||||
|
}
|
||||||
|
}
|
||||||
37
mastodon-follow-light-en.svg
Normal file
37
mastodon-follow-light-en.svg
Normal file
|
|
@ -0,0 +1,37 @@
|
||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
version="1.1"
|
||||||
|
viewBox="0 0 85.691597 45.014904"
|
||||||
|
height="45.014904mm"
|
||||||
|
width="85.691597mm">
|
||||||
|
<rect
|
||||||
|
ry="5.9620543"
|
||||||
|
y="1.0440584"
|
||||||
|
x="1.0440561"
|
||||||
|
height="42.926792"
|
||||||
|
width="83.603485"
|
||||||
|
style="fill:#d9e1e8;stroke:#c6d2dc;stroke-width:2.08811116;" />
|
||||||
|
<path
|
||||||
|
d="m 36.173854,25.50178 c -0.412679,2.12307 -3.696111,4.44656 -7.467135,4.89685 -1.966427,0.23464 -3.902531,0.4503 -5.96706,0.3556 -3.376344,-0.15469 -6.040514,-0.80589 -6.040514,-0.80589 0,0.32868 0.02027,0.64164 0.06081,0.93432 0.438947,3.33208 3.304025,3.53169 6.017975,3.62476 2.739247,0.0937 5.178349,-0.67536 5.178349,-0.67536 l 0.112534,2.47639 c 0,0 -1.915997,1.02886 -5.329151,1.2181 -1.882107,0.10345 -4.219053,-0.0474 -6.940949,-0.7678 -5.903334,-1.5625 -6.918572,-7.85516 -7.073914,-14.24009 -0.04735,-1.89573 -0.01816,-3.6833 -0.01816,-5.17835 0,-6.52892 4.277753,-8.44265 4.277753,-8.44265 2.156956,-0.99058 5.858093,-1.40716 9.705815,-1.43862 h 0.09453 c 3.847723,0.0315 7.551293,0.44804 9.708087,1.43862 0,0 4.27759,1.91373 4.27759,8.44265 0,0 0.05367,4.81707 -0.59656,8.16147"
|
||||||
|
style="fill:#3088d4;" />
|
||||||
|
<path
|
||||||
|
d="m 31.724706,17.84681 v 7.90543 h -3.131981 v -7.67307 c 0,-1.61747 -0.680555,-2.43845 -2.041827,-2.43845 -1.505102,0 -2.259437,0.97389 -2.259437,2.89962 v 4.19991 h -3.113495 v -4.19991 c 0,-1.92573 -0.754497,-2.89962 -2.259599,-2.89962 -1.361272,0 -2.041827,0.82098 -2.041827,2.43845 v 7.67307 h -3.131981 v -7.90543 c 0,-1.61569 0.411381,-2.89962 1.237712,-3.84951 0.852113,-0.94989 1.968048,-1.43683 3.353319,-1.43683 1.602719,0 2.816432,0.61602 3.618925,1.84822 l 0.780117,1.30776 0.780279,-1.30776 c 0.802332,-1.2322 2.016046,-1.84822 3.618926,-1.84822 1.385109,0 2.501044,0.48694 3.353319,1.43683 0.826168,0.94989 1.23755,2.23382 1.23755,3.84951"
|
||||||
|
style="fill:#ffffff;" />
|
||||||
|
<g style="fill:#3088d4;">
|
||||||
|
<path
|
||||||
|
d="m 69.506087,14.94682 c 2.06847,0 3.74388,-1.67538 3.74388,-3.74388 0,-2.06851 -1.67541,-3.74389 -3.74388,-3.74389 -2.0685,0 -3.74388,1.67538 -3.74388,3.74389 0,2.0685 1.67538,3.74388 3.74388,3.74388 z m -8.42376,-1.87193 v -2.80792 h -1.87197 v 2.80792 h -2.80792 v 1.87193 h 2.80792 v 2.80792 h 1.87197 v -2.80792 h 2.80792 v -1.87193 z m 8.42376,3.74389 c -2.49906,0 -7.48781,1.2542 -7.48781,3.74389 v 1.87196 h 14.97558 v -1.87196 c 0,-2.48969 -4.98874,-3.74389 -7.48777,-3.74389 z" />
|
||||||
|
<path
|
||||||
|
d="m 38.77358,37.45718 v -7.18419 h 4.805906 v 1.33717 h -3.074004 v 1.65295 h 2.792754 v 1.33224 h -2.792754 v 2.86183 z" />
|
||||||
|
<path
|
||||||
|
d="m 50.378807,34.01311 q 0,1.64802 -0.87829,2.59539 -0.87828,0.94736 -2.25492,0.94736 -1.386512,0 -2.269734,-0.94736 -0.878287,-0.94737 -0.878287,-2.59539 v -0.29112 q 0,-1.64802 0.873353,-2.59538 0.878287,-0.9523 2.264798,-0.9523 1.37664,0 2.25986,0.9523 0.88322,0.94736 0.88322,2.59538 z m -1.75657,-0.30098 q 0,-1.08553 -0.3454,-1.63322 -0.34539,-0.5477 -1.04111,-0.5477 -1.292761,0 -1.371708,1.92434 l -0.0049,0.55756 q 0,1.05592 0.345398,1.62335 0.35032,0.56743 1.04111,0.56743 0.65625,0 1.01151,-0.55756 0.3602,-0.5625 0.36513,-1.60361 z" />
|
||||||
|
<path
|
||||||
|
d="m 56.013657,36.12495 v 1.33223 h -4.74669 v -7.18419 h 1.7319 v 5.85196 z" />
|
||||||
|
<path
|
||||||
|
d="m 61.500487,36.12495 v 1.33223 h -4.7467 v -7.18419 h 1.7319 v 5.85196 z" />
|
||||||
|
<path
|
||||||
|
d="m 68.003757,34.01311 q 0,1.64802 -0.87829,2.59539 -0.87829,0.94736 -2.25493,0.94736 -1.38651,0 -2.26973,-0.94736 -0.87828,-0.94737 -0.87828,-2.59539 v -0.29112 q 0,-1.64802 0.87335,-2.59538 0.87828,-0.9523 2.26479,-0.9523 1.37664,0 2.25987,0.9523 0.88322,0.94736 0.88322,2.59538 z m -1.75658,-0.30098 q 0,-1.08553 -0.34539,-1.63322 -0.34539,-0.5477 -1.04112,-0.5477 -1.29276,0 -1.3717,1.92434 l -0.005,0.55756 q 0,1.05592 0.34539,1.62335 0.35033,0.56743 1.04112,0.56743 0.65625,0 1.01151,-0.55756 0.36019,-0.5625 0.36513,-1.60361 z" />
|
||||||
|
<path
|
||||||
|
d="m 76.993857,30.27299 -1.52466,7.18419 h -1.79112 l -0.96217,-4.09538 -0.94243,4.09538 h -1.79604 l -1.52467,-7.18419 h 1.7171 l 0.82401,4.49505 0.98684,-4.49505 h 1.47039 l 1.00658,4.50986 0.82401,-4.50986 z" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 4 KiB |
24
mastodon-follow-light.svg
Normal file
24
mastodon-follow-light.svg
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
version="1.1"
|
||||||
|
width="57.883163mm"
|
||||||
|
height="45.014904mm"
|
||||||
|
viewBox="0 0 57.883163 45.014904">
|
||||||
|
<rect
|
||||||
|
width="56.164337"
|
||||||
|
height="43.296078"
|
||||||
|
x="0.85941321"
|
||||||
|
y="0.85940945"
|
||||||
|
ry="6.0133438"
|
||||||
|
style="fill:#d9e1e8;stroke:#c6d2dc;stroke-width:1.71882558;" />
|
||||||
|
<path
|
||||||
|
d="m 36.173854,25.50177 c -0.412679,2.12307 -3.696111,4.44656 -7.467135,4.89685 -1.966427,0.23464 -3.902531,0.4503 -5.96706,0.3556 -3.376344,-0.15469 -6.040514,-0.80589 -6.040514,-0.80589 0,0.32868 0.02027,0.64164 0.06081,0.93432 0.438947,3.33208 3.304025,3.53169 6.017975,3.62476 2.739247,0.0937 5.178349,-0.67536 5.178349,-0.67536 l 0.112534,2.47639 c 0,0 -1.915997,1.02886 -5.329151,1.2181 -1.882107,0.10345 -4.219053,-0.0474 -6.940949,-0.7678 -5.903334,-1.5625 -6.918572,-7.85516 -7.073914,-14.24009 -0.04735,-1.89573 -0.01816,-3.6833 -0.01816,-5.17835 0,-6.52892 4.277753,-8.44265 4.277753,-8.44265 2.156956,-0.99058 5.858093,-1.40716 9.705815,-1.43862 h 0.09453 c 3.847723,0.0315 7.551293,0.44804 9.708087,1.43862 0,0 4.27759,1.91373 4.27759,8.44265 0,0 0.05367,4.81707 -0.59656,8.16147"
|
||||||
|
style="fill:#3088d4;" />
|
||||||
|
<path
|
||||||
|
d="m 31.724706,17.8468 v 7.90543 h -3.131981 v -7.67307 c 0,-1.61747 -0.680555,-2.43845 -2.041827,-2.43845 -1.505102,0 -2.259437,0.97389 -2.259437,2.89962 v 4.19991 h -3.113495 v -4.19991 c 0,-1.92573 -0.754497,-2.89962 -2.259599,-2.89962 -1.361272,0 -2.041827,0.82098 -2.041827,2.43845 v 7.67307 H 13.744559 V 17.8468 c 0,-1.61569 0.411381,-2.89962 1.237712,-3.84951 0.852113,-0.94989 1.968048,-1.43683 3.353319,-1.43683 1.602719,0 2.816432,0.61602 3.618925,1.84822 l 0.780117,1.30776 0.780279,-1.30776 c 0.802332,-1.2322 2.016046,-1.84822 3.618926,-1.84822 1.385109,0 2.501044,0.48694 3.353319,1.43683 0.826168,0.94989 1.23755,2.23382 1.23755,3.84951"
|
||||||
|
style="fill:#ffffff;" />
|
||||||
|
<path
|
||||||
|
d="m 43.314163,32.1437 c 1.49508,0 2.70606,-1.21095 2.70606,-2.70606 0,-1.4951 -1.21098,-2.70606 -2.70606,-2.70606 -1.495103,0 -2.706063,1.21096 -2.706063,2.70606 0,1.49511 1.21096,2.70606 2.706063,2.70606 z m -6.088655,-1.35302 v -2.02955 h -1.353051 v 2.02955 h -2.02955 v 1.35302 h 2.02955 v 2.02955 h 1.353051 V 32.1437 h 2.029552 v -1.35302 z m 6.088655,2.70607 c -1.806313,0 -5.412155,0.90652 -5.412155,2.70606 v 1.35304 h 10.824279 v -1.35304 c 0,-1.79954 -3.605834,-2.70606 -5.412124,-2.70606 z"
|
||||||
|
style="fill:#3088d4;" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
242
mastodon-follow.js
Normal file
242
mastodon-follow.js
Normal file
|
|
@ -0,0 +1,242 @@
|
||||||
|
/* SPDX-License-Identifier: Zlib
|
||||||
|
Copyright (C) 2022 smpl <smpl@slamkode.ml> */
|
||||||
|
|
||||||
|
///* Light theme matching mastodon-follow-light.svg
|
||||||
|
var mastodon_follow_settings = {
|
||||||
|
"account": "superman@fortitude.fortress",
|
||||||
|
"portal": "https://fortitude.fortress/users/superman/remote_follow",
|
||||||
|
"dialog": {
|
||||||
|
"width": "256px",
|
||||||
|
"background": "#d9e1e8",
|
||||||
|
"color": "#282c37",
|
||||||
|
"title": "#282c37",
|
||||||
|
"input": {
|
||||||
|
"bordercolor": "#b3c3d1",
|
||||||
|
"background": "#f9fafb",
|
||||||
|
"color": "#000",
|
||||||
|
"placeholder": "#c83737"
|
||||||
|
},
|
||||||
|
"button": {
|
||||||
|
"background": "#2b90d9",
|
||||||
|
"color": "#fff"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};//*/
|
||||||
|
///*
|
||||||
|
var mastodon_follow_strings =
|
||||||
|
{
|
||||||
|
"title": "Enter your Mastodon handle",
|
||||||
|
"button": "Follow",
|
||||||
|
"create": "Create account",
|
||||||
|
"create_url": "https://joinmastodon.org/communities",
|
||||||
|
"error": { "handle": "Invalid handle" }
|
||||||
|
};//*/
|
||||||
|
/* Dark theme matching mastodon-follow-dark.svg
|
||||||
|
var mastodon_follow_settings = {
|
||||||
|
"account": "superman@fortitude.fortress",
|
||||||
|
"portal": "https://fortitude.fortress/users/superman/remote_follow",
|
||||||
|
"dialog": {
|
||||||
|
"width": "256px",
|
||||||
|
"background": "#282c37",
|
||||||
|
"color": "#9baec8",
|
||||||
|
"title": "#fff",
|
||||||
|
"input": {
|
||||||
|
"bordercolor": "#0a0b0e",
|
||||||
|
"background": "#131419",
|
||||||
|
"color": "#fff",
|
||||||
|
"placeholder": "#c83737"
|
||||||
|
},
|
||||||
|
"button": {
|
||||||
|
"background": "#2b90d9",
|
||||||
|
"color": "#fff"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};//*/
|
||||||
|
/*
|
||||||
|
var mastodon_follow_strings =
|
||||||
|
{
|
||||||
|
"title": "Tast dit Mastodon id",
|
||||||
|
"button": "Følg",
|
||||||
|
"create": "Opret konto",
|
||||||
|
"create_url": "https://joinmastodon.org/communities",
|
||||||
|
"error": { "handle": "Forkert id" }
|
||||||
|
};//*/
|
||||||
|
|
||||||
|
var mastodon_follow_container = null;
|
||||||
|
|
||||||
|
/* Remove nojs fallback link, when JS enabled. */
|
||||||
|
window.addEventListener("load", function(e) {
|
||||||
|
mastodonfollow.style.cursor = "pointer";
|
||||||
|
var a = mastodonfollow.parentNode;
|
||||||
|
var c = a.parentNode;
|
||||||
|
c.appendChild(mastodonfollow);
|
||||||
|
a.remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
function mastodon_follow_create_style()
|
||||||
|
{
|
||||||
|
var style = document.createElement('style');
|
||||||
|
var d = mastodon_follow_settings.dialog;
|
||||||
|
style.innerHTML =
|
||||||
|
".mastodon-follow-container {" +
|
||||||
|
"display: block;" +
|
||||||
|
"z-index: 1;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 5px;" +
|
||||||
|
"background: " + d.background + ";" +
|
||||||
|
"position: absolute;" +
|
||||||
|
"top:110%;" +
|
||||||
|
"left: 0;" +
|
||||||
|
"width: " + d.width + ";" +
|
||||||
|
'font-family: "Roboto",Roboto,sans-serif;' +
|
||||||
|
"margin: 0 auto;" +
|
||||||
|
"padding: 20px;" +
|
||||||
|
"font-weight: 400;" +
|
||||||
|
"font-size: 13px;" +
|
||||||
|
"color: " + d.color + ";" +
|
||||||
|
"line-height: 18px;" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-title {" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"margin: 0;" +
|
||||||
|
"color: " + d.title + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input {" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.input.background + ";" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.input.color + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-input::placeholder {" +
|
||||||
|
"color: " + d.input.placeholder + ";" +
|
||||||
|
"}" +
|
||||||
|
".mastodon-follow-button {" +
|
||||||
|
"display: block;" +
|
||||||
|
"width: 100%;" +
|
||||||
|
"border: 0;" +
|
||||||
|
"border-radius: 4px;" +
|
||||||
|
"margin-right: 10px;" +
|
||||||
|
"margin-top: 20px;" +
|
||||||
|
"padding: 10px;" +
|
||||||
|
"background: " + d.button.background + ";" +
|
||||||
|
"font-family: inherit;" +
|
||||||
|
"font-weight: 500;" +
|
||||||
|
"font-size: 18px;" +
|
||||||
|
"color: " + d.button.color + ";" +
|
||||||
|
"line-height: inherit;" +
|
||||||
|
"text-align: center;" +
|
||||||
|
"text-transform: uppercase;" +
|
||||||
|
"box-sizing: border-box;" +
|
||||||
|
"cursor: pointer;" +
|
||||||
|
"}";
|
||||||
|
document.head.appendChild(style);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when request to instance is complete.
|
||||||
|
* Parse the JSON response and find the subscribe uri.
|
||||||
|
* On error goes to the instances remote_follow url. */
|
||||||
|
function mastodon_follow_go(event)
|
||||||
|
{
|
||||||
|
var data;
|
||||||
|
|
||||||
|
if (this.readyState === this.DONE) {
|
||||||
|
if (this.status === 200) {
|
||||||
|
try {
|
||||||
|
data = JSON.parse(this.responseText);
|
||||||
|
} catch {
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
data.links.forEach( function(e) {
|
||||||
|
if(e.rel === "http://ostatus.org/schema/1.0/subscribe") {
|
||||||
|
window.location = e.template.replace('{uri}', encodeURIComponent(mastodon_follow_settings.account));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.location = mastodon_follow_settings.portal;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Called when user click on follow button in dialog.
|
||||||
|
* Grab the mastodon handle from the input field and request the
|
||||||
|
* appropriate webfinger document from the users instance.
|
||||||
|
* Response is handled by mastodon_follow_go(). */
|
||||||
|
function mastodon_follow_lookup(event)
|
||||||
|
{
|
||||||
|
var handle_element = document.querySelector('input[name="mastodon-handle"]');
|
||||||
|
var handle = handle_element.value;
|
||||||
|
|
||||||
|
// remove any initial @
|
||||||
|
if(handle.charAt(0) == '@') {
|
||||||
|
handle = handle.substring(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
// split into nick and host
|
||||||
|
var uriparts = handle.split('@');
|
||||||
|
if(uriparts.length < 2) {
|
||||||
|
handle_element.value = '';
|
||||||
|
handle_element.setAttribute('placeholder', mastodon_follow_strings.error.handle);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var oReq = new XMLHttpRequest();
|
||||||
|
oReq.addEventListener("load", mastodon_follow_go);
|
||||||
|
oReq.open("GET", "https://" + uriparts[1] + "/.well-known/webfinger?resource=acct:" + encodeURIComponent(handle));
|
||||||
|
oReq.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Activated when icon is clicked.
|
||||||
|
* Create the follow dialog on first run, toggle visibility on further
|
||||||
|
* clicks. */
|
||||||
|
function mastodon_follow_show()
|
||||||
|
{
|
||||||
|
if(!mastodon_follow_container) {
|
||||||
|
mastodon_follow_create_style();
|
||||||
|
|
||||||
|
mastodon_follow_container = document.createElement('div');
|
||||||
|
mastodon_follow_container.setAttribute('class', 'mastodon-follow-container');
|
||||||
|
|
||||||
|
var mastodon_title = document.createElement('p');
|
||||||
|
mastodon_title.setAttribute('class', 'mastodon-follow-title');
|
||||||
|
mastodon_title.innerHTML = mastodon_follow_strings.title;
|
||||||
|
|
||||||
|
var mastodon_follow_handle = document.createElement('input');
|
||||||
|
mastodon_follow_handle.setAttribute('name', 'mastodon-handle');
|
||||||
|
mastodon_follow_handle.setAttribute('type', 'text');
|
||||||
|
mastodon_follow_handle.setAttribute('class', 'mastodon-follow-input');
|
||||||
|
|
||||||
|
var mastodon_follow_follow = document.createElement('button');
|
||||||
|
mastodon_follow_follow.innerHTML = mastodon_follow_strings.button;
|
||||||
|
mastodon_follow_follow.setAttribute('class', 'mastodon-follow-button');
|
||||||
|
mastodon_follow_follow.addEventListener('click', mastodon_follow_lookup);
|
||||||
|
|
||||||
|
var createaccount = document.createElement('div');
|
||||||
|
createaccount.style = "text-align: right;";
|
||||||
|
var createaccount_a = document.createElement('a');
|
||||||
|
createaccount_a.setAttribute('href', mastodon_follow_strings.create_url);
|
||||||
|
createaccount_a.innerHTML = mastodon_follow_strings.create;
|
||||||
|
createaccount.appendChild(createaccount_a);
|
||||||
|
|
||||||
|
mastodon_follow_container.appendChild(mastodon_title);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_handle);
|
||||||
|
mastodon_follow_container.appendChild(mastodon_follow_follow);
|
||||||
|
mastodon_follow_container.appendChild(createaccount);
|
||||||
|
|
||||||
|
mastodonfollow.parentElement.appendChild(mastodon_follow_container);
|
||||||
|
} else {
|
||||||
|
mastodon_follow_container.style.display =
|
||||||
|
mastodon_follow_container.style.display == "none" ? "block" : "none";
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in a new issue