mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-09-16 14:58:05 +08:00
Frontend fixed to render changes to working colors when changed from backend (#180)
* Backend and Frontend modification to show working color mods * Remove comments & change precedence for tool and doc actions * Add keybind for resetting work colors * Minor Frontend changes
This commit is contained in:
committed by
GitHub
parent
0e488d99ff
commit
e867f4d7fc
@@ -70,6 +70,7 @@ import { rgbToDecimalRgb } from "@/lib/utils";
|
||||
import { defineComponent } from "vue";
|
||||
import ColorPicker from "../floating-menus/ColorPicker.vue";
|
||||
import FloatingMenu, { MenuDirection, MenuType } from "../floating-menus/FloatingMenu.vue";
|
||||
import { ResponseType, registerResponseHandler, Response, UpdateWorkingColors } from "../../../response-handler";
|
||||
|
||||
const wasm = import("../../../../wasm/pkg");
|
||||
|
||||
@@ -127,6 +128,14 @@ export default defineComponent({
|
||||
mounted() {
|
||||
this.$watch("primaryColor", this.updatePrimaryColor, { immediate: true });
|
||||
this.$watch("secondaryColor", this.updateSecondaryColor, { immediate: true });
|
||||
|
||||
registerResponseHandler(ResponseType.UpdateWorkingColors, (responseData: Response) => {
|
||||
const colorData = responseData as UpdateWorkingColors;
|
||||
if (!colorData) return;
|
||||
const { primary, secondary } = colorData;
|
||||
this.primaryColor = { r: primary.red, g: primary.green, b: primary.blue, a: primary.alpha };
|
||||
this.secondaryColor = { r: secondary.red, g: secondary.green, b: secondary.blue, a: secondary.alpha };
|
||||
});
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -16,6 +16,7 @@ export enum ResponseType {
|
||||
ExpandFolder = "ExpandFolder",
|
||||
CollapseFolder = "CollapseFolder",
|
||||
SetActiveTool = "SetActiveTool",
|
||||
UpdateWorkingColors = "UpdateWorkingColors",
|
||||
}
|
||||
|
||||
export function attachResponseHandlerToPage() {
|
||||
@@ -55,12 +56,35 @@ function parseResponse(responseType: string, data: any): Response {
|
||||
return newUpdateCanvas(data.UpdateCanvas);
|
||||
case "ExportDocument":
|
||||
return newExportDocument(data.ExportDocument);
|
||||
case "UpdateWorkingColors":
|
||||
return newUpdateWorkingColors(data.UpdateWorkingColors);
|
||||
default:
|
||||
throw new Error(`Unrecognized origin/responseType pair: ${origin}, ${responseType}`);
|
||||
}
|
||||
}
|
||||
|
||||
export type Response = SetActiveTool | UpdateCanvas | DocumentChanged | CollapseFolder | ExpandFolder;
|
||||
export type Response = SetActiveTool | UpdateCanvas | DocumentChanged | CollapseFolder | ExpandFolder | UpdateWorkingColors;
|
||||
|
||||
export interface Color {
|
||||
red: number;
|
||||
green: number;
|
||||
blue: number;
|
||||
alpha: number;
|
||||
}
|
||||
function newColor(input: any): Color {
|
||||
return { red: input.red * 255, green: input.green * 255, blue: input.blue * 255, alpha: input.alpha * 255 };
|
||||
}
|
||||
|
||||
export interface UpdateWorkingColors {
|
||||
primary: Color;
|
||||
secondary: Color;
|
||||
}
|
||||
function newUpdateWorkingColors(input: any): UpdateWorkingColors {
|
||||
return {
|
||||
primary: newColor(input.primary),
|
||||
secondary: newColor(input.secondary),
|
||||
};
|
||||
}
|
||||
|
||||
export interface SetActiveTool {
|
||||
tool_name: string;
|
||||
|
||||
Reference in New Issue
Block a user