diff --git a/src/js/main.js b/src/js/main.js
index ae0040a7f267a531f7629e196c741d4e4f9cc383..f736df9e876c388a9aad6157603ef6ac42b7f028 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -1,5 +1,16 @@
import {Html5Qrcode} from "html5-qrcode";
+import {
+ ed448
+} from "@noble/curves/ed448";
+import {
+ Buffer
+} from "buffer";
+
+function htoa(h) {
+ return Uint8Array.from(Buffer.from(h,"hex"));
+}
+
var received_items = {};
var scanner = new Html5Qrcode("reader",{});
var scanner_audio = new Audio("/beep.wav");
@@ -15,6 +26,7 @@ function updateItemsView() {
}
}
+
export async function addItemTag(form) {
if (form.value.length == 6) {
var response = await fetch("http://127.0.0.1:8000/tag/"+form.value);
@@ -83,3 +95,25 @@ export async function loadStorages() {
}
}
+
+async function onRecevierScanSuccess(scannedCode) {
+ var [uuid,signature] = scannedCode.split("/");
+ scanner_audio.play();
+ await scanner.stop();
+
+ var response = await fetch("http://127.0.0.1:8000/item/"+uuid);
+ if (response.status == 200) {
+ var tracking_item = await response.json();
+ if (ed448.verify(htoa(signature),new TextEncoder().encode(tracking_item.uuid),htoa(tracking_item.verification))) {
+ document.querySelector("#uuid").innerHTML = tracking_item.uuid;
+ document.querySelector("#tag").innerHTML = tracking_item.tag;
+ document.querySelector("#storage").innerHTML = tracking_item.storage;
+ document.querySelector("#addressee").innerHTML = tracking_item.addressee;
+ document.querySelector("#team").innerHTML = tracking_item.team;
+ }
+ }
+}
+
+export async function scanReceiver() {
+ scanner.start({ facingMode: "user" }, { fps: 10, qrbox: { width: 250, height: 250 } }, onRecevierScanSuccess);
+}
diff --git a/src/views/checkout.html b/src/views/checkout.html
new file mode 100644
index 0000000000000000000000000000000000000000..55dd80df34ed2e3e9909d52793157be7cfb0b0bb
--- /dev/null
+++ b/src/views/checkout.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <title>Paketshop: Checkout</title>
+ <module href="/components/head.html"></module>
+ </head>
+
+ <body>
+ <div class="container">
+ <h1>Checkout</h1>
+ <div class="row">
+ <button onclick="lib.scanReceiver()" class="btn btn-primary">Scan Code</button>
+ </div>
+ <div class="row">
+ <div id="reader" style="width: 500px; margin 0 auto;"></div>
+ </div>
+ <div class="row">
+ <h2 id="uuid"></h2>
+ <div class="col-md-6">
+ <strong id="storage"></strong><br>
+ <span id="tag"></span>
+ </div>
+ <div class="col-md-6">
+ <strong id="addressee"></strong><br>
+ <span id="team"></span>
+ </div>
+ </div>
+ </div>
+ <module href="/components/foot.html"></module>
+ </body>
+</html>