Fix blend mode serialization and de-serialization to match (#400)
This commit is contained in:
parent
20a4c76fd7
commit
b854814076
|
|
@ -216,41 +216,41 @@ import { SectionsOfMenuListEntries } from "@/components/widgets/floating-menus/M
|
||||||
const wasm = import("@/../wasm/pkg").then(panicProxy);
|
const wasm = import("@/../wasm/pkg").then(panicProxy);
|
||||||
|
|
||||||
const blendModeEntries: SectionsOfMenuListEntries<BlendMode> = [
|
const blendModeEntries: SectionsOfMenuListEntries<BlendMode> = [
|
||||||
[{ label: "Normal", value: "normal" }],
|
[{ label: "Normal", value: "Normal" }],
|
||||||
[
|
[
|
||||||
{ label: "Multiply", value: "multiply" },
|
{ label: "Multiply", value: "Multiply" },
|
||||||
{ label: "Darken", value: "darken" },
|
{ label: "Darken", value: "Darken" },
|
||||||
{ label: "Color Burn", value: "color-burn" },
|
{ label: "Color Burn", value: "ColorBurn" },
|
||||||
// { label: "Linear Burn", value: "" }, // Not supported by SVG
|
// { label: "Linear Burn", value: "" }, // Not supported by SVG
|
||||||
// { label: "Darker Color", value: "" }, // Not supported by SVG
|
// { label: "Darker Color", value: "" }, // Not supported by SVG
|
||||||
],
|
],
|
||||||
[
|
[
|
||||||
{ label: "Screen", value: "screen" },
|
{ label: "Screen", value: "Screen" },
|
||||||
{ label: "Lighten", value: "lighten" },
|
{ label: "Lighten", value: "Lighten" },
|
||||||
{ label: "Color Dodge", value: "color-dodge" },
|
{ label: "Color Dodge", value: "ColorDodge" },
|
||||||
// { label: "Linear Dodge (Add)", value: "" }, // Not supported by SVG
|
// { label: "Linear Dodge (Add)", value: "" }, // Not supported by SVG
|
||||||
// { label: "Lighter Color", value: "" }, // Not supported by SVG
|
// { label: "Lighter Color", value: "" }, // Not supported by SVG
|
||||||
],
|
],
|
||||||
[
|
[
|
||||||
{ label: "Overlay", value: "overlay" },
|
{ label: "Overlay", value: "Overlay" },
|
||||||
{ label: "Soft Light", value: "soft-light" },
|
{ label: "Soft Light", value: "SoftLight" },
|
||||||
{ label: "Hard Light", value: "hard-light" },
|
{ label: "Hard Light", value: "HardLight" },
|
||||||
// { label: "Vivid Light", value: "" }, // Not supported by SVG
|
// { label: "Vivid Light", value: "" }, // Not supported by SVG
|
||||||
// { label: "Linear Light", value: "" }, // Not supported by SVG
|
// { label: "Linear Light", value: "" }, // Not supported by SVG
|
||||||
// { label: "Pin Light", value: "" }, // Not supported by SVG
|
// { label: "Pin Light", value: "" }, // Not supported by SVG
|
||||||
// { label: "Hard Mix", value: "" }, // Not supported by SVG
|
// { label: "Hard Mix", value: "" }, // Not supported by SVG
|
||||||
],
|
],
|
||||||
[
|
[
|
||||||
{ label: "Difference", value: "difference" },
|
{ label: "Difference", value: "Difference" },
|
||||||
{ label: "Exclusion", value: "exclusion" },
|
{ label: "Exclusion", value: "Exclusion" },
|
||||||
// { label: "Subtract", value: "" }, // Not supported by SVG
|
// { label: "Subtract", value: "" }, // Not supported by SVG
|
||||||
// { label: "Divide", value: "" }, // Not supported by SVG
|
// { label: "Divide", value: "" }, // Not supported by SVG
|
||||||
],
|
],
|
||||||
[
|
[
|
||||||
{ label: "Hue", value: "hue" },
|
{ label: "Hue", value: "Hue" },
|
||||||
{ label: "Saturation", value: "saturation" },
|
{ label: "Saturation", value: "Saturation" },
|
||||||
{ label: "Color", value: "color" },
|
{ label: "Color", value: "Color" },
|
||||||
{ label: "Luminosity", value: "luminosity" },
|
{ label: "Luminosity", value: "Luminosity" },
|
||||||
],
|
],
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
@ -284,7 +284,7 @@ export default defineComponent({
|
||||||
(await wasm).toggle_layer_expansion(path);
|
(await wasm).toggle_layer_expansion(path);
|
||||||
},
|
},
|
||||||
async setLayerBlendMode() {
|
async setLayerBlendMode() {
|
||||||
const blendMode = this.blendModeEntries.flat()[this.blendModeSelectedIndex].value as BlendMode;
|
const blendMode = this.blendModeEntries.flat()[this.blendModeSelectedIndex].value;
|
||||||
if (blendMode) {
|
if (blendMode) {
|
||||||
(await wasm).set_blend_mode_for_selected_layers(blendMode);
|
(await wasm).set_blend_mode_for_selected_layers(blendMode);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -194,22 +194,22 @@ function newPath(input: any): BigUint64Array {
|
||||||
}
|
}
|
||||||
|
|
||||||
export type BlendMode =
|
export type BlendMode =
|
||||||
| "normal"
|
| "Normal"
|
||||||
| "multiply"
|
| "Multiply"
|
||||||
| "darken"
|
| "Darken"
|
||||||
| "color-burn"
|
| "ColorBurn"
|
||||||
| "screen"
|
| "Screen"
|
||||||
| "lighten"
|
| "Lighten"
|
||||||
| "color-dodge"
|
| "ColorDodge"
|
||||||
| "overlay"
|
| "Overlay"
|
||||||
| "soft-light"
|
| "SoftLight"
|
||||||
| "hard-light"
|
| "HardLight"
|
||||||
| "difference"
|
| "Difference"
|
||||||
| "exclusion"
|
| "Exclusion"
|
||||||
| "hue"
|
| "Hue"
|
||||||
| "saturation"
|
| "Saturation"
|
||||||
| "color"
|
| "Color"
|
||||||
| "luminosity";
|
| "Luminosity";
|
||||||
|
|
||||||
export class LayerPanelEntry {
|
export class LayerPanelEntry {
|
||||||
name!: string;
|
name!: string;
|
||||||
|
|
|
||||||
|
|
@ -35,22 +35,22 @@ pub fn translate_blend_mode(blend_mode_svg_style_name: &str) -> Option<BlendMode
|
||||||
use BlendMode::*;
|
use BlendMode::*;
|
||||||
|
|
||||||
let blend_mode = match blend_mode_svg_style_name {
|
let blend_mode = match blend_mode_svg_style_name {
|
||||||
"normal" => Normal,
|
"Normal" => Normal,
|
||||||
"multiply" => Multiply,
|
"Multiply" => Multiply,
|
||||||
"darken" => Darken,
|
"Darken" => Darken,
|
||||||
"color-burn" => ColorBurn,
|
"ColorBurn" => ColorBurn,
|
||||||
"screen" => Screen,
|
"Screen" => Screen,
|
||||||
"lighten" => Lighten,
|
"Lighten" => Lighten,
|
||||||
"color-dodge" => ColorDodge,
|
"ColorDodge" => ColorDodge,
|
||||||
"overlay" => Overlay,
|
"Overlay" => Overlay,
|
||||||
"soft-light" => SoftLight,
|
"SoftLight" => SoftLight,
|
||||||
"hard-light" => HardLight,
|
"HardLight" => HardLight,
|
||||||
"difference" => Difference,
|
"Difference" => Difference,
|
||||||
"exclusion" => Exclusion,
|
"Exclusion" => Exclusion,
|
||||||
"hue" => Hue,
|
"Hue" => Hue,
|
||||||
"saturation" => Saturation,
|
"Saturation" => Saturation,
|
||||||
"color" => Color,
|
"Color" => Color,
|
||||||
"luminosity" => Luminosity,
|
"Luminosity" => Luminosity,
|
||||||
_ => return None,
|
_ => return None,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue