mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-10-08 06:48:13 +08:00
Bezier-rs: Refactor interactive demo to remove Vue (#959)
* Converted bezier example to vanilla js component * Indent with tabs * Add sliders * Converted bezier example pane to vanilla js * Implement the radio buttons + fixes * Converted SubpathExample to vanilla js * Converted SubpathExamplePane to vanilla js * Removed vue components * Remove App.vue * Remove vue and other dependencies * Minor fix in main.ts * Added insert to subpath features * Entry point tweaks * Rename "example" to "demo" * Kebab-case file names (except classes) Co-authored-by: Hannah Li <hannahli2010@gmail.com> Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
committed by
Keavon Chambers
co-authored by
Hannah Li
Keavon Chambers
parent
758f757783
commit
01853fe4b7
@@ -0,0 +1,60 @@
|
||||
import { tSliderOptions } from "@/utils/options";
|
||||
import { ComputeType, SliderOption, SubpathCallback, WasmSubpathInstance } from "@/utils/types";
|
||||
|
||||
const subpathFeatures = {
|
||||
Constructor: {
|
||||
callback: (subpath: WasmSubpathInstance): string => subpath.to_svg(),
|
||||
},
|
||||
Insert: {
|
||||
callback: (subpath: WasmSubpathInstance, options: Record<string, number>, _: undefined, computeType: ComputeType): string => subpath.insert(options.computeArgument, computeType),
|
||||
sliderOptions: [{ ...tSliderOptions, variable: "computeArgument" }],
|
||||
// TODO: Uncomment this after implementing the Euclidean version
|
||||
// chooseComputeType: true,
|
||||
},
|
||||
Length: {
|
||||
callback: (subpath: WasmSubpathInstance): string => subpath.length(),
|
||||
},
|
||||
Evaluate: {
|
||||
callback: (subpath: WasmSubpathInstance, options: Record<string, number>, _: undefined, computeType: ComputeType): string => subpath.evaluate(options.computeArgument, computeType),
|
||||
sliderOptions: [{ ...tSliderOptions, variable: "computeArgument" }],
|
||||
chooseComputeType: true,
|
||||
},
|
||||
Project: {
|
||||
callback: (subpath: WasmSubpathInstance, _: Record<string, number>, mouseLocation?: [number, number]): string =>
|
||||
mouseLocation ? subpath.project(mouseLocation[0], mouseLocation[1]) : subpath.to_svg(),
|
||||
triggerOnMouseMove: true,
|
||||
},
|
||||
"Intersect (Line Segment)": {
|
||||
callback: (subpath: WasmSubpathInstance): string =>
|
||||
subpath.intersect_line_segment([
|
||||
[150, 150],
|
||||
[20, 20],
|
||||
]),
|
||||
},
|
||||
"Intersect (Quadratic segment)": {
|
||||
callback: (subpath: WasmSubpathInstance): string =>
|
||||
subpath.intersect_quadratic_segment([
|
||||
[20, 80],
|
||||
[180, 10],
|
||||
[90, 120],
|
||||
]),
|
||||
},
|
||||
"Intersect (Cubic segment)": {
|
||||
callback: (subpath: WasmSubpathInstance): string =>
|
||||
subpath.intersect_cubic_segment([
|
||||
[40, 20],
|
||||
[100, 40],
|
||||
[40, 120],
|
||||
[175, 140],
|
||||
]),
|
||||
},
|
||||
};
|
||||
|
||||
export type SubpathFeatureName = keyof typeof subpathFeatures;
|
||||
export type SubpathFeatureOptions = {
|
||||
callback: SubpathCallback;
|
||||
sliderOptions?: SliderOption[];
|
||||
triggerOnMouseMove?: boolean;
|
||||
chooseComputeType?: boolean;
|
||||
};
|
||||
export default subpathFeatures as Record<SubpathFeatureName, SubpathFeatureOptions>;
|
||||
Reference in New Issue
Block a user