diff options
Diffstat (limited to 'packages')
-rwxr-xr-x | packages/anastasis-webui/clean_and_build.sh | 3 | ||||
-rw-r--r-- | packages/anastasis-webui/html/ui-dev.html | 26 | ||||
-rw-r--r-- | packages/anastasis-webui/package.json | 4 | ||||
-rw-r--r-- | packages/anastasis-webui/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 c0e93e47d..5f308e67c 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 5b1dd31cf..2790d5678 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/Qn3//3ryn/795Tf/WrpP/2LCW/8B6T//w4Nb///////Pn4P+/d0v/9u3n/+7d0v/EhV7//v///+HDr//fxLD/zph2/+TJt//8/Pv/woBX//Lm3f/y5dz/v3hN//bu6f/JjGn/4sW0///////Df1j/8OLZ//v6+P+/elH/+vj1//jy7f+/elL//////+zYzP/Eg13//////967p//MlHT/wn5X///////v4Nb/yY1s///////jw7H/06KG////////////z5t9/+fNvf//////x4pn//Pp4v/8+vn/w39X/8WEX///////5s/A/9CbfP//////27Oc/9y2n////////////9itlf/gu6f//////86Vdf/r2Mz//////8SCXP/Df1j//////+7d0v/KkG7//////+HBrf/VpYr////////////RnoH/5sq6///////Ii2n/8ubf//39/P/Cf1j/xohk/+bNvv//////wn5W//Tq4//58/D/wHxV//7+/f/59fH/v3xU//39/P/w4Nf/xIFb///////hw7H/yo9t/+/f1f/AeU3/+/n2/+nSxP/FhmD//////9qzm//Upon/4MSx/96+qf//////xINc/+3bz//48e3/v3hN//Pn3///////6M+//752S//gw6//06aK/8J+VP/kzLr/zZd1/8OCWv/q18r/17KZ/9Ooi//fv6r/v3dK/+vWyP///////v39///////27un/1aeK/9Opjv/m1cf/1KCC/9a0nP/n08T/0Jx8/82YdP/QnHz/16yR//jx7P///////v39///////+/f3///7+///////+//7//v7+///////+/v7//v/+/////////////////////////v7//v79///////////////////+/v/+/Pv//v39///+/v/+/Pv///7+//7+/f/+/Pv//v39//79/P/+/Pv///7+////////////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==" /> <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 551ae54bc..949440bc7 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 ed46aa095..228186a2d 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> </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> |