mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-10-08 12:28:12 +08:00
Fix Bezier-rs interactive demos and migrate its Webpack bundler to Vite
This commit is contained in:
@@ -1,7 +1,9 @@
|
||||
import { WasmBezier } from "@/../wasm/pkg";
|
||||
import bezierFeatures, { BezierFeatureKey } from "@/features/bezier-features";
|
||||
import type { BezierFeatureKey } from "@/features/bezier-features";
|
||||
import bezierFeatures from "@/features/bezier-features";
|
||||
import { renderDemo } from "@/utils/render";
|
||||
import { getConstructorKey, getCurveType, BezierCallback, BezierCurveType, InputOption, WasmBezierManipulatorKey, Demo } from "@/utils/types";
|
||||
import type { BezierCallback, BezierCurveType, InputOption, WasmBezierManipulatorKey, Demo } from "@/utils/types";
|
||||
import { getConstructorKey, getCurveType } from "@/utils/types";
|
||||
|
||||
const SELECTABLE_RANGE = 10;
|
||||
|
||||
@@ -54,8 +56,7 @@ class BezierDemo extends HTMLElement implements Demo {
|
||||
this.render();
|
||||
|
||||
const figure = this.querySelector("figure") as HTMLElement;
|
||||
const wasm = await import("@/../wasm/pkg");
|
||||
this.bezier = wasm.WasmBezier[getConstructorKey(curveType)](this.points);
|
||||
this.bezier = WasmBezier[getConstructorKey(curveType)](this.points);
|
||||
this.drawDemo(figure);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
import bezierFeatures, { BezierFeatureKey } from "@/features/bezier-features";
|
||||
import type { BezierFeatureKey } from "@/features/bezier-features";
|
||||
import bezierFeatures from "@/features/bezier-features";
|
||||
import { renderDemoPane } from "@/utils/render";
|
||||
import { BezierCurveType, BEZIER_CURVE_TYPE, BezierDemoOptions, InputOption, Demo, DemoPane, BezierDemoArgs } from "@/utils/types";
|
||||
import type { BezierCurveType, BezierDemoOptions, InputOption, DemoPane, BezierDemoArgs } from "@/utils/types";
|
||||
import { BEZIER_CURVE_TYPE } from "@/utils/types";
|
||||
|
||||
const demoDefaults = {
|
||||
Linear: {
|
||||
@@ -66,7 +68,7 @@ class BezierDemoPane extends HTMLElement implements DemoPane {
|
||||
renderDemoPane(this);
|
||||
}
|
||||
|
||||
buildDemo(demo: BezierDemoArgs): Demo {
|
||||
buildDemo(demo: BezierDemoArgs): HTMLElement {
|
||||
const bezierDemo = document.createElement("bezier-demo");
|
||||
bezierDemo.setAttribute("title", demo.title);
|
||||
bezierDemo.setAttribute("points", JSON.stringify(demo.points));
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import { WasmSubpath } from "@/../wasm/pkg";
|
||||
import subpathFeatures, { SubpathFeatureKey } from "@/features/subpath-features";
|
||||
import type { SubpathFeatureKey } from "@/features/subpath-features";
|
||||
import subpathFeatures from "@/features/subpath-features";
|
||||
import { renderDemo } from "@/utils/render";
|
||||
|
||||
import { SubpathCallback, WasmSubpathInstance, WasmSubpathManipulatorKey, InputOption } from "@/utils/types";
|
||||
import type { SubpathCallback, WasmSubpathInstance, WasmSubpathManipulatorKey, InputOption } from "@/utils/types";
|
||||
|
||||
const SELECTABLE_RANGE = 10;
|
||||
const POINT_INDEX_TO_MANIPULATOR: WasmSubpathManipulatorKey[] = ["set_anchor", "set_in_handle", "set_out_handle"];
|
||||
@@ -48,8 +48,7 @@ class SubpathDemo extends HTMLElement {
|
||||
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.subpath = WasmSubpath.from_triples(this.triples, this.closed) as WasmSubpathInstance;
|
||||
this.drawDemo(figure);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import subpathFeatures, { SubpathFeatureKey } from "@/features/subpath-features";
|
||||
import type { SubpathFeatureKey } from "@/features/subpath-features";
|
||||
import subpathFeatures from "@/features/subpath-features";
|
||||
import { renderDemoPane } from "@/utils/render";
|
||||
import { Demo, DemoPane, SubpathDemoArgs, SubpathInputOption } from "@/utils/types";
|
||||
import type { DemoPane, SubpathDemoArgs, SubpathInputOption } from "@/utils/types";
|
||||
|
||||
class SubpathDemoPane extends HTMLElement implements DemoPane {
|
||||
// Props
|
||||
@@ -56,7 +57,7 @@ class SubpathDemoPane extends HTMLElement implements DemoPane {
|
||||
renderDemoPane(this);
|
||||
}
|
||||
|
||||
buildDemo(demo: SubpathDemoArgs): Demo {
|
||||
buildDemo(demo: SubpathDemoArgs): HTMLElement {
|
||||
const subpathDemo = document.createElement("subpath-demo");
|
||||
subpathDemo.setAttribute("title", demo.title);
|
||||
subpathDemo.setAttribute("triples", JSON.stringify(demo.triples));
|
||||
|
||||
Reference in New Issue
Block a user