Unverified Commit 9e9e459e authored by Jean M's avatar Jean M
Browse files

init

parent e7dd9018
body { font-family: Ubuntu, Garuda, FreeSans;}
a {
color: #3678B2;
text-decoration: none; }
a:hover {
text-decoration: none;
color: #F94A96; }
.note {
padding: 10px 10px 10px 20px;
border-radius: 0px 5px 5px 0px;
margin-top: 32px !important;
margin-bottom: 32px !important; }
.info {
background-color: #e7f3fe;
border-left: 6px solid #2196F3;
filter: drop-shadow(0px 0px 1px #2196F3); }
.warning {
background-color: #ffe8cc;
border-left: 6px solid #ffa93b;
filter: drop-shadow(0px 0px 1px #ffa93b); }
.footnote {
padding: 8px 8px 8px 12px;
border-radius: 0px 5px 5px 0px; }
/* ------------- */
/* SHARE BUTTONS */
/* ------------- */
#share-buttons > a > svg {
border: 8px solid #000;
height: 2.6em;
width: 2.6em;
float: left;
border: 8px solid transparent;
fill: #12ACE9; }
#share-buttons > a:hover > svg {
cursor: pointer;
background: #F94A96;
fill: #fff; }
#share-icon:after {
content: "";
display: block;
clear: both; }
#share-icon {
height: 2.6em;
width: 2.6em;
border: 8px solid transparent;
position: relative;
float: left; }
.popup-container .popup-button > div {
position: relative;
float: left; }
.popup-container .popup-button > div > svg {
height: 2.6em;
width: 2.6em;
border: 8px solid transparent;
fill: #12ACE9;
}
.popup-container .popup-button > div:hover > svg {
cursor: pointer;
background: #F94A96;
fill: #fff; }
.popup-container .popup {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
z-index: 10;
opacity: 0;
visibility: hidden;
transition: 250ms all; }
.popup-container .popup .popup-inner {
box-sizing: border-box;
background: #fff;
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
top: 150%;
transition: 250ms all;
text-align: left;
border-radius: 10px;
border: 1px solid #45474A; }
@media only screen and (max-width: 25em) {
.popup-container .popup .popup-inner {
width: 100%; } }
@media only screen and (min-width: 44.813em) {
.popup-container .popup .popup-inner {
width: 400px; } }
.popup-container .popup .popup-inner .popup-title {
padding: 15px 15px 0 15px;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
border-bottom: solid #b5b5b5;
border-bottom-width: thin; }
.popup-container .popup .popup-inner .popup-title h1 {
font-size: 1.2em;
margin-top: 0; }
.popup-container .popup .popup-inner .popup-title .popup-close-btn {
cursor: pointer;
background: #45474A;
opacity: .6;
font-weight: bold;
display: block;
line-height: 24px;
padding: 0 15px;
font-size: 14px;
color: #fff;
border-radius: 3px; }
.popup-container .popup .popup-inner .popup-title .popup-close-btn:hover {
background: #45474A;
opacity: 1;
color: #fff; }
.popup-container .popup .popup-inner .popup-footer {
margin-top: 10px;
padding: 15px;
float: right;
font-weight: bold; }
.popup-container .popup .popup-inner .popup-footer .popup-share-btn {
cursor: pointer;
font-weight: bold;
background: #12ACE9;
padding: 10px 15px;
color: #f5f5f5;
border-radius: 3px;
border: 1px solid transparent; }
.popup-container .popup .popup-inner .popup-footer .popup-share-btn:hover {
background: #F94A96; }
.popup-container .popup .popup-inner .popup-footer .popup-close-btn {
cursor: pointer;
color: #f5f5f5;
background: #45474A;
opacity: .6;
padding: 10px 15px;
margin-right: 5px;
border-radius: 3px;
border: 1px solid transparent; }
.popup-container .popup .popup-inner .popup-footer .popup-close-btn:hover {
opacity: 1;
background: #45474A; }
.popup-container .popup .popup-inner .popup-content {
padding: 15px; }
.popup-container .popup .popup-inner .popup-content input {
border: 1px solid #ddd;
border-radius: 3px;
line-height: 34px;
padding: 0 15px;
font-size: 14px;
box-sizing: border-box; }
.popup-container .popup .popup-inner .popup-content input[type=text]:focus {
border-color: #45474A; }
.popup-container .popup .transparent-label {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
cursor: pointer; }
.popup-container > input {
display: none; }
.popup-container > input:checked + .popup {
opacity: 1;
visibility: visible; }
.popup-container > input:checked + .popup .popup-inner {
top: 50%; }
.form-control {
width: 100%;
margin-top: 8px;
margin-bottom: 10px; }
.form-check-radio {
margin-top: 10px; }
.form-check-radio li {
list-style: none; }
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Share buttons for Fediverse & others</title>
<link rel="stylesheet" href="./share_buttons.css">
<meta property="og:url" content="https://nomagic.uk/small_projects/share_buttons.html" />
<meta property="og:site_name" content="NOMAGIC - Your life, Your data" />
<meta property="og:image" content="https://nomagic.uk/assets/img/nomagic_ltd_social.png" />
</meta>
<body>
<h1>Share buttons demo page</h1>
<div class="note info">
<p>This is a demo page to showcase the implementation of social media share buttons on <a href="https://nomagic.uk">Nomagic</a>, with very little extra style and code so that it's easy to take and adapt to your own needs. This implementation is completely tracker-free, thus respecting your visitors' irrevocable right to privacy.
<p>This code is under GPLv3 License and is itself a derivative work of two projects:</p>
<ul>
<li>CSS and HTML code for the Fediverse share button is a derivative of <a href="https://dev.to/tayfunerbilen/popup-with-pure-css-1m4k">Tayfun Erbilen work on dev.to</a>.</li>
<li>Javascript code for the Fediverse share button is a derivative of <a href="https://github.com/Aly-ve/Mastodon-share-button">Aly-ve’s Mastodon share button</a>.</li>
</ul>
<p>Adjust the variables contained in the links to your need (it will work out of the box with Jekyll).</p>
<p>Notably, for the Fediverse share: <span style="background: #DDD; color: #000;">data-target="{{ site.url }}{{ page.url }}" data-name="{{ page.title }}"</span></p>
</div>
<div id="share-icon">
<svg version="1.1" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(.96184 0 0 .96184 34.189 -88.927)" fill="#45474a">
<path d="m896 384q-204 0-381.5 69.5t-282 187.5-104.5 255q0 112 71.5 213.5t201.5 175.5l87 50-27 96q-24 91-70 172 152-63 275-171l43-38 57 6q69 8 130 8 204 0 381.5-69.5t282-187.5 104.5-255-104.5-255-282-187.5-381.5-69.5zm896 512q0 174-120 321.5t-326 233-450 85.5q-70 0-145-8-198 175-460 242-49 14-114 22h-5q-15 0-27-10.5t-16-27.5v-1q-3-4-0.5-12t2-10 4.5-9.5l6-9 7-8.5 8-9q7-8 31-34.5t34.5-38 31-39.5 32.5-51 27-59 26-76q-157-89-247.5-220t-90.5-281q0-174 120-321.5t326-233 450-85.5 450 85.5 326 233 120 321.5z"/>
<path d="m923.98 942.12 28.205-112.82h-111.94l-28.205 112.82zm338.46-222.11-24.679 98.716q-3.085 10.577-13.662 10.577h-144.11l-28.205 112.82h137.06q6.6105 0 11.018 5.2885 4.4069 6.1698 2.6441 12.34l-24.679 98.716q-2.2036 10.577-13.662 10.577h-144.11l-35.697 144.55q-3.0848 10.577-13.662 10.577h-98.716q-7.0513 0-11.458-5.2885-3.9663-5.2883-2.6441-12.34l34.374-137.5h-111.94l-35.696 144.55q-3.0848 10.577-13.662 10.577h-99.157q-6.6105 0-11.017-5.2885-3.9664-5.2883-2.6443-12.339l34.374-137.5h-137.06q-6.6105 0-11.017-5.2884-3.9663-5.2883-2.6442-12.34l24.679-98.716q3.0848-10.577 13.661-10.577h144.11l28.205-112.82h-137.06q-6.6105 0-11.017-5.2882-4.4071-6.1698-2.6442-12.34l24.679-98.716q2.2034-10.577 13.662-10.577h144.11l35.697-144.55q3.085-10.577 14.102-10.577h98.716q6.6105 0 11.017 5.2884 3.9663 5.2884 2.6442 12.34l-34.374 137.5h111.94l35.696-144.55q3.0849-10.577 14.102-10.577h98.716q6.6105 0 11.017 5.2884 3.9665 5.2884 2.6443 12.34l-34.374 137.5h137.06q6.6105 0 11.017 5.2884 3.9662 5.2885 2.6442 12.34z" stroke-width=".4407"/>
</g>
</svg>
</div>
<div id="share-buttons">
<div class="popup-container" style="padding: 0;">
<label class="popup-button" for="login-popup">
<div title="Share this on the Fediverse">
<svg version="1.1" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(10.01 0 0 10.01 -123.25 -53.133)">
<g transform="translate(6.679,-32.496)" shape-rendering="auto">
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m181.13 275.14a68.892 68.892 0 0 1-29.465 29.328l161.76 162.39 38.998-19.764zm213.36 214.19-38.998 19.764 81.963 82.283a68.892 68.892 0 0 1 29.471-29.332z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m581.65 339.39-91.576 46.41 6.752 43.189 103.62-52.514a68.892 68.892 0 0 1-18.791-37.086zm-144.74 73.352-216.53 109.73a68.892 68.892 0 0 1 18.795 37.09l204.48-103.63z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m367.28 142.44-104.48 203.97 30.848 30.967 110.62-215.96a68.892 68.892 0 0 1-36.99-18.98zm-131.65 257.02-52.922 103.31a68.892 68.892 0 0 1 36.986 18.979l46.781-91.328z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m150.77 304.92a68.892 68.892 0 0 1-34.416 7.1953 68.892 68.892 0 0 1-6.6504-0.69531l30.902 197.66a68.892 68.892 0 0 1 34.416-7.1953 68.892 68.892 0 0 1 6.6465 0.69531z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m239.34 560.54a68.892 68.892 0 0 1 0.7207 13.877 68.892 68.892 0 0 1-7.2676 27.18l197.63 31.713a68.892 68.892 0 0 1-0.72266-13.879 68.892 68.892 0 0 1 7.2695-27.178z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m601.13 377.2-91.219 178.08a68.892 68.892 0 0 1 36.994 18.982l91.217-178.08a68.892 68.892 0 0 1-36.992-18.984z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m476.72 125.33a68.892 68.892 0 0 1-29.471 29.332l141.27 141.81a68.892 68.892 0 0 1 29.469-29.332z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m347.79 104.63-178.58 90.498a68.892 68.892 0 0 1 18.793 37.086l178.57-90.502a68.892 68.892 0 0 1-18.791-37.082z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m446.93 154.83a68.892 68.892 0 0 1-34.982 7.4824 68.892 68.892 0 0 1-6.0293-0.63281l15.818 101.29 43.162 6.9258zm-16 167.03 37.4 239.48a68.892 68.892 0 0 1 33.914-6.9434 68.892 68.892 0 0 1 7.207 0.79101l-35.357-226.41z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
<path transform="matrix(.26458 0 0 .26458 -6.679 32.496)" d="m188.13 232.97a68.892 68.892 0 0 1 0.75781 14.096 68.892 68.892 0 0 1-7.1602 26.982l101.37 16.281 19.924-38.908zm173.74 27.9-19.926 38.912 239.51 38.467a68.892 68.892 0 0 1-0.69531-13.719 68.892 68.892 0 0 1 7.3496-27.324z" color="#000000" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" solid-color="#000000" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000000;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
</g>
<g transform="translate(6.679,-32.496)" fill-opacity=".99597">
<circle transform="rotate(3.1178)" cx="106.27" cy="51.536" r="16.571"/>
<circle transform="rotate(3.1178)" cx="171.43" cy="110.19" r="16.571"/>
<circle transform="rotate(3.1178)" cx="135.76" cy="190.28" r="16.571"/>
<circle transform="rotate(3.1178)" cx="48.559" cy="181.11" r="16.571"/>
<circle transform="rotate(3.1178)" cx="30.329" cy="95.367" r="16.571"/>
</g>
</g>
</svg>
</div>
</label>
<input type="checkbox" id="login-popup">
<div class="popup">
<label for="login-popup" class="transparent-label"></label>
<div class="popup-inner">
<div class="popup-title">
<h1>Instance address</h1>
<label for="login-popup" class="popup-close-btn">X</label>
</div>
<div class="popup-content">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="form-group">
<label for="msb-address">Enter your instance's address</label>
<input type="text" class="form-control" id="msb-address" placeholder="https://social.nomagic.uk">
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" id="msb-memorize-instance">
<label class="form-check-label" for="msb-memorize-instance">Memorize my instance</label>
</div>
<div class="form-check-radio">
<ul>
<li>
<input type="radio" class="form-radio" name="platform" id="msb-pleroma" value="pleroma" checked>
<label class="form-check-label" for="msb-pleroma">Pleroma</label>
</li>
<li>
<input type="radio" class="form-radio" name="platform" id="msb-mastodon" value="mastodon">
<label class="form-check-label" for="msb-mastodon">Mastodon</label>
</li>
<li>
<input type="radio" class="form-radio" name="platform" id="msb-gnusocial" value="gnusocial">
<label class="form-check-label" for="msb-gnusocial">GNU Social</label>
</li>
<li>
<input type="radio" class="form-radio" name="platform" id="msb-friendica" value="friendica">
<label class="form-check-label" for="msb-friendica">Friendica</label>
</li>
<li>
<input type="radio" class="form-radio" name="platform" id="msb-diaspora" value="diaspora">
<label class="form-check-label" for="msb-diaspora">Diaspora</label>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div id="no_url"></div>
<div class="popup-footer">
<label for="login-popup" class="popup-close-btn">Close</label>
<button id="msb-share" type="button" class="popup-share-btn" aria-hidden="true" data-target="{{ site.url }}{{ page.url }}" data-name="{{ page.title }}">Share on the Fediverse!</button>
</div>
</div>
</div>
</div>
<a href="mailto:?subject={{ page.title }}&body={{ site.url }}{{ page.url }}" target="_top" title="Share this through Email">
<svg version="1.1" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">
<path d="m1663 682v679.66q0 56.496-40.232 96.727-40.232 40.232-96.727 40.232h-1260q-56.496 0-96.727-40.232-40.232-40.232-40.232-96.727v-679.66q37.664 41.944 86.455 74.471 309.87 210.57 425.43 295.32 48.792 35.952 79.179 56.068 30.388 20.116 80.891 41.088 50.504 20.972 94.159 20.972h1.712q43.656 0 94.159-20.972 50.504-20.972 80.891-41.088 30.388-20.116 79.179-56.068 145.52-105.29 426.28-295.32 48.792-33.384 85.599-74.471zm0-251.66q0 67.624-41.944 129.25-41.944 61.631-104.43 105.29-321.85 223.41-400.6 278.2-8.5599 5.9919-36.38 26.108-27.82 20.116-46.224 32.528-18.404 12.412-44.512 27.82-26.108 15.408-49.22 23.112-23.112 7.704-42.8 7.704h-1.712q-19.688 0-42.8-7.704-23.112-7.7039-49.22-23.112-26.108-15.408-44.512-27.82-18.404-12.412-46.224-32.528-27.82-20.116-36.38-26.108-77.895-54.784-224.27-156.22-146.37-101.44-175.48-121.98-53.072-35.952-100.15-98.867-47.08-62.916-47.08-116.84 0-66.768 35.524-111.28 35.524-44.512 101.44-44.512h1260q55.64 0 96.299 40.232 40.66 40.232 40.66 96.727z" style="stroke-width:.85599"/>
</svg>
</a>
<a href="https://twitter.com/home?status={{ site.url }}{{ page.url }}" target="_blank" title="Share this on Twitter">
<svg version="1.1" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">
<path d="m1684 408q-67 98-162 167 1 14 1 42 0 130-38 259.5t-115.5 248.5-184.5 210.5-258 146-323 54.5q-271 0-496-145 35 4 78 4 225 0 401-138-105-2-188-64.5t-114-159.5q33 5 61 5 43 0 85-11-112-23-185.5-111.5t-73.5-205.5v-4q68 38 146 41-66-44-105-115t-39-154q0-88 44-163 121 149 294.5 238.5t371.5 99.5q-8-38-8-74 0-134 94.5-228.5t228.5-94.5q140 0 236 102 109-21 205-78-37 115-142 178 93-10 186-50z"/>
</svg>
</a>
<a href="https://www.facebook.com/share.php?u={{ site.url }}{{ page.url }}" target="_blank" title="Share this on Facebook">
<svg version="1.1" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">
<path d="m1282 163.22v235.92h-140.3q-76.852 0-103.66 32.171t-26.809 96.512v168.9h261.83l-34.852 264.51h-226.98v678.26h-273.45v-678.26h-227.88v-264.51h227.88v-194.81q0-166.22 92.938-257.81 92.937-91.597 247.54-91.597 131.36 0 203.75 10.724z" style="stroke-width:.89363"/>
</svg>
</a>
</div>
<!-- Fediverse Share -->
<script src="./share_buttons.js"></script>
</body>
</html>
/* This is a derivative work based on Aly-ve work
* https://aly-ve.github.io/Mastodon-share-button/
*
* Original source code for Mastodon-share-button can be
* found at https://github.com/Aly-ve/Mastodon-share-button
*
* This code is free software and released under AGPLv3 licence.
*
*/
var msbConfig = {
addressFieldSelector: '#msb-address',
buttonModalSelector: '#msb-share',
memorizeFieldId: 'msb-memorize-instance',
};
"use strict";
const COOKIE_ADDRESS = 'instance-address'
const COOKIE_PLATFORM = 'instance-platform'
const URL_REGEX = /^(https?:\/\/)?([\da-z.-]+)\.([a-z.]{2,6})([\/\w .-]*)*\/?$/
function msbShareButtonAction(name, target, platform) {
let msbInstanceAddress = ''
if (msbInstanceAddress.length > 0) {
// USING THE COOKIE
switch(platform) {
case "pleroma":
window.open(`${msbInstanceAddress}/share?message=${name}%20${target}`, `__blank`)
break;
case "mastodon":
window.open(`${msbInstanceAddress}/share?text=${name}%20${target}`, `__blank`)
break;
case "gnusocial":
window.open(`${msbInstanceAddress}/?action=newnotice&status_textarea=${name}%20${target}`, `__blank`)
break;
case "friendica":
window.open(`${msbInstanceAddress}/bookmarklet?url=${target}&title=${name}&jump-doclose`, `__blank`)
break;
case "diaspora":
window.open(`${msbInstanceAddress}/bookmarklet?url=${target}&title=${name}&jump-doclose`, `__blank`)
break;
default:
alert("nothing chosen! should not happen...");
}
}
else {
if (msbConfig && msbConfig.addressFieldSelector) {
msbOnShare(name, target)
}
}
}
function msbOnShare(_name, _target) {
if (msbConfig && msbConfig.addressFieldSelector && msbConfig.buttonModalSelector) {
let name = !!_name ? _name : document.querySelector(msbConfig.buttonModalSelector).data.name
let target = !!_target ? _target : document.querySelector(msbConfig.buttonModalSelector).data.target
let msbInstanceAddress = document.querySelector(`${msbConfig.addressFieldSelector}`).value
let msbPlatform = document.querySelector('input[name = "platform"]:checked').value
if (msbInstanceAddress.match(URL_REGEX)) {
if (msbConfig.memorizeFieldId) {
let msbMemorizeIsChecked = document.querySelector(`#${msbConfig.memorizeFieldId}`).checked
// adding an extra level to allow overwritting the cookie
if (msbMemorizeIsChecked) {
// Handling cookie for URL
if (msbGetCookie(COOKIE_ADDRESS).length > 0) {
// if new address is different than cookie
if (msbInstanceAddress != msbGetCookie(COOKIE_ADDRESS) ) {
msbSetCookie(COOKIE_ADDRESS, msbInstanceAddress, 7);
}
} else {
msbSetCookie(COOKIE_ADDRESS, msbInstanceAddress, 7);
}
// Handling cookie for Platform
if (msbGetCookie(COOKIE_PLATFORM).length > 0) {
// if new platform is different than cookie
if (msbPlatform != msbGetCookie(COOKIE_PLATFORM) ) {
msbSetCookie(COOKIE_PLATFORM, msbPlatform, 7);
}
} else {
msbSetCookie(COOKIE_PLATFORM, msbPlatform, 7);
}
}
}
switch(msbPlatform) {
case "pleroma":
window.open(`${msbInstanceAddress}/share?message=${name}%20${target}`, `__blank`)
break;
case "mastodon":
window.open(`${msbInstanceAddress}/share?text=${name}%20${target}`, `__blank`)
break;
case "gnusocial":
window.open(`${msbInstanceAddress}/?action=newnotice&status_textarea=${name}%20${target}`, `__blank`)
break;
case "friendica":
window.open(`${msbInstanceAddress}/bookmarklet?url=${target}&title=${name}&jump-doclose`, `__blank`)
break;
case "diaspora":
window.open(`${msbInstanceAddress}/bookmarklet?url=${target}&title=${name}&jump-doclose`, `__blank`)
break;
default:
alert("nothing chosen! should not happen...");
}
} else {
document.getElementById('no_url').className = "footnote warning";
document.getElementById('no_url').style = "margin-bottom: 0";
document.getElementById('no_url').innerHTML = "Please enter the domain of your instance.";
}
}
}
function msbGetCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
function msbSetCookie(name, value, days) {
let d = new Date()
d.setTime(d.getTime() + days*86400000)
let expires = 'expires=' + d.toUTCString()
document.cookie = `${name}=${value}; ${expires}; path=/`
}
(function() {
// get the first occurrence
let msbButtons = document.querySelector('#msb-share')
let msbTarget = msbButtons.dataset.target
let msbName = msbButtons.dataset.name
let msbInstanceAddress = msbGetCookie('instance-address')
let msbPlatform = msbGetCookie('instance-platform')
// Fill the form for URL and radio button from Cookie (if applicable)
document.getElementById("msb-address").value = msbInstanceAddress;
var platformRadio = document.getElementsByName('platform');
for(var i = 0; i < platformRadio.length; i++){
if(platformRadio[i].value == msbPlatform){
platformRadio[i].checked = true;
break;
}
}
// Replace hashtab by html code
msbName = msbName.replace(/#/g, '%23')
msbButtons.addEventListener('click', () => { msbShareButtonAction(msbName, msbTarget, msbPlatform) }, true)
})()
function msbI18n() {
let language = navigator.language || navigator.userLanguage
let publish = {
'ar': 'بوّق',
'bg': 'Раздумай',
'cs': 'Tootnout',
'de': 'Tröt',
'eo': 'Hué',
'es': 'Tootear',
'eu': 'Tut',
'fa': 'بوق',
'fi': 'Tuuttaa',
'fr': 'Pouet',
'gl': 'ללחוש',
'he': 'ללחוש',
'hu': 'Tülk',
'hy': 'Թթել',
'io': 'Siflar',
'ja': 'トゥート',
'ko': '',
'no': 'Tut',
'oc': 'Tut',
'pl': 'Wyślij',
'pt-BR': 'Publicar',
'pt': 'Publicar',
'ru': 'Трубить',
'sr-Latn': 'Tutni',
'sr': 'Тутни',
'uk': 'Дмухнути',
'zh-CN': '嘟嘟',
'zh-HK': '發文',
'zh-TW': '貼掉',
'default': 'Toot'
}
let text = null
try {
text = publish[language]
}
catch (error) {
text = publish.default
}
return text
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment