Spinning animation while vote request is processing

[voter] / src / main.rs
diff --git a/src/main.rs b/src/main.rs

index 506c13bb3cbca05ecdbc40cc587f911e720b6f08..5c4ad9095733785c0f2f0bf936447ffdca5de97e 100644 (file)
--- a/src/main.rs
+++ b/src/main.rs
@@ -75,12 +75,34 @@ fn set_cookie(mut response: cgi::Response, path: &str) -> Result<cgi::Response,
      Ok(response)
  }
  
-const HTML_HEADER: &str = "
+const HTML_HEADER: &str = "<!DOCTYPE html>
  <html>
    <head>
+    <meta charset=\"utf-8\">
+    <title>Vote!</title>
      <style>
-      input { transform: scale(1.5); }
+      input { transform: scale(1.5) }
+      div { animation: 2s infinite linear spin }
+      @keyframes spin {
+        from { transform:rotate(0) }
+        to { transform:rotate(1turn) }
+      }
      </style>
+    <script>
+      window.onload = function() {
+        for (cb of document.getElementsByTagName('input')) {
+          cb.addEventListener('click', (function(cb) {
+            return function() {
+              cb.style.display = 'none'
+              const spin = document.createElement('div')
+              spin.appendChild(document.createTextNode('⏳'))
+              cb.parentElement.insertBefore(spin, cb)
+            }
+          })(cb))
+          cb.disabled = false
+        }
+      }
+    </script>
    </head>
    <body>
      <table>";
@@ -97,7 +119,9 @@ fn prompt_for_vote(dir: PathBuf, request: cgi::Request) -> Result<cgi::Response,
          200,
          std::iter::once(Ok(HTML_HEADER.to_owned()))
              .chain(std::io::BufReader::new(cfile).lines().map(|rc| {
-                rc.map(|c| format!("<tr><td><input type=\"checkbox\"></td><td>{c}</td></tr>"))
+                rc.map(|c| {
+                    format!("<tr><td><input type=\"checkbox\" disabled></td><td>{c}</td></tr>")
+                })
              }))
              .chain(std::iter::once(Ok(HTML_FOOTER.to_owned())))
              .collect::<std::io::Result<String>>()