From 488bb3cd32785a8030b935bf90b9a7d0a84ef5cc Mon Sep 17 00:00:00 2001
From: Dominik Hebeler <dominik@hebeler.club>
Date: Tue, 18 Jul 2023 16:56:53 +0200
Subject: [PATCH] trigger password storage when logging in

---
 pass/public/js/create.js           | 22 ++++++++++++++++++----
 pass/public/styles/key/create.less | 16 +++++++++++-----
 pass/resources/js/base.js          |  1 -
 pass/resources/js/enter.js         | 11 ++++++++++-
 pass/routes/key.js                 | 12 ++++++++++++
 pass/views/login/create.ejs        | 13 ++++++++-----
 pass/views/login/key.ejs           |  4 ++--
 7 files changed, 61 insertions(+), 18 deletions(-)

diff --git a/pass/public/js/create.js b/pass/public/js/create.js
index 0b08fa6..92d8ec3 100644
--- a/pass/public/js/create.js
+++ b/pass/public/js/create.js
@@ -1,17 +1,26 @@
 let container = document.getElementById("create");
-let keyContainer = document.getElementById("key");
+let keyContainer = document.getElementById("new_key");
 let initializeButton = document.querySelector("div.initialize > button");
+let copy_key_button = document.querySelector(".key.copy-group > button");
+document.getElementById("key").remove();
+let key_password_field = document.createElement("input");
+key_password_field.type = "password";
+key_password_field.id = "key";
+key_password_field.name = "key";
+document.getElementById("charge-form").appendChild(key_password_field);
+
 let key = keyContainer.dataset.key;
 
 let characters = ["a", "b", "c", "d", "e", "f", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
 
 container.dataset.state = "initialize";
 keyContainer.parentNode.querySelector("button.button").classList.add("disabled");
+key_password_field.value = key;
 
-let runtime = 5000; // Runtime in milliseconds
+let runtime = 2500; // Runtime in milliseconds
 let starttime = Date.now();
 
-initializeButton.addEventListener("click", () => {
+initializeButton.addEventListener("click", e => {
     starttime = Date.now();
     container.dataset.state = "processing";
     generateRandomKey(0);
@@ -46,4 +55,9 @@ function generateRandomKey(skip) {
         random_key += character;
     }
     keyContainer.value = random_key;
-}
\ No newline at end of file
+}
+
+copy_key_button.addEventListener("click", e => {
+    e.preventDefault();
+    console.log("test");
+});
\ No newline at end of file
diff --git a/pass/public/styles/key/create.less b/pass/public/styles/key/create.less
index fff98bd..9f66c52 100644
--- a/pass/public/styles/key/create.less
+++ b/pass/public/styles/key/create.less
@@ -13,6 +13,7 @@
   > div.initialize {
     display: grid;
     gap: 1rem;
+
     > button {
       margin: 0 auto;
       padding-block: 0.5rem;
@@ -84,9 +85,14 @@
   > hr {
     width: 100%;
   }
-  > a.button {
-    margin: 0 auto;
-    font-size: clamp(12px, 4vw, 16px);
+  > #charge-form {
+    > input#key {
+      display: none;
+    }
+    > button {
+      margin: 0 auto;
+      font-size: clamp(12px, 4vw, 16px);
+    }
   }
 
   &[data-state="initialize"] {
@@ -94,7 +100,7 @@
     > div#processing-description,
     > div#store,
     > hr,
-    > a.button {
+    > form#charge-form {
       display: none;
     }
   }
@@ -108,7 +114,7 @@
     > div.initialize,
     > div#store,
     > hr,
-    > a.button {
+    > form#charge-form {
       display: none;
     }
   }
diff --git a/pass/resources/js/base.js b/pass/resources/js/base.js
index 90244d1..0c50b67 100644
--- a/pass/resources/js/base.js
+++ b/pass/resources/js/base.js
@@ -16,7 +16,6 @@ document.querySelectorAll(".share").forEach((element) => {
 document.querySelectorAll(".copy").forEach((element) => {
   element.classList.add("active");
   element.addEventListener("click", event => {
-    event.preventDefault();
     let target = document.getElementById(element.dataset.target);
     target.focus();
     target.setSelectionRange(0, target.value.length);
diff --git a/pass/resources/js/enter.js b/pass/resources/js/enter.js
index 1fecbb9..86397c9 100644
--- a/pass/resources/js/enter.js
+++ b/pass/resources/js/enter.js
@@ -63,4 +63,13 @@ function stopScanning() {
     scanner.stop();
     scanner.destroy();
     container.style.display = "none";
-}
\ No newline at end of file
+}
+
+// Make Password field show key as cleartext
+let key_input = document.getElementById("key");
+key_input.addEventListener("focus", () => {
+    key_input.type = "text";
+});
+key_input.addEventListener("blur", () => {
+    key_input.type = "password";
+});
\ No newline at end of file
diff --git a/pass/routes/key.js b/pass/routes/key.js
index 200f709..50e2b65 100644
--- a/pass/routes/key.js
+++ b/pass/routes/key.js
@@ -42,6 +42,15 @@ router.get("/create", function (req, res, next) {
   });
 });
 
+router.post("/create", (req, res) => {
+  let key = req.body.key;
+  Key.GET_KEY(key, false).then((key) => {
+    res.redirect(
+      `${res.locals.baseDir}/key/` + encodeURIComponent(key.get_key()) + "#charge"
+    );
+  });
+});
+
 router.get("/remove", (req, res) => {
   if (req.cookies.key) {
     res.clearCookie("key");
@@ -76,6 +85,9 @@ router.get("/enter", function (req, res, next) {
     });
   } else {
     // If the user is using a URL Parameter on MetaGer to use his key there might be a key in the referer
+    if (typeof req.headers.referer === "undefined") {
+      res.render("login/key");
+    }
     let matches = req.header("referer").match(/\?.*key=([0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12})/);
     if (matches) {
       let key_from_referer = matches[1];
diff --git a/pass/views/login/create.ejs b/pass/views/login/create.ejs
index e80d616..4a66f08 100644
--- a/pass/views/login/create.ejs
+++ b/pass/views/login/create.ejs
@@ -6,12 +6,12 @@
   <h2>1. <%= req.t("generate.first_step", {ns: "login"}) _%></h2>
   <div class="initialize">
     <div><%= req.t("generate.initialize.description", {ns: "login"}) _%></div>
-    <button class="button"><%= req.t("generate.initialize.button", {ns: "login"}) _%></button>
+    <button type="button" class="button"><%= req.t("generate.initialize.button", {ns: "login"}) _%></button>
   </div>
   <div class="copy-group key">
-    <label for="key"><%= req.t("title", {ns: "pageheader"}) _%></label>
-    <input type="text" name="key" id="key" value="<%= key.get_key() _%>" data-key="<%= key.get_key() _%>" readonly>
-    <button class="copy button" data-target="key"><%= req.t("generate.copy-key", {ns: "login"}) _%></button>
+    <label for="new_key"><%= req.t("title", {ns: "pageheader"}) _%></label>
+    <input type="text" name="new_key" id="new_key" value="<%= key.get_key() _%>" data-key="<%= key.get_key() _%>" readonly>
+    <button type="submit" form="charge-form" class=" copy button" data-target="new_key"><%= req.t("generate.copy-key", {ns: "login"}) _%></button>
   </div>
   <div id="processing-description"><%= req.t("generate.processing.description", {ns: "login"}) _%></div>
   <div id="store">
@@ -24,6 +24,9 @@
     </div>
   </div>
   <hr>
-  <a class="button" href="<%= baseDir _%>/key/<%= key.get_key() _%>#charge"><%= req.t("generate.next", {ns: "login"}) _%> <%= req.t("howitworks.steps.1.heading", {ns: "index"}) _%></a>
+  <form id="charge-form" method="post">
+    <input type="hidden" name="key" id="key" value="<%= key.get_key() %>">
+    <button type="submit" id="next-step" class="button"><%= req.t("generate.next", {ns: "login"}) _%> <%= req.t("howitworks.steps.1.heading", {ns: "index"}) _%></a>
+  </form>
 
   <%- include('../templates/page_footer'); -%>
\ No newline at end of file
diff --git a/pass/views/login/key.ejs b/pass/views/login/key.ejs
index 7441d54..f1a9a52 100644
--- a/pass/views/login/key.ejs
+++ b/pass/views/login/key.ejs
@@ -9,8 +9,8 @@
         <a href="<%= baseDir %>" class="hint-icon">?</a>
       </h3>
       <form id="key-form" action="<%= baseDir _%>/key/enter" method="post" enctype="multipart/form-data">
-        <input type="text" name="key" id="key" placeholder="<%=
-        req.t("key-input.placeholder", {ns: "login"}) _%>" />
+        <input type="password" name="key" id="key" placeholder="<%=
+        req.t("key-input.placeholder", {ns: "login"}) _%>" autofocus />
       </form>
     </div>
     <div id="file-option" class="enter-option">
-- 
GitLab