From 1dd0d17ba59a6a0392a53462846b13efc18df914 Mon Sep 17 00:00:00 2001
From: Daan Sprenkels <daan@dsprenkels.com>
Date: Sun, 5 Apr 2020 18:14:02 +0200
Subject: [PATCH 1/2] Add copy-to-clipboard button to meta page

Fixes #42.
---
 assets/css/main.css                       |  8 +++++
 assets/js/copyclipboard.js                | 39 +++++++++++++++++++++++
 assets/templates/html/pasteMeta.html.tmpl |  7 ++++
 3 files changed, 54 insertions(+)
 create mode 100644 assets/js/copyclipboard.js

diff --git a/assets/css/main.css b/assets/css/main.css
index 54f9979..a8d8cf4 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -19,4 +19,12 @@ body {
 
 pre {
     padding-left: 4ex; /* approx 4 monospaced spaces */
+}
+
+.success {
+    color: #008000;
+}
+
+.fail {
+    color: #800000;
 }
\ No newline at end of file
diff --git a/assets/js/copyclipboard.js b/assets/js/copyclipboard.js
new file mode 100644
index 0000000..033c9f2
--- /dev/null
+++ b/assets/js/copyclipboard.js
@@ -0,0 +1,39 @@
+"use strict";
+
+const COPY_TO_CLIPBOARD_STATUS_ID = "copyToClipboardStatus";
+let copyToClipboardCtr = 0;
+
+function copyToClipboardSuccess() {
+    let statusElem = document.getElementById(COPY_TO_CLIPBOARD_STATUS_ID);
+    statusElem.innerText = "URL copied!";
+    statusElem.classList.remove("fail");
+    statusElem.classList.add("success");
+}
+
+function copyToClipboardFail(cause) {
+    let statusElem = document.getElementById(COPY_TO_CLIPBOARD_STATUS_ID);
+    if (!cause) cause = "unknown error";
+    statusElem.innerText = "copy failed: " + cause;
+    statusElem.classList.remove("success");
+    statusElem.classList.add("fail");
+}
+
+function copyToClipboard(url) {
+    let copyEventIdx = ++copyToClipboardCtr;
+
+    if (!window.navigator.clipboard) {
+        let msg = "could not access clipboard";
+        if (window.location.protocol !== "https:") {
+            msg += ": website not using HTTPS"
+        }
+        copyToClipboardFail(msg);
+        return;
+    }
+    window.navigator.clipboard.writeText(url).then(() => {
+        if (copyToClipboardCtr !== copyEventIdx) return;
+        copyToClipboardSuccess();
+    }, () => {
+        if (copyToClipboardCtr !== copyEventIdx) return;
+        copyToClipboardFail();
+    });
+}
diff --git a/assets/templates/html/pasteMeta.html.tmpl b/assets/templates/html/pasteMeta.html.tmpl
index e697c30..6037c1c 100644
--- a/assets/templates/html/pasteMeta.html.tmpl
+++ b/assets/templates/html/pasteMeta.html.tmpl
@@ -2,8 +2,15 @@
 '{{.Paste.Key}}{{.FileExt}}' metadata - rushlink
 {{end}}
 
+{{define "head-append"}}
+<script type="text/javascript" src="/js/copyclipboard.js" defer></script>
+{{end}}
+
 {{define "body"}}
 <pre>
+<button onclick="copyToClipboard('{{.RootURL}}/{{.Paste.Key}}{{.FileExt}}')">Copy URL to clipboard</button> <span id="copyToClipboardStatus"></span>
+</pre>
+<pre>
 <a href="{{.RootURL}}/{{.Paste.Key}}{{.FileExt}}">{{.RootURL}}/{{.Paste.Key}}{{.FileExt}}</a>
 ---
 {{if and (ne .Paste.State.String "deleted") .CanDeleteBool}}

From 09481f47e657a2915464cc9054f73c2ffaccd466 Mon Sep 17 00:00:00 2001
From: Daan Sprenkels <daan@dsprenkels.com>
Date: Sun, 5 Apr 2020 18:46:40 +0200
Subject: [PATCH 2/2] Do not show button if clipboard not available

---
 assets/css/main.css                       |  6 +++++-
 assets/js/copyclipboard.js                | 24 +++++++++++++++++------
 assets/templates/html/pasteMeta.html.tmpl |  2 +-
 3 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/assets/css/main.css b/assets/css/main.css
index a8d8cf4..746a77a 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -27,4 +27,8 @@ pre {
 
 .fail {
     color: #800000;
-}
\ No newline at end of file
+}
+
+.hidden {
+    display: none;
+}
diff --git a/assets/js/copyclipboard.js b/assets/js/copyclipboard.js
index 033c9f2..9967dd9 100644
--- a/assets/js/copyclipboard.js
+++ b/assets/js/copyclipboard.js
@@ -1,5 +1,6 @@
 "use strict";
 
+const COPY_TO_CLIPBOARD_CONTAINER_ID = "copyToClipboardContainer";
 const COPY_TO_CLIPBOARD_STATUS_ID = "copyToClipboardStatus";
 let copyToClipboardCtr = 0;
 
@@ -13,7 +14,9 @@ function copyToClipboardSuccess() {
 function copyToClipboardFail(cause) {
     let statusElem = document.getElementById(COPY_TO_CLIPBOARD_STATUS_ID);
     if (!cause) cause = "unknown error";
-    statusElem.innerText = "copy failed: " + cause;
+    let msg = "copy failed: " + cause;
+    console.log(msg);
+    statusElem.innerText = msg;
     statusElem.classList.remove("success");
     statusElem.classList.add("fail");
 }
@@ -22,11 +25,7 @@ function copyToClipboard(url) {
     let copyEventIdx = ++copyToClipboardCtr;
 
     if (!window.navigator.clipboard) {
-        let msg = "could not access clipboard";
-        if (window.location.protocol !== "https:") {
-            msg += ": website not using HTTPS"
-        }
-        copyToClipboardFail(msg);
+        copyToClipboardFail("could not access clipboard");
         return;
     }
     window.navigator.clipboard.writeText(url).then(() => {
@@ -37,3 +36,16 @@ function copyToClipboard(url) {
         copyToClipboardFail();
     });
 }
+
+(function () {
+    if (!window.navigator.clipboard) {
+        let msg = "cannot access clipboard";
+        if (window.location.protocol !== "https:") {
+            msg += ": website not using https"
+        }
+        console.error(msg);
+    } else {
+        let container = document.getElementById(COPY_TO_CLIPBOARD_CONTAINER_ID);
+        container.classList.remove("hidden");
+    }
+})();
diff --git a/assets/templates/html/pasteMeta.html.tmpl b/assets/templates/html/pasteMeta.html.tmpl
index 6037c1c..c0c8026 100644
--- a/assets/templates/html/pasteMeta.html.tmpl
+++ b/assets/templates/html/pasteMeta.html.tmpl
@@ -7,7 +7,7 @@
 {{end}}
 
 {{define "body"}}
-<pre>
+<pre id="copyToClipboardContainer" class="hidden">
 <button onclick="copyToClipboard('{{.RootURL}}/{{.Paste.Key}}{{.FileExt}}')">Copy URL to clipboard</button> <span id="copyToClipboardStatus"></span>
 </pre>
 <pre>