vilmibm
/
blackout
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add but hide image copy support

trunk
vilmibm 2023-07-19 03:24:25 +00:00
parent f9190a8773
commit f9082d4d3e
2 changed files with 22 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
main.go
View File

@ -46,6 +46,7 @@ func main() {
}) })
r.LoadHTMLFiles("templates/index.tmpl") r.LoadHTMLFiles("templates/index.tmpl")
r.StaticFile("/favicon.ico", "./assets/favicon.ico") r.StaticFile("/favicon.ico", "./assets/favicon.ico")
r.StaticFile("/html2canvas.min.js", "./assets/html2canvas.min.js")
randMax := big.NewInt(maxID) randMax := big.NewInt(maxID)

26
templates/index.tmpl
View File

@ -2,6 +2,7 @@
<html> <html>
<head> <head>
<title>blackout engine</title> <title>blackout engine</title>
<script src="/html2canvas.min.js"></script>
</head> </head>
<body> <body>
<style> <style>
@ -102,7 +103,10 @@
--> -->
<center> <center>
<p> <p>
<button id="copy">copy text to clipboard</button> <button id="copyText">copy text to clipboard</button>
</p>
<p>
<button id="copyImage" class="hidden">copy image to clipboard</button>
</p> </p>
<p> <p>
<a id="aboutToggle" href="">ABOUT</a> <a id="aboutToggle" href="">ABOUT</a>
@ -132,9 +136,21 @@
e.preventDefault(); e.preventDefault();
document.querySelector("#about").classList.toggle("hidden"); document.querySelector("#about").classList.toggle("hidden");
} }
const copyButton = document.querySelector("#copy"); const copyImgButton = document.querySelector("#copyImage");
copyButton.addEventListener("animationend", () => copyButton.classList.remove("rainbow"), false); copyImgButton.addEventListener("animationend", () => copyImgButton.classList.remove("rainbow"), false);
copyButton.onclick = (e) => { copyImgButton.onclick = () => {
html2canvas(document.querySelector("#paper")).then((canvas) => {
canvas.toBlob((blob) => {
let data = [new ClipboardItem({ [blob.type]: blob })];
navigator.clipboard.write(data).then(() => {
copyImgButton.classList.add("rainbow");
}, console.log);
});
});
}
const copyTextButton = document.querySelector("#copyText");
copyTextButton.addEventListener("animationend", () => copyTextButton.classList.remove("rainbow"), false);
copyTextButton.onclick = () => {
let toCopy = ""; let toCopy = "";
document.querySelectorAll("#paper span").forEach(span => { document.querySelectorAll("#paper span").forEach(span => {
let guts = span.innerHTML; let guts = span.innerHTML;
@ -167,7 +183,7 @@
}); });
navigator.clipboard.writeText(toCopy).then(() => { navigator.clipboard.writeText(toCopy).then(() => {
copyButton.classList.add("rainbow"); copyTextButton.classList.add("rainbow");
}, (err) => { }, (err) => {
console.log(err); console.log(err);
}); });