[taler-wallet-core] 02/02: fix #7090 dowload personal info as PDF

[gnunet]

This is an automated email from the git hooks/post-receive script.

sebasjm pushed a commit to branch master
in repository wallet-core.

commit cc01417a9983111fed775d80edef53e07f25aa9d
Author: Sebastian <sebasjm@gmail.com>
AuthorDate: Fri Jun 24 13:27:39 2022 -0300

    fix #7090 dowload personal info as PDF
---
 packages/anastasis-webui/clean_and_build.sh        |  3 +--
 packages/anastasis-webui/html/ui-dev.html          | 26 ++++++++++----------
 packages/anastasis-webui/package.json              |  4 ++--
 .../src/pages/home/AttributeEntryScreen.tsx        | 28 ++++++++++++++++++++--
 4 files changed, 42 insertions(+), 19 deletions(-)

diff --git a/packages/anastasis-webui/clean_and_build.sh 
b/packages/anastasis-webui/clean_and_build.sh
index c0e93e47..5f308e67 100755
--- a/packages/anastasis-webui/clean_and_build.sh
+++ b/packages/anastasis-webui/clean_and_build.sh
@@ -54,12 +54,11 @@ if [ "WATCH" == "$1" ]; then
   echo watch mode
   echo Writting any file in the src directory will trigger a browser reload.
   echo Be sure that the watcher server is running.
+  echo ./watch/serve.sh
   inotifywait -e close_write -r src -q -m | while read line; do
     echo $(date) $line
     build_js src/main.ts
     bundle ui-dev
-    #CONTENT=$(echo 'alert("hola")' | base64)
     ./watch/send.sh '{"type":"RELOAD"}'
-    #./watch/send.sh '{"type":"UPDATE","content":"'$CONTENT'"}'
   done;
 fi
diff --git a/packages/anastasis-webui/html/ui-dev.html 
b/packages/anastasis-webui/html/ui-dev.html
index 5b1dd31c..2790d567 100644
--- a/packages/anastasis-webui/html/ui-dev.html
+++ b/packages/anastasis-webui/html/ui-dev.html
@@ -14,7 +14,7 @@
       
href="data:;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAABILAAASCwAAAAAAAAAAAAD///////////////////////////////////////////////////////////////////////////////////////////////////7//v38//78/P/+/fz//vz7///+/v/+/f3//vz7///+/v/+/fz//v38///////////////////////+/v3///7+/////////////////////////////////////////////////////////v3//v79///////+/v3///////r28v/ct5//06SG/9Gffv/Xqo7/7N/V/9e2nf/bsJb/6uDW/9Sskf/euKH/+/j2///////+/v3//////+3azv+/eE3/2rWd/9Kkhv/Vr5T/48i2/8J+VP/
 [...]
     />
     <link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" />
-    <style type="text/css">
+    <style id="style-id" type="text/css">
       /* <![CDATA[ */
       ANASTASIS_STYLE_CONTENT
       /* <![CDATA[ */
@@ -29,7 +29,7 @@
     <script type="application/javascript">
       function setupLiveReload() {
         const socketPath = `ws://localhost:8003/socket`;
-        console.log("connecting to ", socketPath)
+        console.log("connecting to ", socketPath);
         const ws = new WebSocket(socketPath);
         ws.onmessage = (message) => {
           const event = JSON.parse(message.data);
@@ -40,23 +40,23 @@
             window.location.reload();
           }
           if (event.type === "UPDATE") {
-            document.body.removeChild(document.getElementById("container"))
-            const d = document.createElement('div')
-            d.setAttribute('id',"container")
-            d.setAttribute('class',"anastasis-container");
-            document.body.appendChild(d)
-            const s = document.createElement('script')
-            s.setAttribute('id',"code")
-            s.setAttribute('type',"application/javascript");
-            s.textContent = atob(event.content)
-            document.body.appendChild(s)
+            document.body.removeChild(document.getElementById("container"));
+            const d = document.createElement("div");
+            d.setAttribute("id", "container");
+            d.setAttribute("class", "anastasis-container");
+            document.body.appendChild(d);
+            const s = document.createElement("script");
+            s.setAttribute("id", "code");
+            s.setAttribute("type", "application/javascript");
+            s.textContent = atob(event.content);
+            document.body.appendChild(s);
           }
         };
         ws.onerror = (error) => {
           console.error(error);
         };
         ws.onclose = (e) => {
-          setTimeout(setupLiveReload, 500)
+          setTimeout(setupLiveReload, 500);
         };
       }
       setupLiveReload();
diff --git a/packages/anastasis-webui/package.json 
b/packages/anastasis-webui/package.json
index 551ae54b..949440bc 100644
--- a/packages/anastasis-webui/package.json
+++ b/packages/anastasis-webui/package.json
@@ -6,7 +6,7 @@
   "scripts": {
     "build": "./clean_and_build.sh",
     "compile": "tsc",
-    "dev": "./dev.mjs",
+    "dev": "./clean_and_build.sh WATCH",
     "prepare": "pnpm compile",
     "lint": "eslint 'src/**/*.{js,jsx,ts,tsx}'",
     "test": "mocha --enable-source-maps 'dist/**/*test.js'",
@@ -49,4 +49,4 @@
     "typescript": "^4.5.4",
     "ws": "7.4.5"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx 
b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
index ed46aa09..228186a2 100644
--- a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
+++ b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
@@ -94,6 +94,25 @@ export function AttributeEntryScreen(): VNode {
     });
   };
 
+  function saveAsPDF(): void {
+    const printWindow = window.open("", "", "height=400,width=800");
+    const divContents = document.getElementById("printThis");
+    const styleContents = document.getElementById("style-id");
+
+    if (!printWindow || !divContents || !styleContents) return;
+    printWindow.document.write(
+      "<html><head><title>Anastasis Recovery Document</title><style>",
+    );
+    printWindow.document.write(styleContents.innerHTML);
+    printWindow.document.write("</style></head><body>&nbsp;</body></html>");
+    printWindow.document.close();
+    printWindow.document.body.appendChild(divContents.cloneNode(true));
+    printWindow.addEventListener("load", () => {
+      printWindow.print();
+      printWindow.close();
+    });
+  }
+
   return (
     <AnastasisClientFrame
       title={withProcessLabel(reducer, "Who are you?")}
@@ -112,11 +131,16 @@ export function AttributeEntryScreen(): VNode {
           You personal information is used to define the location where your
           secret will be safely stored. If you forget what you have entered or
           if there is a misspell you will be unable to recover your secret.
+          <p>
+            <a onClick={saveAsPDF}>Save the personal information as PDF</a>
+          </p>
         </ConfirmModal>
-      ) : null}
+      ) : undefined}
 
       <div class="columns" style={{ maxWidth: "unset" }}>
-        <div class="column">{fieldList}</div>
+        <div class="column" id="printThis">
+          {fieldList}
+        </div>
         <div class="column">
           <p>This personal information will help to locate your secret.</p>
           <h1 class="title">This stays private</h1>

-- 
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.