layer types

Author: Templarian

src/pg/inputPixelEditor/README.md

@@ -138,6 +138,7 @@ There are currently 5 differnet layer types.
 
 - `pixel` - Raster artboard of pixels.
   - `path` - pixels
+  - `color` - colorIndex
 - `reference`
   - `id` - uuid of frame
   - `position: [x, y]`

src/pg/inputPixelEditor/inputPixelEditor.ts

@@ -6,7 +6,7 @@ import { InputMode } from './utils/inputMode';
 import cloneGrid from './utils/cloneGrid';
 import getEllipsePixels from './utils/getEllipsePixels';
 import getEllipseOutlinePixels from './utils/getEllipseOutlinePixels';
-import { WHITE } from './utils/constants';
+import { WHITE, Pixel } from './utils/constants';
 import getLinePixels from './utils/getLinePixels';
 import getRectanglePixels from './utils/getRectanglePixels';
 import getRectangleOutlinePixels from './utils/getRectangleOutlinePixels';
@@ -17,8 +17,6 @@ import createLayer from './utils/createLayer';
 import diffGrid from './utils/diffGrid';
 import { getGuides } from './utils/getGuides';
 
-type Pixel = { x: number, y: number };
-
 type Color = [number, number, number, number];
 
 enum HistoryType {

src/pg/inputPixelEditor/utils/constants.ts

@@ -1 +1,55 @@
-export const WHITE = '#FFFFFF';
+export const WHITE = '#FFFFFF';
+
+export type Pixel = { x: number, y: number };
+
+export type Point = [number, number];
+
+export enum LayerType {
+  Pixel = 'pixel',
+  Reference = 'reference',
+  Pattern = 'pattern',
+  Linear = 'linear',
+  Radial = 'radial',
+}
+
+/**
+ * stop 0 to 1
+ * colorIndex
+ */
+export type GradientStop = [number, number];
+
+interface LayerPixel {
+  type: LayerType.Pixel;
+  path: string;
+  color: number;
+}
+
+interface LayerReference {
+  type: LayerType.Reference;
+  id: string;
+  position: Point;
+}
+
+interface LayerPattern {
+  type: LayerType.Pattern;
+  id: string;
+  path: string;
+  offset: Point;
+}
+
+interface LayerLinear {
+  type: LayerType.Linear;
+  start: Point;
+  end: Point;
+  stops: GradientStop[];
+  dither: 'bayer4' | 'bayer8' | 'bayer16';
+}
+
+interface LayerRadial {
+  type: LayerType.Radial;
+  start: Point;
+  end: Point;
+  stops: GradientStop[];
+  transform: [number, number, number, number, number, number];
+  dither: 'bayer4' | 'bayer8' | 'bayer16';
+}