Adding "link to clipboard" functionality and forcing questions to consist printable characters.

3 files changed, 43 insertions, 13 deletions

diff --git a/static/alert-timeout.js b/static/alert-timeout.js
index 6fe6def..e20106f 100644
--- a/static/alert-timeout.js
+++ b/static/alert-timeout.js
@@ -1,13 +1,8 @@
-Array.from(document.getElementsByClassName('kysAlert')).forEach( (a) => {
-        a.addEventListener('click', (event) => {
-            event.target.remove();
-        })
-        setTimeout( () => {
-            Array.from(document.getElementsByClassName('kysAlert'))
-                    .forEach( (a) => {
-                if (a.style.transition=="opacity 2s") a.remove()
-                a.style.transition="opacity 2s"
-                a.style.opacity=0;
-            } )
-        }, 5000)
-    })
+setInterval( () => {
+    Array.from(document.getElementsByClassName('kysAlert')).forEach( (a)=>{
+        a.addEventListener('click', (event) => { event.target.remove() } )
+        if (a.style.transition=="opacity 2s") a.remove()
+        a.style.transition="opacity 2s"
+        a.style.opacity=0;
+    } )
+}, 5000)
diff --git a/static/kys-link-info.js b/static/kys-link-info.js
new file mode 100644
index 0000000..f3165b2
--- /dev/null
+++ b/static/kys-link-info.js
@@ -0,0 +1,20 @@
+const kysLink = document.getElementById("kysLink")
+kysLink.onclick = () => {
+    const link = kysLink.innerHTML
+    navigator.clipboard.writeText(link)
+    const linkInfo = document.createElement("div")
+    linkInfo.className = 'kysInfo'
+    const linkText = document.createTextNode( 
+            "Linkki " + link + " on kopioitu leikepöydälle." )
+    linkInfo.appendChild( linkText )
+    document.documentElement.lastChild.append(linkInfo)
+}
+
+setInterval( () => {
+    Array.from(document.getElementsByClassName('kysInfo')).forEach( (a)=>{
+        a.addEventListener('click', (event) => { event.target.remove() } )
+        if (a.style.transition=="opacity 2s") a.remove()
+        a.style.transition="opacity 2s"
+        a.style.opacity=0;
+    } )
+}, 5000)
diff --git a/static/kyselma.css b/static/kyselma.css
index 92f51ca..fdc3996 100644
--- a/static/kyselma.css
+++ b/static/kyselma.css
@@ -62,6 +62,21 @@
     transform: translate(-50%, -50%);
 }
 
+.kysInfo {
+    border: 0.4rem solid;
+    padding: 0.8rem;
+    display: block;
+    background-color: #55F;
+    border-top-color: #79F;
+    border-left-color: #69F;
+    border-right-color: #31F;
+    border-bottom-color: #41F;
+    position: fixed;
+    top: 50vh;
+    left: 50vw;
+    transform: translate(-50%, -50%);
+}
+
 .kysTotal {
   max-width: 25rem;
   min-width: max-content;