diff --git a/src/allPages.ts b/src/allPages.ts index 39ffc4f..23fc0a2 100644 --- a/src/allPages.ts +++ b/src/allPages.ts @@ -17,7 +17,7 @@ import { TransitDecryptPage } from "./pages/Transit/TransitDecrypt.js"; import { TransitEncryptPage } from "./pages/Transit/TransitEncrypt.js"; import { TransitViewPage } from "./pages/Transit/TransitView.js"; import { TransitViewSecretPage } from "./pages/Transit/TransitViewSecret.js"; -import { UnsealPage } from "./pages/Unseal.js"; +import { UnsealPage } from "./pages/Unseal"; type pagesList = { [key: string]: Page diff --git a/src/api/getSealStatus.ts b/src/api/getSealStatus.ts index fdd4213..69ad0d2 100644 --- a/src/api/getSealStatus.ts +++ b/src/api/getSealStatus.ts @@ -1,6 +1,6 @@ import { appendAPIURL } from "./apiUtils"; -type SealStatusType = { +export type SealStatusType = { progress: number; t: number; sealed: boolean; diff --git a/src/elements/QRScanner.ts b/src/elements/QRScanner.ts index 8ca6b84..5aeb269 100644 --- a/src/elements/QRScanner.ts +++ b/src/elements/QRScanner.ts @@ -7,7 +7,7 @@ import QrScanner from 'qr-scanner'; import qrScannerWorkerSource from '!!raw-loader!qr-scanner/qr-scanner-worker.min.js'; QrScanner.WORKER_PATH = URL.createObjectURL(new Blob([qrScannerWorkerSource])); -interface QRScannerType extends HTMLElement { +export interface QRScannerType extends HTMLElement { deinit(): void; } diff --git a/src/pages/Template.js b/src/pages/Template.js deleted file mode 100644 index 5acf055..0000000 --- a/src/pages/Template.js +++ /dev/null @@ -1,24 +0,0 @@ -import { Page } from "../types/Page"; -import { changePage, setPageContent, setTitleElement } from "../pageUtils"; -import { makeElement } from "../htmlUtils"; -import { pageState } from "../globalPageState.ts"; - -export class TemplatePage extends Page { - constructor() { - super(); - } - goBack() { - changePage("HOME"); - } - async render() { - setTitleElement(pageState); - setPageContent(makeElement({ - tag: "p", - text: "[PLACEHOLDER]" - })); - } - - get name() { - return "Template"; - } -} diff --git a/src/pages/Unseal.js b/src/pages/Unseal.ts similarity index 68% rename from src/pages/Unseal.js rename to src/pages/Unseal.ts index c3c609e..1dc84ad 100644 --- a/src/pages/Unseal.js +++ b/src/pages/Unseal.ts @@ -1,8 +1,8 @@ import { MarginInline } from "../elements/MarginInline"; import { Page } from "../types/Page"; -import { QRScanner } from "../elements/QRScanner"; +import { QRScanner, QRScannerType } from "../elements/QRScanner"; +import { SealStatusType, getSealStatus } from "../api/getSealStatus"; import { changePage, setErrorText, setPageContent } from "../pageUtils"; -import { getSealStatus } from "../api/getSealStatus"; import { makeElement } from "../htmlUtils"; import { submitUnsealKey } from "../api/submitUnsealKey"; import i18next from 'i18next'; @@ -18,12 +18,21 @@ export class UnsealPage extends Page { super(); this.mode = UnsealInputModes.FORM_INPUT; } - cleanup() { - this.deinitWebcam() + + mode: string; + refresher: number; + qrScanner: QRScannerType; + unsealProgress: HTMLProgressElement; + unsealProgressText: HTMLParagraphElement; + unsealInputContent: HTMLElement; + unsealKeyForm: HTMLFormElement; + + cleanup(): void { + this.deinitWebcam(); clearInterval(this.refresher); } - deinitWebcam() { + deinitWebcam(): void { try { this.qrScanner.deinit(); } catch (_) { @@ -31,25 +40,25 @@ export class UnsealPage extends Page { } } - makeRefresher() { + makeRefresher(): void { this.refresher = setInterval(async function () { this.updateSealProgress(await getSealStatus()); - }.bind(this), 1000); + }.bind(this), 1000) as unknown as number; } - async render() { + async render(): Promise { this.unsealProgress = makeElement({ tag: "progress", class: "uk-progress", attributes: { value: "0", max: "0" } - }); + }) as HTMLProgressElement; this.unsealProgressText = makeElement({ tag: "p", text: i18next.t("unseal_keys_progress", { progress: "0", keys_needed: "0" }), - }); + }) as HTMLParagraphElement; this.unsealInputContent = makeElement({ tag: "div" - }) + }) as HTMLElement; setPageContent(makeElement({ tag: "div", children: [ @@ -68,11 +77,17 @@ export class UnsealPage extends Page { this.makeRefresher(); } - setButtons(method) { - let newMethod; - let buttonText; - newMethod = method == UnsealInputModes.FORM_INPUT ? UnsealInputModes.QR_INPUT : UnsealInputModes.FORM_INPUT; - buttonText = newMethod == UnsealInputModes.FORM_INPUT ? i18next.t("unseal_input_btn") : i18next.t("unseal_qr_btn"); + setButtons(method: string): void { + const newMethod: string = + method == UnsealInputModes.FORM_INPUT ? + UnsealInputModes.QR_INPUT + : + UnsealInputModes.FORM_INPUT; + const buttonText: string = + newMethod == UnsealInputModes.FORM_INPUT ? + i18next.t("unseal_input_btn") + : + i18next.t("unseal_qr_btn"); this.unsealInputContent.appendChild(makeElement({ tag: "button", class: ["uk-button", "uk-button-primary"], @@ -84,7 +99,7 @@ export class UnsealPage extends Page { } - switchInputMode(method) { + switchInputMode(method: string): void { this.deinitWebcam(); this.unsealInputContent.querySelectorAll('*').forEach(n => n.remove()) if (method == UnsealInputModes.FORM_INPUT) this.makeUnsealForm(); @@ -92,7 +107,7 @@ export class UnsealPage extends Page { this.setButtons(method); } - makeUnsealForm() { + makeUnsealForm(): void { this.unsealKeyForm = makeElement({ tag: "form", children: [ @@ -112,7 +127,7 @@ export class UnsealPage extends Page { text: i18next.t("submit_key_btn") })), ] - }); + }) as HTMLFormElement; this.unsealInputContent.appendChild(this.unsealKeyForm); this.unsealKeyForm.addEventListener("submit", function (e) { e.preventDefault(); @@ -120,23 +135,23 @@ export class UnsealPage extends Page { }.bind(this)); } - async makeQRInput() { - this.qrScanner = await QRScanner(function (code) { + async makeQRInput(): Promise { + this.qrScanner = await QRScanner(function (code: string) { this.submitKey(code); console.log('decoded qr code:', code) }.bind(this)); this.unsealInputContent.appendChild(this.qrScanner); } - updateSealProgress(data) { - let progress = data.progress; - let keysNeeded = data.t; - let text = this.unsealProgressText; + updateSealProgress(data: SealStatusType): void { + const progress = data.progress; + const keysNeeded = data.t; + const text = this.unsealProgressText; text.innerText = i18next.t("unseal_keys_progress", { progress: String(progress), keys_needed: String(keysNeeded) }); - let progressBar = this.unsealProgress; + const progressBar = this.unsealProgress; progressBar.value = progress; progressBar.max = keysNeeded; if (!data.sealed) { @@ -145,7 +160,7 @@ export class UnsealPage extends Page { } } - submitKey(key) { + submitKey(key: string): void { submitUnsealKey(key).then(_ => { getSealStatus().then(data => { this.updateSealProgress(data); @@ -155,12 +170,12 @@ export class UnsealPage extends Page { }); } - async handleKeySubmit() { - let formData = new FormData(this.unsealKeyForm); + async handleKeySubmit(): Promise { + const formData = new FormData(this.unsealKeyForm); - this.submitKey(formData.get("key")) + this.submitKey(formData.get("key") as string) } - get name() { + get name(): string { return i18next.t("unseal_vault_text"); } } \ No newline at end of file