update about page (email obfuscation)

introducing two new javascript files that use browser JS interaction to
reveal the data

moved everything into /assets (from /static) so we also added defer,
devmode choise and integrity to the files, scrumbling their names with
sha256 checksums in extended header partial

also moved lightbox into extended header from _baseof layout
This commit is contained in:
Dominic Reich 2024-12-26 19:00:04 +01:00
parent 6f1a90a8a0
commit 01706732f2
Signed by: dominic
GPG key ID: 0B5787DB23049C45
8 changed files with 154 additions and 4 deletions

View file

@ -0,0 +1,47 @@
"use strict";
document.addEventListener("DOMContentLoaded", function () {
const listener = new Listener();
listener.decode = function () {
const a = document.getElementById("link-interaction");
a.setAttribute(
"href",
a
.getAttribute("href")
.replace("o", "qual.luck1288")
.replace("-", "@")
.replaceAll("R-", "j")
.replace("/", "tunjyf.com")
.replace("t", "mailto:e"),
);
};
listener.on();
});
// Listener
function Listener() {}
Listener.prototype.decode = null;
Listener.prototype.on = function () {
this.listener = this.__onInteraction.bind(this);
document.addEventListener("mouseenter", this.listener, true);
document.addEventListener("focus", this.listener, true);
};
Listener.prototype.off = function () {
document.removeEventListener("mouseenter", this.listener, true);
document.removeEventListener("focus", this.listener, true);
delete this.listener;
};
Listener.prototype.__onInteraction = function () {
this.off();
this.decode();
};

View file

@ -0,0 +1,45 @@
"use strict";
document.addEventListener("DOMContentLoaded", function () {
const listener = new Listener();
listener.decode = function () {
const email = document.getElementById("text-interaction").firstChild;
email.nodeValue = email.nodeValue
.replace("ity ", ".")
.replaceAll("Y", "y1288")
.replace(" ", "@")
.replace("north", "qtztsjo")
.replace(" side", "smprqmgtunj")
.replaceAll(" ", ".")
.replace(".stream", "yf");
};
listener.on();
});
// Listener
function Listener() {}
Listener.prototype.decode = null;
Listener.prototype.on = function () {
this.listener = this.__onInteraction.bind(this);
document.addEventListener("mouseenter", this.listener, true);
document.addEventListener("focus", this.listener, true);
};
Listener.prototype.off = function () {
document.removeEventListener("mouseenter", this.listener, true);
document.removeEventListener("focus", this.listener, true);
delete this.listener;
};
Listener.prototype.__onInteraction = function () {
this.off();
this.decode();
};

View file

@ -132,3 +132,9 @@ taxonomy = [ "HTML" ]
name = "date"
weight = 10
# [module]
# [[module.mounts]]
# source = 'assets'
# target = 'assets'
# # excludeFiles = ['posts/**/*.drawio']
# excludeFiles = ['js/*-interaction.js', 'js/lightbox.js']

View file

@ -4,7 +4,7 @@ date: 2019-08-21
coverCaption: >
Längenfeld at the evening.
Photo taken near [Astlehn/Fischbach](https://www.openstreetmap.org/?mlat=47.062377833333336&mlon=10.959586666666667#map=15/47.062377833333336/10.959586666666667).
lastmod: 2024-12-26T15:26:56+0000
lastmod: 2024-12-26T18:00:04+0000
comment: false
showDate: false
@ -123,7 +123,8 @@ any time (although it is online since 2019 -- I used other domain names before t
**_These are new keys since Dec 24 2024!_**
{.lead}
Use <kbd><span class="myemail">equal.luck1288<b>+nospam</b>@qtztsjosmprqmgtunjyf.com<b>.example.com</b></span></kbd>
Use <a id="link-interaction" rel="nofollow, noindex" href="to-qtztsR-osmprqmg/"><span
id="text-interaction">equality luckY north side stream.com</span></a>
to send me emails.
Feel free to encrypt your message with OpenPGP:

View file

@ -47,8 +47,6 @@
{{- partial "search.html" . -}}
{{ end }}
</div>
<script type="text/javascript" src="/js/lightbox.js"></script>
<link rel="stylesheet" href="/css/lightbox.css">
<!-- Cloudflare Web Analytics --><script defer src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon='{"token": "22f5246f39094b2cb80fa476d2a8099f"}'></script><!-- End Cloudflare Web Analytics -->
</body>
</html>

View file

@ -1,2 +1,55 @@
{{ partial "plausible_head.html" . }}
<meta name="fediverse:creator" content="@oe7drt@mastodon.radio" />
{{ with resources.Get "js/text-interaction.js" }}
{{ if hugo.IsDevelopment }}
{{ with . | js.Build }}
<script defer type="text/javascript" src="{{ .RelPermalink }}" data-copy="Copy" data-copied="Copied"></script>
{{ end }}
{{ else }}
{{ $opts := (dict "minify" true "targetPath" "js/txt.js") }}
{{ with . | js.Build $opts | fingerprint }}
<script defer type="text/javascript" src="{{ .RelPermalink }}" data-copy="Copy" data-copied="Copied" integrity="{{ .Data.Integrity }}"></script>
{{ end }}
{{ end }}
{{ end }}
{{ with resources.Get "js/link-interaction.js" }}
{{ if hugo.IsDevelopment }}
{{ with . | js.Build }}
<script defer type="text/javascript" src="{{ .RelPermalink }}" data-copy="Copy" data-copied="Copied"></script>
{{ end }}
{{ else }}
{{ $opts := (dict "minify" true "targetPath" "js/lnk.js") }}
{{ with . | js.Build $opts | fingerprint }}
<script defer type="text/javascript" src="{{ .RelPermalink }}" data-copy="Copy" data-copied="Copied" integrity="{{ .Data.Integrity }}"></script>
{{ end }}
{{ end }}
{{ end }}
{{ with resources.Get "js/lightbox.js" }}
{{ if hugo.IsDevelopment }}
{{ with . | js.Build }}
<script defer type="text/javascript" src="{{ .RelPermalink }}" data-copy="Copy" data-copied="Copied"></script>
{{ end }}
{{ else }}
{{ $opts := (dict "minify" true "targetPath" "js/lightbox.js") }}
{{ with . | js.Build $opts | fingerprint }}
<script defer type="text/javascript" src="{{ .RelPermalink }}" data-copy="Copy" data-copied="Copied" integrity="{{ .Data.Integrity }}"></script>
{{ end }}
{{ end }}
{{ end }}
{{ with resources.Get "css/lightbox.css" }}
{{ if hugo.IsDevelopment }}
{{ with . }}
<link type="text/css" rel="stylesheet" media="screen,print" href="{{ .RelPermalink }}" />
{{ end }}
{{ else }}
{{ with . | fingerprint }}
<link type="text/css" rel="stylesheet" media="screen,print" href="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" />
{{ end }}
{{ end }}
{{ end }}
<meta name="lala " />