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 <contact.chengthomas@gmail.com>
This commit is contained in:
Rob Nadal 2023-03-06 22:08:41 -05:00 committed by Keavon Chambers
parent c8a7e58bd5
commit 2e3495aa0e
2 changed files with 6 additions and 5 deletions

View file

@ -51,7 +51,7 @@ class BezierDemo extends HTMLElement implements Demo {
}
}
connectedCallback(): void {
async connectedCallback(): Promise<void> {
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);
}

View file

@ -48,7 +48,7 @@ class SubpathDemo extends HTMLElement {
}
}
connectedCallback(): void {
async connectedCallback(): Promise<void> {
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);
}