simplify stuff with pointers + 'using' keyword

Author: Benedikt Strehle

backend/entrypoint.tsx

@@ -2,6 +2,19 @@ const ed = await import("https://unpkg.com/@noble/ed25519@2.0.0/index.js");
 const base32 = await import("https://cdn.jsdelivr.net/npm/hi-base32@0.5.1/+esm");
 await import("https://cdn.jsdelivr.net/npm/js-sha3@0.9.2/src/sha3.min.js");
 
+
+export type AddressData = {
+    address: string;
+    public: {
+        raw: Uint8Array;
+        b64: string;
+    };
+    private: {
+        raw: Uint8Array;
+        b64: string;
+    };
+}
+
 declare const sha3_256: any;
 type KeyPair = {
 	private: PrivateKey,
@@ -23,15 +36,15 @@ class PrivateKey {
 	}
 }
 
-const generateKeys = async (privateKey = ed.utils.randomPrivateKey()): Promise<KeyPair> => {
+async function generateKeys(privateKey = ed.utils.randomPrivateKey()): Promise<KeyPair> {
 	const publicKey = await ed.getPublicKeyAsync(privateKey);
 	return {
 		private: new PrivateKey(privateKey),
 		public: new PublicKey(publicKey)
 	};
 }
 
-const getPublicKey = (address: string) => {
+function getPublicKey(address: string) {
 	if (!/\.onion$/i.test(address) || address.length != 56 + 6)
 		throw new Error("Invalid length");
 	const base32Encoded = address.substring(0, address.length - 6).toUpperCase();
@@ -55,7 +68,7 @@ const getPublicKey = (address: string) => {
 	return new PublicKey(new Uint8Array(publicKey));
 }
 
-const generateOnionV3 = async (keys: KeyPair | Promise<KeyPair> = generateKeys()) => {
+async function generateOnionV3(keys: KeyPair | Promise<KeyPair> = generateKeys()):Promise<AddressData> {
 	keys = await keys;
 
 	const publicKey = keys.public.value;
@@ -87,7 +100,7 @@ const generateOnionV3 = async (keys: KeyPair | Promise<KeyPair> = generateKeys()
 	}
 }
 
-export const generateVanityAddress = async (prefix?: string) => {
+export async function generateVanityAddress(prefix?: string) {
 	let onion = await generateOnionV3();
 	while (prefix && !onion.address.startsWith(prefix))
 		onion = await generateOnionV3();

common/TOR-Worker.ts

@@ -69,7 +69,7 @@
 				flex-direction: column;
 			}
 		}
-		&>.tor {
+		&>#tor {
 			span {
 				max-width: 1000px;
 				margin: auto;

common/components/MainPage.scss

@@ -1,56 +1,74 @@
-import { Path } from "uix/utils/path.ts";
 import { UIX } from "uix";
-import { spawnThreads, spawnThread, disposeThread } from "unyt_core/threads/threads.ts";
+import { spawnThreads, spawnThread } from "unyt_core/threads/threads.ts";
+import { always, map } from "unyt_core/functions.ts";
+import type { AddressData } from "common/TOR-Worker.ts";
 
 @UIX.template(function(this: MainPage) {
 	return <div>
-		<div class="tor">
-			<h2>Multi-Threading TOR Address</h2>
-			<input id="torAddress" maxlength={3} type={"text"} placeholder={"Prefix of vanity address"}/>
+		<div id="tor" class={always(()=>this.calculatingAddress?'hidden':'')}>
+			<h2>Create TOR Address</h2>
+			<input id="torAddress" maxlength="3" type="text" placeholder="Prefix of vanity address" value={this.$.addressPrefix}/>
 			<div onclick={() => this.createVanityAddress()} class="button">Compute</div>
-			<section class="results"></section>
+			<section class="results">
+				{map(this.resultAddresses, address =>
+					<span>
+						<a>{address.address}</a>
+						<b>Pub: {address.public.b64}</b>
+						<b>Priv: {address.private.b64}</b>
+					</span>
+				)}
+			</section>
 		</div>
-		<div class="pi">
-			<h2>How many digits of PI to calculate?</h2>
-			<input id="inputPiDigits" type={"number"} placeholder={"Input number"}/>
+		<div id="pi" class={always(()=>this.calculatingPI?'hidden':'')}>
+			<h2>Calculate PI</h2>
+			<input id="inputPiDigits" type="number" placeholder="Number of digits" value={this.$.piDigits}/>
 			<div onclick={() => this.computePI()} class="button">Compute</div>
-			<section class="results"></section>
+			<section class="results">
+				{map(this.resultPIs, pi =>
+					<span>{pi}</span>
+				)}
+			</section>
 		</div>
 	</div>
 })
 export class MainPage extends UIX.BaseComponent {
-	@id declare inputPiDigits: HTMLInputElement;
-	@id declare torAddress: HTMLInputElement;
+	
+	// references properties to read input values
+	@property piDigits = 5;
+	@property addressPrefix = "";
+
+	// reference properties to get calculation state
+	@property calculatingPI = false
+	@property calculatingAddress = false
+
+	// arrays containing history of calculated results
+	@property resultPIs:string[] = []
+	@property resultAddresses:AddressData[] = []
 
 	async createVanityAddress() {
-		const parent = this.torAddress.parentElement!;
-		if (parent.classList.contains("hidden"))
-			return;
-		parent.classList.add("hidden");
-
-		const threads = await spawnThreads<typeof import('../TOR-Worker.ts')>(new Path('../TOR-Worker.ts'), 10);
-		const calculations = threads.map(thread => thread.generateVanityAddress(this.torAddress.value));
-		const result = await Promise.any(calculations);
-		console.log("Found address", result);
-		parent.querySelector("section")!.prepend(<span>
-			<a>{result.address}</a>
-			<b>Pub: {result.public.b64}</b>
-			<b>Priv: {result.private.b64}</b>
-		</span>)
-		parent.classList.remove("hidden");
-		disposeThread(...threads);
+		this.calculatingAddress = true;
+
+		// spawn 10 new threads
+		using threads = await spawnThreads<typeof import('../TOR-Worker.ts')>('../TOR-Worker.ts', 10);
+		// try to find an address in parallel
+		const address = await Promise.any(
+			threads.map(thread => thread.generateVanityAddress(this.addressPrefix))
+		);
+		this.resultAddresses.unshift(address);
+		
+		this.calculatingAddress = false;
 	}
 
 	async computePI() {
-		const parent = this.inputPiDigits.parentElement!;
-		if (parent.classList.contains("hidden"))
-			return;
-		parent.classList.add("hidden");
-
-		const thread = await spawnThread<typeof import('../PI-Worker.ts')>(new Path('../PI-Worker.ts'));
-		const pi = await thread.calculatePI(+this.inputPiDigits.value || 10);
-		parent.querySelector("section")!.prepend(<span>{pi}</span>)
-		parent.classList.remove("hidden");
-		disposeThread(thread);
+		this.calculatingPI = true;
+
+		// spawn a new thread
+		using thread = await spawnThread<typeof import('../PI-Worker.ts')>('../PI-Worker.ts');
+		// calculate pi in the thread
+		const pi = await thread.calculatePI(this.piDigits);
+		this.resultPIs.unshift(pi);
+
+		this.calculatingPI = false;
+
 	}
-}
+}