From 2e3495aa0ee7f3d88d513be3c563011bcec173d4 Mon Sep 17 00:00:00 2001 From: Rob Nadal Date: Mon, 6 Mar 2023 22:08:41 -0500 Subject: [PATCH] Bezier-rs: Made wasm imports async in demos (#1071) * Made wasm imports async in demos * remove hidden characters to pass linting * Swapped import to use async / await --------- Co-authored-by: Thomas Cheng --- website/other/bezier-rs-demos/src/components/BezierDemo.ts | 5 +++-- website/other/bezier-rs-demos/src/components/SubpathDemo.ts | 6 +++--- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/website/other/bezier-rs-demos/src/components/BezierDemo.ts b/website/other/bezier-rs-demos/src/components/BezierDemo.ts index 4ff6a0e7..6a600377 100644 --- a/website/other/bezier-rs-demos/src/components/BezierDemo.ts +++ b/website/other/bezier-rs-demos/src/components/BezierDemo.ts @@ -51,7 +51,7 @@ class BezierDemo extends HTMLElement implements Demo { } } - connectedCallback(): void { + async connectedCallback(): Promise { this.title = this.getAttribute("title") || ""; this.points = JSON.parse(this.getAttribute("points") || "[]"); this.key = this.getAttribute("key") as BezierFeatureKey; @@ -63,13 +63,14 @@ class BezierDemo extends HTMLElement implements Demo { const curveType = getCurveType(this.points.length); this.manipulatorKeys = MANIPULATOR_KEYS_FROM_BEZIER_TYPE[curveType]; - this.bezier = WasmBezier[getConstructorKey(curveType)](this.points); this.activeIndex = undefined as number | undefined; this.sliderData = Object.assign({}, ...this.sliderOptions.map((s) => ({ [s.variable]: s.default }))); this.sliderUnits = Object.assign({}, ...this.sliderOptions.map((s) => ({ [s.variable]: s.unit }))); this.render(); const figure = this.querySelector("figure") as HTMLElement; + const wasm = await import("@/../wasm/pkg"); + this.bezier = wasm.WasmBezier[getConstructorKey(curveType)](this.points); this.drawDemo(figure); } diff --git a/website/other/bezier-rs-demos/src/components/SubpathDemo.ts b/website/other/bezier-rs-demos/src/components/SubpathDemo.ts index 3fce09c4..1e6f16b6 100644 --- a/website/other/bezier-rs-demos/src/components/SubpathDemo.ts +++ b/website/other/bezier-rs-demos/src/components/SubpathDemo.ts @@ -48,7 +48,7 @@ class SubpathDemo extends HTMLElement { } } - connectedCallback(): void { + async connectedCallback(): Promise { this.title = this.getAttribute("title") || ""; this.triples = JSON.parse(this.getAttribute("triples") || "[]"); this.key = this.getAttribute("key") as SubpathFeatureKey; @@ -58,13 +58,13 @@ class SubpathDemo extends HTMLElement { this.tVariant = (this.getAttribute("tvariant") || "Parametric") as TVariant; this.callback = subpathFeatures[this.key].callback as SubpathCallback; - this.subpath = WasmSubpath.from_triples(this.triples, this.closed) as WasmSubpathInstance; this.sliderData = Object.assign({}, ...this.sliderOptions.map((s) => ({ [s.variable]: s.default }))); this.sliderUnits = Object.assign({}, ...this.sliderOptions.map((s) => ({ [s.variable]: s.unit }))); - this.render(); const figure = this.querySelector("figure") as HTMLElement; + const wasm = await import("@/../wasm/pkg"); + this.subpath = wasm.WasmSubpath.from_triples(this.triples, this.closed) as WasmSubpathInstance; this.drawDemo(figure); }