jess
/
Graphite
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Disallow snake_case variable names in frontend

This commit is contained in:
Keavon Chambers 2021-08-12 21:43:50 -07:00
parent 35d7fe8860
commit 47af8d9bed
8 changed files with 29 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/.eslintrc.js
View File

@ -36,7 +36,7 @@ module.exports = {
"@typescript-eslint/camelcase": "off", "@typescript-eslint/camelcase": "off",
"@typescript-eslint/no-use-before-define": "off", "@typescript-eslint/no-use-before-define": "off",
"@typescript-eslint/no-unused-vars": ["error", { argsIgnorePattern: "^_" }], "@typescript-eslint/no-unused-vars": ["error", { argsIgnorePattern: "^_" }],
camelcase: ["error", { allow: ["^(?:[a-z]+_)*[a-z]+$"] }], camelcase: ["error", { properties: "always" }],
"prettier-vue/prettier": [ "prettier-vue/prettier": [
"error", "error",
{ {

27
frontend/src/components/panels/Document.vue
View File

@ -260,29 +260,24 @@ export default defineComponent({
this.canvasSvgWidth = `${width}px`; this.canvasSvgWidth = `${width}px`;
this.canvasSvgHeight = `${height}px`; this.canvasSvgHeight = `${height}px`;
const { viewport_resize } = await wasm; (await wasm).viewport_resize(width, height);
viewport_resize(width, height);
}, },
async canvasMouseDown(e: MouseEvent) { async canvasMouseDown(e: MouseEvent) {
const { on_mouse_down } = await wasm;
const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey); const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey);
on_mouse_down(e.offsetX, e.offsetY, e.buttons, modifiers); (await wasm).on_mouse_down(e.offsetX, e.offsetY, e.buttons, modifiers);
}, },
async canvasMouseUp(e: MouseEvent) { async canvasMouseUp(e: MouseEvent) {
const { on_mouse_up } = await wasm;
const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey); const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey);
on_mouse_up(e.offsetX, e.offsetY, e.buttons, modifiers); (await wasm).on_mouse_up(e.offsetX, e.offsetY, e.buttons, modifiers);
}, },
async canvasMouseMove(e: MouseEvent) { async canvasMouseMove(e: MouseEvent) {
const { on_mouse_move } = await wasm;
const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey); const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey);
on_mouse_move(e.offsetX, e.offsetY, modifiers); (await wasm).on_mouse_move(e.offsetX, e.offsetY, modifiers);
}, },
async canvasMouseScroll(e: WheelEvent) { async canvasMouseScroll(e: WheelEvent) {
e.preventDefault(); e.preventDefault();
const { on_mouse_scroll } = await wasm;
const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey); const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey);
on_mouse_scroll(e.deltaX, e.deltaY, e.deltaZ, modifiers); (await wasm).on_mouse_scroll(e.deltaX, e.deltaY, e.deltaZ, modifiers);
}, },
async setCanvasZoom(newZoom: number) { async setCanvasZoom(newZoom: number) {
(await wasm).set_canvas_zoom(newZoom / 100); (await wasm).set_canvas_zoom(newZoom / 100);
@ -294,20 +289,16 @@ export default defineComponent({
(await wasm).decrease_canvas_zoom(); (await wasm).decrease_canvas_zoom();
}, },
async setRotation(newRotation: number) { async setRotation(newRotation: number) {
const { set_rotation } = await wasm; (await wasm).set_rotation(newRotation * (Math.PI / 180));
set_rotation(newRotation * (Math.PI / 180));
}, },
async selectTool(toolName: string) { async selectTool(toolName: string) {
const { select_tool } = await wasm; (await wasm).select_tool(toolName);
select_tool(toolName);
}, },
async swapWorkingColors() { async swapWorkingColors() {
const { swap_colors } = await wasm; (await wasm).swap_colors();
swap_colors();
}, },
async resetWorkingColors() { async resetWorkingColors() {
const { reset_colors } = await wasm; (await wasm).reset_colors();
reset_colors();
}, },
download(filename: string, fileData: string) { download(filename: string, fileData: string) {
const svgBlob = new Blob([fileData], { type: "image/svg+xml;charset=utf-8" }); const svgBlob = new Blob([fileData], { type: "image/svg+xml;charset=utf-8" });

17
frontend/src/components/panels/LayerTree.vue
View File

@ -176,19 +176,16 @@ export default defineComponent({
props: {}, props: {},
methods: { methods: {
async toggleLayerVisibility(path: BigUint64Array) { async toggleLayerVisibility(path: BigUint64Array) {
const { toggle_layer_visibility } = await wasm; (await wasm).toggle_layer_visibility(path);
toggle_layer_visibility(path);
}, },
async setLayerBlendMode() { async setLayerBlendMode() {
const blendMode = this.blendModeEntries.flat()[this.blendModeSelectedIndex].value as BlendMode; const blendMode = this.blendModeEntries.flat()[this.blendModeSelectedIndex].value as BlendMode;
if (blendMode) { if (blendMode) {
const { set_blend_mode_for_selected_layers } = await wasm; (await wasm).set_blend_mode_for_selected_layers(blendMode);
set_blend_mode_for_selected_layers(blendMode);
} }
}, },
async setLayerOpacity() { async setLayerOpacity() {
const { set_opacity_for_selected_layers } = await wasm; (await wasm).set_opacity_for_selected_layers(this.opacity);
set_opacity_for_selected_layers(this.opacity);
}, },
async handleControlClick(clickedLayer: LayerPanelEntry) { async handleControlClick(clickedLayer: LayerPanelEntry) {
const index = this.layers.indexOf(clickedLayer); const index = this.layers.indexOf(clickedLayer);
@ -228,8 +225,7 @@ export default defineComponent({
this.selectionRangeStartLayer = undefined; this.selectionRangeStartLayer = undefined;
this.selectionRangeEndLayer = undefined; this.selectionRangeEndLayer = undefined;
const { deselect_all_layers } = await wasm; (await wasm).deselect_all_layers();
deselect_all_layers();
}, },
async fillSelectionRange(start: LayerPanelEntry, end: LayerPanelEntry, selected = true) { async fillSelectionRange(start: LayerPanelEntry, end: LayerPanelEntry, selected = true) {
const startIndex = this.layers.findIndex((layer) => layer.path.join() === start.path.join()); const startIndex = this.layers.findIndex((layer) => layer.path.join() === start.path.join());
@ -263,8 +259,7 @@ export default defineComponent({
} }
i += 1; i += 1;
}); });
const { select_layers } = await wasm; (await wasm).select_layers(output);
select_layers(output);
}, },
setBlendModeForSelectedLayers() { setBlendModeForSelectedLayers() {
const selected = this.layers.filter((layer) => layer.layer_data.selected); const selected = this.layers.filter((layer) => layer.layer_data.selected);
@ -332,7 +327,7 @@ export default defineComponent({
const index = this.layers.findIndex((layer: LayerPanelEntry) => { const index = this.layers.findIndex((layer: LayerPanelEntry) => {
const pathLengthsEqual = responsePath.length === layer.path.length; const pathLengthsEqual = responsePath.length === layer.path.length;
return pathLengthsEqual && responsePath.every((layer_id, i) => layer_id === layer.path[i]); return pathLengthsEqual && responsePath.every((layerId, i) => layerId === layer.path[i]);
}); });
if (index >= 0) this.layers[index] = responseLayer; if (index >= 0) this.layers[index] = responseLayer;

8
frontend/src/components/widgets/inputs/SwatchPairInput.vue
View File

@ -108,25 +108,25 @@ export default defineComponent({
}, },
async updatePrimaryColor() { async updatePrimaryColor() {
const { update_primary_color, Color } = await wasm; const { Color } = await wasm;
let color = this.primaryColor; let color = this.primaryColor;
const button = this.getRef<HTMLButtonElement>("primaryButton"); const button = this.getRef<HTMLButtonElement>("primaryButton");
button.style.setProperty("--swatch-color", `rgba(${color.r}, ${color.g}, ${color.b}, ${color.a})`); button.style.setProperty("--swatch-color", `rgba(${color.r}, ${color.g}, ${color.b}, ${color.a})`);
color = rgbToDecimalRgb(this.primaryColor); color = rgbToDecimalRgb(this.primaryColor);
update_primary_color(new Color(color.r, color.g, color.b, color.a)); (await wasm).update_primary_color(new Color(color.r, color.g, color.b, color.a));
}, },
async updateSecondaryColor() { async updateSecondaryColor() {
const { update_secondary_color, Color } = await wasm; const { Color } = await wasm;
let color = this.secondaryColor; let color = this.secondaryColor;
const button = this.getRef<HTMLButtonElement>("secondaryButton"); const button = this.getRef<HTMLButtonElement>("secondaryButton");
button.style.setProperty("--swatch-color", `rgba(${color.r}, ${color.g}, ${color.b}, ${color.a})`); button.style.setProperty("--swatch-color", `rgba(${color.r}, ${color.g}, ${color.b}, ${color.a})`);
color = rgbToDecimalRgb(this.secondaryColor); color = rgbToDecimalRgb(this.secondaryColor);
update_secondary_color(new Color(color.r, color.g, color.b, color.a)); (await wasm).update_secondary_color(new Color(color.r, color.g, color.b, color.a));
}, },
}, },
data() { data() {

7
frontend/src/components/widgets/options/ToolOptions.vue
View File

@ -46,13 +46,12 @@ export default defineComponent({
// and updating a widget should send the whole updated struct to the backend. // and updating a widget should send the whole updated struct to the backend.
// Later, it could send a single-field update to the backend. // Later, it could send a single-field update to the backend.
const { set_tool_options } = await wasm;
// This is a placeholder call, using the Shape tool as an example // This is a placeholder call, using the Shape tool as an example
set_tool_options(this.$props.activeTool || "", { Shape: { shape_type: { Polygon: { vertices: newValue } } } }); // eslint-disable-next-line camelcase
(await wasm).set_tool_options(this.$props.activeTool || "", { Shape: { shape_type: { Polygon: { vertices: newValue } } } });
}, },
async sendToolMessage(message: string | object) { async sendToolMessage(message: string | object) {
const { send_tool_message } = await wasm; (await wasm).send_tool_message(this.$props.activeTool || "", message);
send_tool_message(this.$props.activeTool || "", message);
}, },
handleIconButtonAction(option: IconButtonWidget) { handleIconButtonAction(option: IconButtonWidget) {
if (option.message) { if (option.message) {

3
frontend/src/utilities/documents.ts
View File

@ -13,8 +13,7 @@ const state = reactive({
}); });
export async function selectDocument(tabIndex: number) { export async function selectDocument(tabIndex: number) {
const { select_document } = await wasm; (await wasm).select_document(tabIndex);
select_document(tabIndex);
} }
export async function closeDocumentWithConfirmation(tabIndex: number) { export async function closeDocumentWithConfirmation(tabIndex: number) {

6
frontend/src/utilities/input.ts
View File

@ -34,9 +34,8 @@ export function shouldRedirectKeyboardEventToBackend(e: KeyboardEvent): boolean
export async function handleKeyDown(e: KeyboardEvent) { export async function handleKeyDown(e: KeyboardEvent) {
if (shouldRedirectKeyboardEventToBackend(e)) { if (shouldRedirectKeyboardEventToBackend(e)) {
e.preventDefault(); e.preventDefault();
const { on_key_down } = await wasm;
const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey); const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey);
on_key_down(e.key, modifiers); (await wasm).on_key_down(e.key, modifiers);
return; return;
} }
@ -52,9 +51,8 @@ export async function handleKeyDown(e: KeyboardEvent) {
export async function handleKeyUp(e: KeyboardEvent) { export async function handleKeyUp(e: KeyboardEvent) {
if (shouldRedirectKeyboardEventToBackend(e)) { if (shouldRedirectKeyboardEventToBackend(e)) {
e.preventDefault(); e.preventDefault();
const { on_key_up } = await wasm;
const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey); const modifiers = makeModifiersBitfield(e.ctrlKey, e.shiftKey, e.altKey);
on_key_up(e.key, modifiers); (await wasm).on_key_up(e.key, modifiers);
} }
} }

5
frontend/src/utilities/response-handler.ts
View File

@ -1,6 +1,7 @@
import { reactive } from "vue";
/* eslint-disable @typescript-eslint/no-explicit-any */ /* eslint-disable @typescript-eslint/no-explicit-any */
/* eslint-disable camelcase */
import { reactive } from "vue";
type ResponseCallback = (responseData: Response) => void; type ResponseCallback = (responseData: Response) => void;
type ResponseMap = { type ResponseMap = {