fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-10-09 12:08:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

Bezier-rs: continue converting demos from canvas to SVG (#779)

Browse Source 
* Convert constructor to use svg

* Convert the through_points functions to svg

* Convert length, lut, derivative, and tangent from canvas to svg

* Fixed bug when t1 == t2 in split

* Converted split and trim to use svg representation, and swapped slider options default to use quadratic options

* Convert normal and curvature to use svg representation in bezier-rs-demos

* Convert the project function to use svg representation in bezier-rs-demos

* Convert the local_extrema, bbox, and inflections to use svgs

* Add text offset constants

* Fix typo

Co-authored-by: Robert Nadal <Robnadal44@gmail.com>
Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
Hannah Li
2022-09-27 17:37:30 -07:00
committed by GitHub
co-authored by Robert Nadal Keavon Chambers
parent aff454ec77
commit 273f1a38f3
8 changed files with 358 additions and 243 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/other/bezier-rs-demos/src/components/BezierExamplePane.vue
+18 -4
View File
@@ -3,7 +3,14 @@
<h3 class="example-pane-header">{{ name }}</h3>
<div class="example-row">
<div v-for="(example, index) in examples" :key="index">
<BezierExample v-if="!example.disabled" :title="example.title" :points="example.points" :callback="callback" :sliderOptions="example.sliderOptions" />
<BezierExample
v-if="!example.disabled"
:title="example.title"
:points="example.points"
:callback="callback"
:sliderOptions="example.sliderOptions"
:triggerOnMouseMove="triggerOnMouseMove"
/>
</div>
</div>
</div>
@@ -12,7 +19,7 @@
<script lang="ts">
import { defineComponent, PropType } from "vue";
import { BezierCallback, BezierCurveType, ExampleOptions } from "@/utils/types";
import { BezierCallback, BezierCurveType, ExampleOptions, SliderOption } from "@/utils/types";
import BezierExample from "@/components/BezierExample.vue";
@@ -27,6 +34,10 @@ export default defineComponent({
type: Object as PropType<ExampleOptions>,
default: () => ({}),
},
triggerOnMouseMove: {
type: Boolean,
default: false,
},
},
data() {
const exampleDefaults = {
@@ -53,15 +64,18 @@ export default defineComponent({
},
};
// Use quadratic slider options as a default if sliders are not provided for the other curve types.
const defaultSliderOptions: SliderOption[] = this.exampleOptions[BezierCurveType.Quadratic]?.sliderOptions || [];
return {
examples: Object.values(BezierCurveType).map((curveType) => {
examples: Object.values(BezierCurveType).map((curveType: BezierCurveType) => {
const givenData = this.exampleOptions[curveType];
const defaultData = exampleDefaults[curveType];
return {
title: curveType,
disabled: givenData?.disabled || false,
points: givenData?.customPoints || defaultData.points,
sliderOptions: givenData?.sliderOptions || [],
sliderOptions: givenData?.sliderOptions || defaultSliderOptions,
};
}),
};