2024-12-27 02:54:09 +00:00
|
|
|
package pages
|
|
|
|
|
|
2024-12-27 18:34:36 +00:00
|
|
|
import "github.com/skip2/go-qrcode"
|
|
|
|
|
import "encoding/base64"
|
|
|
|
|
|
2025-01-03 19:30:52 +00:00
|
|
|
templ Overlay(lnurl string, lnaddr string) {
|
2024-12-27 02:54:09 +00:00
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
|
<title>zaply</title>
|
2024-12-27 17:02:34 +00:00
|
|
|
<link href="/css/tailwind.css" rel="stylesheet">
|
|
|
|
|
<link href="/css/zap.css" rel="stylesheet">
|
2024-12-27 02:54:09 +00:00
|
|
|
<script src={ GetBaseUrl(ctx) + "/js/htmx.min.js" } integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
|
|
|
|
|
<script src={ GetBaseUrl(ctx) + "/js/htmx-sse.js" } crossorigin="anonymous"></script>
|
|
|
|
|
if GetEnv(ctx) == "development" {
|
|
|
|
|
<script src={ GetBaseUrl(ctx) + "/js/livereload.js" }></script>
|
|
|
|
|
}
|
2024-12-27 17:02:34 +00:00
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div hx-ext="sse" sse-connect="/overlay/sse" sse-swap="zap" hx-swap="beforeend" class="fixed bottom-0 right-0" />
|
2024-12-27 02:54:09 +00:00
|
|
|
<script>
|
2024-12-27 17:02:34 +00:00
|
|
|
document.body.addEventListener('htmx:sseMessage', function (e) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
const div = document.getElementById(e.detail.lastEventId)
|
|
|
|
|
div.classList.add('zap-animate-out')
|
|
|
|
|
div.addEventListener('animationend', div.remove)
|
|
|
|
|
}, 60_000)
|
2024-12-27 02:54:09 +00:00
|
|
|
})
|
|
|
|
|
</script>
|
2025-01-03 20:03:28 +00:00
|
|
|
<div id="qr" class="bg-white fixed bottom-0 left-0 text-center p-3 cursor-move" style="left: 0; bottom: 0;" draggable="true">
|
2025-01-03 19:30:52 +00:00
|
|
|
<div class="p-2">
|
|
|
|
|
<div class="font-bold">{ lnaddr }</div>
|
|
|
|
|
<img src={ "data:image/jpeg;base64," + qrEncode(lnurl) }/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="italic">zap us a message!</div>
|
2024-12-27 18:34:36 +00:00
|
|
|
</div>
|
2025-01-03 20:03:28 +00:00
|
|
|
<script>
|
|
|
|
|
const qr = document.getElementById("qr");
|
|
|
|
|
|
2025-01-03 20:39:07 +00:00
|
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
|
|
|
let queryX = parseInt(urlParams.get('x'));
|
|
|
|
|
let queryY = parseInt(urlParams.get('y'));
|
|
|
|
|
const [localX,localY] = localStorage.getItem('qrPosition')?.split(',').map(Number) ?? [0,0];
|
|
|
|
|
|
|
|
|
|
let currentX = !isNaN(queryX) ? queryX : localX;
|
|
|
|
|
let currentY = !isNaN(queryY) ? queryY : localY;
|
|
|
|
|
qr.style.transform = `translate(${currentX}px, ${currentY}px)`;
|
|
|
|
|
|
2025-01-03 20:03:28 +00:00
|
|
|
let startX = 0;
|
|
|
|
|
let startY = 0;
|
|
|
|
|
|
|
|
|
|
qr.addEventListener("dragstart", (e) => {
|
|
|
|
|
startX = e.clientX - currentX;
|
|
|
|
|
startY = e.clientY - currentY;
|
|
|
|
|
e.dataTransfer.setData("text/plain", `${currentX},${currentY}`);
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
qr.addEventListener("drag", (e) => {
|
|
|
|
|
if (e.clientX && e.clientY) {
|
|
|
|
|
currentX = e.clientX - startX;
|
|
|
|
|
currentY = e.clientY - startY;
|
|
|
|
|
qr.style.transform = `translate(${currentX}px, ${currentY}px)`;
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
qr.addEventListener("dragend", (e) => {
|
|
|
|
|
currentX = e.clientX - startX;
|
|
|
|
|
currentY = e.clientY - startY;
|
|
|
|
|
qr.style.transform = `translate(${currentX}px, ${currentY}px)`;
|
|
|
|
|
localStorage.setItem('qrPosition', `${currentX},${currentY}`);
|
2025-01-03 20:39:07 +00:00
|
|
|
window.location.search = `?x=${currentX}&y=${currentY}`
|
2025-01-03 20:03:28 +00:00
|
|
|
});
|
|
|
|
|
</script>
|
2024-12-27 17:02:34 +00:00
|
|
|
</body>
|
2024-12-27 02:54:09 +00:00
|
|
|
</html>
|
|
|
|
|
}
|
2024-12-27 18:34:36 +00:00
|
|
|
|
|
|
|
|
func qrEncode(value string) string {
|
|
|
|
|
q, err := qrcode.New(value, qrcode.Medium)
|
|
|
|
|
q.DisableBorder = true
|
|
|
|
|
|
|
|
|
|
png, err := q.PNG(256)
|
|
|
|
|
if err != nil {
|
|
|
|
|
return ""
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return base64.StdEncoding.EncodeToString([]byte(png))
|
|
|
|
|
}
|
