* Initial factoring out of parts of the LayerUI component

2360 → 2224 LOC

* Create a Section component

* Break up src/index.tsx

* Refactor actions to reduce duplication, fix CSS

Also consolidate icons

* Move scene/data.ts to its own directory

* Fix accidental reverts, banish further single-character variables

* ACTIVE_ELEM_COLOR → ACTIVE_ELEMENT_COLOR

* Further refactoring the icons file

* Log all errors

* Pointer Event polyfill to make the tests work

* add test hooks & fix tests

Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Jed Fox 2020-03-07 10:20:38 -05:00 committed by GitHub
parent 1a6431a04a
commit c6a0cfc2b1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
49 changed files with 3498 additions and 3372 deletions

View file

@ -1,5 +1,4 @@
import React from "react";
import { Action } from "./types";
import { ColorPicker } from "../components/ColorPicker";
import { getDefaultAppState } from "../appState";
import { trash, zoomIn, zoomOut, resetZoom } from "../components/icons";
@ -8,8 +7,9 @@ import { t } from "../i18n";
import { getNormalizedZoom } from "../scene";
import { KEYS } from "../keys";
import useIsMobile from "../is-mobile";
import { register } from "./register";
export const actionChangeViewBackgroundColor: Action = {
export const actionChangeViewBackgroundColor = register({
name: "changeViewBackgroundColor",
perform: (_, appState, value) => {
return { appState: { ...appState, viewBackgroundColor: value } };
@ -27,9 +27,9 @@ export const actionChangeViewBackgroundColor: Action = {
);
},
commitToHistory: () => true,
};
});
export const actionClearCanvas: Action = {
export const actionClearCanvas = register({
name: "clearCanvas",
commitToHistory: () => true,
perform: () => {
@ -56,7 +56,7 @@ export const actionClearCanvas: Action = {
}}
/>
),
};
});
const ZOOM_STEP = 0.1;
@ -69,9 +69,9 @@ const KEY_CODES = {
NUM_ZERO: "Numpad0",
};
export const actionZoomIn: Action = {
export const actionZoomIn = register({
name: "zoomIn",
perform: (elements, appState) => {
perform: (_elements, appState) => {
return {
appState: {
...appState,
@ -93,11 +93,11 @@ export const actionZoomIn: Action = {
keyTest: event =>
(event.code === KEY_CODES.EQUAL || event.code === KEY_CODES.NUM_ADD) &&
(event[KEYS.META] || event.shiftKey),
};
});
export const actionZoomOut: Action = {
export const actionZoomOut = register({
name: "zoomOut",
perform: (elements, appState) => {
perform: (_elements, appState) => {
return {
appState: {
...appState,
@ -119,11 +119,11 @@ export const actionZoomOut: Action = {
keyTest: event =>
(event.code === KEY_CODES.MINUS || event.code === KEY_CODES.NUM_SUBTRACT) &&
(event[KEYS.META] || event.shiftKey),
};
});
export const actionResetZoom: Action = {
export const actionResetZoom = register({
name: "resetZoom",
perform: (elements, appState) => {
perform: (_elements, appState) => {
return {
appState: {
...appState,
@ -145,4 +145,4 @@ export const actionResetZoom: Action = {
keyTest: event =>
(event.code === KEY_CODES.ZERO || event.code === KEY_CODES.NUM_ZERO) &&
(event[KEYS.META] || event.shiftKey),
};
});