From d5fa1ffd7a0582f5f827fd1cfa761258e8969fb2 Mon Sep 17 00:00:00 2001 From: James Eversole Date: Tue, 27 Dec 2022 14:11:41 -0600 Subject: [PATCH] Add copy link button. Enhance buttons by reverting their text when a new copy event occurs. --- views/index.hamlet | 2 +- views/public/copyButtons.js | 23 +++++++++++++++++++++++ views/public/copySecret.js | 10 ---------- views/pw.hamlet | 3 ++- 4 files changed, 26 insertions(+), 12 deletions(-) create mode 100644 views/public/copyButtons.js delete mode 100644 views/public/copySecret.js diff --git a/views/index.hamlet b/views/index.hamlet index 6f229b2..e1f27af 100644 --- a/views/index.hamlet +++ b/views/index.hamlet @@ -5,7 +5,7 @@ $doctype 5 purr <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://unpkg.com/htmx.org@1.7.0" integrity="sha384-EzBXYPt0/T6gxNp0nuPtLkmRpmDBbjg6WmCUZRLXBBwYYmwAUxzlSGej0ARHX0Bo" crossorigin="anonymous"> - <script src="/copySecret.js" integrity="sha384-jB3mpB1WyAo8ToD7oWm/LjXBnEImM/8GB7tjExykwuNErwdPHa9mihHlVJRtV+bt"> + <script src="/copyButtons.js" integrity="sha384-eNQZr7QWPQmi/EWi4lVVFOavm+Eibmh7iDvDptgE0j5fI3xycLssbDBZbKphi8pk"> <link rel="stylesheet" href="/style.css"> <body> diff --git a/views/public/copyButtons.js b/views/public/copyButtons.js new file mode 100644 index 0000000..35cc526 --- /dev/null +++ b/views/public/copyButtons.js @@ -0,0 +1,23 @@ +function copySecret(secret) { + var tempText = document.createElement('input'); + tempText.style = 'position: absolute; left: -1000px; top: -1000px'; + tempText.value = secret; + document.body.appendChild(tempText); + tempText.select(); + document.execCommand('copy'); + document.body.removeChild(tempText); + document.getElementById('secretButton').innerHTML = "- secret copied -"; + document.getElementById('linkButton').innerHTML = "copy link"; +} + +function copyLink(link) { + var tempText = document.createElement('input'); + tempText.style = 'position: absolute; left: -1000px; top: -1000px'; + tempText.value = window.location.origin + '/pw/' + link; + document.body.appendChild(tempText); + tempText.select(); + document.execCommand('copy'); + document.body.removeChild(tempText); + document.getElementById('linkButton').innerHTML = "- link copied -"; + document.getElementById('secretButton').innerHTML = "copy secret"; +} diff --git a/views/public/copySecret.js b/views/public/copySecret.js deleted file mode 100644 index 909ed92..0000000 --- a/views/public/copySecret.js +++ /dev/null @@ -1,10 +0,0 @@ -function copySecret(secret) { - var tempText = document.createElement('input'); - tempText.style = 'position: absolute; left: -1000px; top: -1000px'; - tempText.value = secret; - document.body.appendChild(tempText); - tempText.select(); - document.execCommand('copy'); - document.body.removeChild(tempText); - document.getElementById('copyButton').innerHTML = "- secret copied -"; -} diff --git a/views/pw.hamlet b/views/pw.hamlet index fae6d33..9271aae 100644 --- a/views/pw.hamlet +++ b/views/pw.hamlet @@ -2,7 +2,8 @@ $maybe pw <- password <p .resLink>secret found at <a href="/pw/#{link}">/pw/#{link}</a>: <h3 .pwResult>#{pw} - <button #copyButton .mainButton onclick="copySecret('#{pw}')">copy secret</button> + <button #secretButton .mainButton onclick="copySecret('#{pw}')">copy secret</button> + <button #linkButton .mainButton onclick="copyLink('#{link}')">copy link</button> $nothing <p .resLink>no secret found at <br /><a href="/pw/#{link}">/pw/#{link}</a>