nzk-react-components 0.4.5 → 0.4.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/dist/assets/icons/awards.svg +14 -0
  2. package/dist/assets/icons/awards.svg.js +89 -0
  3. package/dist/assets/icons/awards.svg.js.map +1 -0
  4. package/dist/components/Icon/icons.d.ts +1 -0
  5. package/dist/components/Icon/icons.js +2 -0
  6. package/dist/components/Icon/icons.js.map +1 -1
  7. package/package.json +1 -1
  8. package/dist/components/DrawingTool/DrawingTool.d.ts +0 -29
  9. package/dist/components/DrawingTool/DrawingTool.js +0 -277
  10. package/dist/components/DrawingTool/DrawingTool.js.map +0 -1
  11. package/dist/components/DrawingTool/DrawingTool.stories.d.ts +0 -6
  12. package/dist/components/DrawingTool/DrawingTool.styles.d.ts +0 -41
  13. package/dist/components/DrawingTool/DrawingTool.styles.js +0 -54
  14. package/dist/components/DrawingTool/DrawingTool.styles.js.map +0 -1
  15. package/dist/components/DrawingTool/DrawingToolProvider.d.ts +0 -56
  16. package/dist/components/DrawingTool/DrawingToolProvider.js +0 -182
  17. package/dist/components/DrawingTool/DrawingToolProvider.js.map +0 -1
  18. package/dist/components/DrawingTool/components/ColourToolbar/ColourToolbar.d.ts +0 -21
  19. package/dist/components/DrawingTool/components/ColourToolbar/ColourToolbar.js +0 -89
  20. package/dist/components/DrawingTool/components/ColourToolbar/ColourToolbar.js.map +0 -1
  21. package/dist/components/DrawingTool/components/ColourToolbar/ColourToolbar.styles.d.ts +0 -9
  22. package/dist/components/DrawingTool/components/ColourToolbar/ColourToolbar.styles.js +0 -18
  23. package/dist/components/DrawingTool/components/ColourToolbar/ColourToolbar.styles.js.map +0 -1
  24. package/dist/components/DrawingTool/components/ColourToolbar/index.d.ts +0 -2
  25. package/dist/components/DrawingTool/components/ColourToolbar/index.js +0 -8
  26. package/dist/components/DrawingTool/components/ColourToolbar/index.js.map +0 -1
  27. package/dist/components/DrawingTool/components/FileInput/FileInput.d.ts +0 -9
  28. package/dist/components/DrawingTool/components/FileInput/FileInput.js +0 -88
  29. package/dist/components/DrawingTool/components/FileInput/FileInput.js.map +0 -1
  30. package/dist/components/DrawingTool/components/FileInput/FileInput.styles.d.ts +0 -4
  31. package/dist/components/DrawingTool/components/FileInput/FileInput.styles.js +0 -22
  32. package/dist/components/DrawingTool/components/FileInput/FileInput.styles.js.map +0 -1
  33. package/dist/components/DrawingTool/components/FileInput/index.d.ts +0 -2
  34. package/dist/components/DrawingTool/components/FileInput/index.js +0 -8
  35. package/dist/components/DrawingTool/components/FileInput/index.js.map +0 -1
  36. package/dist/components/DrawingTool/components/Header/Header.d.ts +0 -9
  37. package/dist/components/DrawingTool/components/Header/Header.js +0 -38
  38. package/dist/components/DrawingTool/components/Header/Header.js.map +0 -1
  39. package/dist/components/DrawingTool/components/Header/index.d.ts +0 -2
  40. package/dist/components/DrawingTool/components/Header/index.js +0 -8
  41. package/dist/components/DrawingTool/components/Header/index.js.map +0 -1
  42. package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.d.ts +0 -8
  43. package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.js +0 -31
  44. package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.js.map +0 -1
  45. package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.styles.d.ts +0 -9
  46. package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.styles.js +0 -18
  47. package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.styles.js.map +0 -1
  48. package/dist/components/DrawingTool/components/OpacityToggle/index.d.ts +0 -2
  49. package/dist/components/DrawingTool/components/OpacityToggle/index.js +0 -8
  50. package/dist/components/DrawingTool/components/OpacityToggle/index.js.map +0 -1
  51. package/dist/components/DrawingTool/components/Placeable/index.d.ts +0 -9
  52. package/dist/components/DrawingTool/components/Placeable/index.js +0 -22
  53. package/dist/components/DrawingTool/components/Placeable/index.js.map +0 -1
  54. package/dist/components/DrawingTool/index.d.ts +0 -2
  55. package/dist/components/DrawingTool/lib/Sketch.d.ts +0 -90
  56. package/dist/components/DrawingTool/lib/Sketch.js +0 -414
  57. package/dist/components/DrawingTool/lib/Sketch.js.map +0 -1
  58. package/dist/components/DrawingTool/lib/SketchCut.d.ts +0 -22
  59. package/dist/components/DrawingTool/lib/SketchCut.js +0 -98
  60. package/dist/components/DrawingTool/lib/SketchCut.js.map +0 -1
  61. package/dist/components/DrawingTool/lib/SketchCutModel.d.ts +0 -6
  62. package/dist/components/DrawingTool/lib/SketchCutModel.js +0 -20
  63. package/dist/components/DrawingTool/lib/SketchCutModel.js.map +0 -1
  64. package/dist/components/DrawingTool/lib/SketchLayer.d.ts +0 -27
  65. package/dist/components/DrawingTool/lib/SketchLayer.js +0 -59
  66. package/dist/components/DrawingTool/lib/SketchLayer.js.map +0 -1
  67. package/dist/components/DrawingTool/lib/SketchModel.d.ts +0 -65
  68. package/dist/components/DrawingTool/lib/SketchModel.js +0 -137
  69. package/dist/components/DrawingTool/lib/SketchModel.js.map +0 -1
  70. package/dist/components/DrawingTool/lib/SketchStrokeModel.d.ts +0 -33
  71. package/dist/components/DrawingTool/lib/SketchStrokeModel.js +0 -48
  72. package/dist/components/DrawingTool/lib/SketchStrokeModel.js.map +0 -1
  73. package/dist/components/DrawingTool/lib/createInteractionSurface.d.ts +0 -16
  74. package/dist/components/DrawingTool/lib/createInteractionSurface.js +0 -56
  75. package/dist/components/DrawingTool/lib/createInteractionSurface.js.map +0 -1
  76. package/dist/components/DrawingTool/lib/trace.d.ts +0 -3
  77. package/dist/components/DrawingTool/lib/trace.js +0 -24
  78. package/dist/components/DrawingTool/lib/trace.js.map +0 -1
  79. package/dist/components/DrawingTool/lib/trimCanvas.d.ts +0 -2
  80. package/dist/components/DrawingTool/lib/trimCanvas.js +0 -42
  81. package/dist/components/DrawingTool/lib/trimCanvas.js.map +0 -1
@@ -1,98 +0,0 @@
1
- 'use strict';
2
-
3
- var tslib = require('tslib');
4
- var Sketch = require('./Sketch.js');
5
- var SketchCutModel = require('./SketchCutModel.js');
6
- var SketchLayer = require('./SketchLayer.js');
7
- var trace = require('./trace.js');
8
-
9
- var SketchCut = (function (_super) {
10
- tslib.__extends(SketchCut, _super);
11
- function SketchCut(props) {
12
- var _this = _super.call(this, props) || this;
13
- _this.model = new SketchCutModel({
14
- pixelRatioScale: _this.pixelRatioScale
15
- });
16
- _this.imageToCut = props.imageToCut;
17
- _this.drawingLayer.drawImageToFit(_this.imageToCut, .9);
18
- if (props.onImageCut) {
19
- _this.onImageCut = props.onImageCut;
20
- }
21
- var defaultLayerProps = {
22
- pixelRatioScale: _this.pixelRatioScale,
23
- width: props.containerEl.offsetWidth,
24
- height: props.containerEl.offsetHeight
25
- };
26
- _this.cutLayer = new SketchLayer(defaultLayerProps);
27
- _this.cutLayer.canvas.style.zIndex = '1';
28
- _this.containerEl.appendChild(_this.cutLayer.canvas);
29
- _this.uiLayer = new SketchLayer(defaultLayerProps);
30
- _this.uiLayer.canvas.style.zIndex = '4';
31
- _this.containerEl.appendChild(_this.uiLayer.canvas);
32
- return _this;
33
- }
34
- SketchCut.prototype.initDrawAnimations = function () {
35
- _super.prototype.initDrawAnimations.call(this);
36
- this.drawFinished.cut = this.drawCutFinal;
37
- this.drawAnimation.cut = this.drawCutStroke;
38
- };
39
- SketchCut.prototype.drawCutStroke = function (stroke) {
40
- this.bufferLayer.clear();
41
- trace(stroke, this.bufferLayer.ctx);
42
- this.bufferLayer.ctx.closePath();
43
- this.bufferLayer.ctx.stroke();
44
- };
45
- SketchCut.prototype.drawCutFinal = function (stroke) {
46
- this.bufferLayer.clear();
47
- this.drawingLayer.ctx.globalCompositeOperation = 'copy';
48
- this.drawingLayer.drawImageToFit(this.imageToCut);
49
- this.drawingLayer.ctx.globalCompositeOperation = 'destination-in';
50
- trace(stroke, this.drawingLayer.ctx);
51
- this.drawingLayer.ctx.closePath();
52
- this.drawingLayer.ctx.fill();
53
- this.cutLayer.hide();
54
- var box = this.findBoundingBox(this.drawingLayer.ctx);
55
- if (box.width < 0 || box.height < 0 || (box.width * box.height) < ((this.width * this.height) * 0.001)) {
56
- this.resetCut();
57
- }
58
- else {
59
- this.drawOutline(stroke);
60
- this.cutLayer.clear();
61
- this.cutLayer.ctx.drawImage(this.drawingLayer.ctx.canvas, box.topLeftX, box.topLeftY, box.width, box.height, 0, 0, box.width, box.height);
62
- if (this.onImageCut) {
63
- this.onImageCut();
64
- }
65
- }
66
- };
67
- SketchCut.prototype.resetCut = function () {
68
- this.uiLayer.clear();
69
- this.drawingLayer.ctx.globalCompositeOperation = 'copy';
70
- this.drawingLayer.drawImageToFit(this.imageToCut);
71
- };
72
- SketchCut.prototype.drawOutline = function (stroke) {
73
- this.uiLayer.ctx.strokeStyle = "rgba(252,234,63, 1)";
74
- this.uiLayer.ctx.lineWidth = 7 * this.pixelRatioScale;
75
- this.uiLayer.ctx.lineJoin = "round";
76
- this.uiLayer.ctx.lineCap = "round";
77
- if (this.uiLayer.ctx.setLineDash) {
78
- this.uiLayer.ctx.setLineDash([15]);
79
- }
80
- else if (this.uiLayer.ctx.webkitLineDash) {
81
- this.uiLayer.ctx.webkitLineDash = [15, 15];
82
- }
83
- else {
84
- this.uiLayer.ctx.mozDash = [15, 15];
85
- }
86
- this.uiLayer.clear();
87
- trace(stroke, this.uiLayer.ctx);
88
- this.uiLayer.ctx.closePath();
89
- this.uiLayer.ctx.stroke();
90
- };
91
- SketchCut.prototype.getLayerToExport = function () {
92
- return this.cutLayer;
93
- };
94
- return SketchCut;
95
- }(Sketch));
96
-
97
- module.exports = SketchCut;
98
- //# sourceMappingURL=SketchCut.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SketchCut.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,6 +0,0 @@
1
- import SketchModel from "./SketchModel";
2
- import { SketchStrokeType } from "./SketchStrokeModel";
3
- export default class SketchCutModel extends SketchModel {
4
- colour: number[];
5
- generateStyleType(): SketchStrokeType;
6
- }
@@ -1,20 +0,0 @@
1
- 'use strict';
2
-
3
- var tslib = require('tslib');
4
- var SketchModel = require('./SketchModel.js');
5
-
6
- var SketchCutModel = (function (_super) {
7
- tslib.__extends(SketchCutModel, _super);
8
- function SketchCutModel() {
9
- var _this = _super !== null && _super.apply(this, arguments) || this;
10
- _this.colour = [252, 234, 63];
11
- return _this;
12
- }
13
- SketchCutModel.prototype.generateStyleType = function () {
14
- return 'cut';
15
- };
16
- return SketchCutModel;
17
- }(SketchModel));
18
-
19
- module.exports = SketchCutModel;
20
- //# sourceMappingURL=SketchCutModel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SketchCutModel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
@@ -1,27 +0,0 @@
1
- interface Props {
2
- width: number;
3
- height: number;
4
- pixelRatioScale: number;
5
- x?: number;
6
- y?: number;
7
- }
8
- export default class SketchLayer {
9
- width: number;
10
- height: number;
11
- x: number;
12
- y: number;
13
- naturalWidth: number;
14
- naturalHeight: number;
15
- readonly pixelRatioScale: number;
16
- readonly canvas: HTMLCanvasElement;
17
- readonly ctx: CanvasRenderingContext2D;
18
- constructor(props: Props);
19
- setSize(naturalWidth: any, naturalHeight: any, width: any, height: any): void;
20
- setPosition(x: any, y: any): void;
21
- hide(): void;
22
- show(): void;
23
- clear(): void;
24
- drawImageToFit(image: any, ratio?: number): void;
25
- drawImageToFill(image: any): void;
26
- }
27
- export {};
@@ -1,59 +0,0 @@
1
- 'use strict';
2
-
3
- var SketchLayer = (function () {
4
- function SketchLayer(props) {
5
- this.x = 0;
6
- this.y = 0;
7
- this.pixelRatioScale = props.pixelRatioScale;
8
- this.naturalWidth = props.width;
9
- this.naturalHeight = props.height;
10
- this.width = this.naturalWidth * this.pixelRatioScale;
11
- this.height = this.naturalHeight * this.pixelRatioScale;
12
- this.canvas = document.createElement('canvas');
13
- this.ctx = this.canvas.getContext('2d');
14
- this.canvas.style.position = 'absolute';
15
- this.canvas.style.pointerEvents = 'none';
16
- this.setSize(this.naturalWidth, this.naturalHeight, this.width, this.height);
17
- if (props.x)
18
- this.x = props.x;
19
- if (props.y)
20
- this.y = props.y;
21
- this.setPosition(this.x, this.y);
22
- }
23
- SketchLayer.prototype.setSize = function (naturalWidth, naturalHeight, width, height) {
24
- this.canvas.style.width = naturalWidth + "px";
25
- this.canvas.style.height = naturalHeight + "px";
26
- this.canvas.width = width;
27
- this.canvas.height = height;
28
- };
29
- SketchLayer.prototype.setPosition = function (x, y) {
30
- this.canvas.style.left = x + "px";
31
- this.canvas.style.top = y + "px";
32
- };
33
- SketchLayer.prototype.hide = function () {
34
- this.canvas.style.display = 'none';
35
- };
36
- SketchLayer.prototype.show = function () {
37
- this.canvas.style.display = 'block';
38
- };
39
- SketchLayer.prototype.clear = function () {
40
- this.ctx.clearRect(0, 0, this.width, this.height);
41
- };
42
- SketchLayer.prototype.drawImageToFit = function (image, ratio) {
43
- if (ratio === void 0) { ratio = 1; }
44
- var scale = Math.min(this.width / image.width, this.height / image.height) * ratio;
45
- var x = (this.width / 2) - (image.width / 2) * scale;
46
- var y = (this.height / 2) - (image.height / 2) * scale;
47
- this.ctx.drawImage(image, 0, 0, image.width, image.height, x, y, image.width * scale, image.height * scale);
48
- };
49
- SketchLayer.prototype.drawImageToFill = function (image) {
50
- var scale = Math.max(this.width / image.width, this.height / image.height);
51
- var x = (this.width / 2) - (image.width / 2) * scale;
52
- var y = (this.height / 2) - (image.height / 2) * scale;
53
- this.ctx.drawImage(image, 0, 0, image.width, image.height, x, y, image.width * scale, image.height * scale);
54
- };
55
- return SketchLayer;
56
- }());
57
-
58
- module.exports = SketchLayer;
59
- //# sourceMappingURL=SketchLayer.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SketchLayer.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,65 +0,0 @@
1
- import SketchStrokeModel, { SketchPoint, SketchStrokeModelData, SketchStrokeType } from './SketchStrokeModel';
2
- export declare type SketchActionType = 'STROKE' | 'IMAGE_MERGE';
3
- export interface SketchActionMergeData {
4
- image?: HTMLImageElement;
5
- imageSrc?: string;
6
- x: number;
7
- y: number;
8
- origin: number[];
9
- height: number;
10
- width: number;
11
- rotation: number;
12
- }
13
- export interface SketchAction {
14
- type: SketchActionType;
15
- data?: SketchStrokeModelData | SketchActionMergeData;
16
- model?: SketchStrokeModel;
17
- }
18
- export interface SketchModelData {
19
- colour: number[];
20
- opacity: number;
21
- size: number;
22
- lastActionIndex: number;
23
- actions: SketchAction[];
24
- currentStroke: null | SketchStrokeModelData;
25
- }
26
- interface Props {
27
- pixelRatioScale: number;
28
- }
29
- export default class SketchModel {
30
- colour: number[];
31
- eraser: boolean;
32
- fill: boolean;
33
- opacity: number;
34
- size: number;
35
- pixelRatioScale: number;
36
- actions: SketchAction[];
37
- lastActionIndex: number;
38
- currentStroke: null | SketchStrokeModel;
39
- constructor(props: Props);
40
- generateStyleType(): SketchStrokeType;
41
- getStyle(): {
42
- opacity: number;
43
- colour: number[];
44
- eraser: boolean;
45
- size: number;
46
- type: SketchStrokeType;
47
- };
48
- initStroke(newPoint: SketchPoint): void;
49
- continueStroke(newPoint: SketchPoint): void;
50
- saveStroke(): void;
51
- saveMergeImage(mergeParams: SketchActionMergeData): void;
52
- canUndo(): boolean;
53
- canRedo(): boolean;
54
- reset(): void;
55
- serialize(): {
56
- colour: number[];
57
- opacity: number;
58
- size: number;
59
- lastActionIndex: number;
60
- actions: SketchAction[];
61
- currentStroke: SketchStrokeModelData | null;
62
- };
63
- deserialize(serialized: SketchModelData): void;
64
- }
65
- export {};
@@ -1,137 +0,0 @@
1
- 'use strict';
2
-
3
- var SketchStrokeModel = require('./SketchStrokeModel.js');
4
-
5
- var SketchModel = (function () {
6
- function SketchModel(props) {
7
- this.colour = [0, 0, 0];
8
- this.eraser = false;
9
- this.fill = false;
10
- this.opacity = 1.0;
11
- this.size = 7;
12
- this.pixelRatioScale = 1;
13
- this.actions = [];
14
- this.lastActionIndex = -1;
15
- this.currentStroke = null;
16
- this.pixelRatioScale = props.pixelRatioScale;
17
- }
18
- SketchModel.prototype.generateStyleType = function () {
19
- return "" + (this.eraser || this.opacity === 1.0 ? 'opaque' : 'transparent') + (this.eraser ? 'Eraser' : 'Colour') + (this.fill ? 'Fill' : 'Stroke');
20
- };
21
- SketchModel.prototype.getStyle = function () {
22
- return {
23
- opacity: this.opacity,
24
- colour: this.colour,
25
- eraser: this.eraser,
26
- size: this.size * this.pixelRatioScale,
27
- type: this.generateStyleType()
28
- };
29
- };
30
- SketchModel.prototype.initStroke = function (newPoint) {
31
- if (this.canRedo()) {
32
- if (this.lastActionIndex === -1) {
33
- this.actions = [];
34
- }
35
- else {
36
- this.actions = this.actions.slice(0, this.lastActionIndex + 1);
37
- }
38
- }
39
- this.currentStroke = new SketchStrokeModel(this.getStyle(), newPoint);
40
- };
41
- SketchModel.prototype.continueStroke = function (newPoint) {
42
- if (this.currentStroke) {
43
- this.currentStroke.addPoint(newPoint);
44
- }
45
- };
46
- SketchModel.prototype.saveStroke = function () {
47
- if (this.currentStroke) {
48
- this.actions.push({
49
- type: 'STROKE',
50
- model: this.currentStroke
51
- });
52
- this.currentStroke = null;
53
- this.lastActionIndex += 1;
54
- }
55
- };
56
- SketchModel.prototype.saveMergeImage = function (mergeParams) {
57
- this.currentStroke = null;
58
- this.lastActionIndex += 1;
59
- this.actions.push({
60
- type: 'IMAGE_MERGE',
61
- data: mergeParams
62
- });
63
- };
64
- SketchModel.prototype.canUndo = function () {
65
- return this.lastActionIndex > -1;
66
- };
67
- SketchModel.prototype.canRedo = function () {
68
- return this.lastActionIndex < this.actions.length - 1;
69
- };
70
- SketchModel.prototype.reset = function () {
71
- this.actions = [];
72
- this.lastActionIndex = -1;
73
- if (this.currentStroke) {
74
- this.currentStroke = null;
75
- }
76
- };
77
- SketchModel.prototype.serialize = function () {
78
- var serialized = {
79
- colour: this.colour,
80
- opacity: this.opacity,
81
- size: this.size,
82
- lastActionIndex: this.lastActionIndex,
83
- actions: [],
84
- currentStroke: null
85
- };
86
- this.actions.forEach(function (action) {
87
- var serializedObject;
88
- if (action.type === 'STROKE') {
89
- serializedObject = action.model ? action.model.serialize() : action.data || {};
90
- }
91
- else if (action.type === 'IMAGE_MERGE') {
92
- serializedObject = action.data;
93
- if (serializedObject.image) {
94
- serializedObject.imageSrc = serializedObject.image.src;
95
- serializedObject.image = undefined;
96
- }
97
- }
98
- serialized.actions.push({
99
- type: action.type,
100
- data: serializedObject
101
- });
102
- });
103
- if (this.currentStroke) {
104
- serialized.currentStroke = this.currentStroke.serialize();
105
- }
106
- return serialized;
107
- };
108
- SketchModel.prototype.deserialize = function (serialized) {
109
- var _this = this;
110
- this.colour = serialized.colour;
111
- this.opacity = serialized.opacity;
112
- this.size = serialized.size;
113
- this.lastActionIndex = serialized.lastActionIndex;
114
- this.actions = [];
115
- serialized.actions.forEach(function (action) {
116
- var deserializedAction = {
117
- type: action.type,
118
- data: action.data,
119
- model: null
120
- };
121
- if (action.type === 'STROKE' && action.data) {
122
- var stroke = new SketchStrokeModel();
123
- stroke.deserialize(action.data);
124
- deserializedAction.model = stroke;
125
- }
126
- _this.actions.push(deserializedAction);
127
- });
128
- if (serialized.currentStroke !== undefined) {
129
- this.currentStroke = new SketchStrokeModel();
130
- this.currentStroke.deserialize(serialized.currentStroke);
131
- }
132
- };
133
- return SketchModel;
134
- }());
135
-
136
- module.exports = SketchModel;
137
- //# sourceMappingURL=SketchModel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SketchModel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,33 +0,0 @@
1
- export interface SketchPoint {
2
- x: number;
3
- y: number;
4
- }
5
- export declare type SketchStrokeType = 'transparentEraserFill' | 'transparentEraserStroke' | 'transparentColourFill' | 'transparentColourStroke' | 'opaqueEraserFill' | 'opaqueEraserStroke' | 'opaqueColourFill' | 'opaqueColourStroke' | 'cut';
6
- export interface SketchStrokeStyle {
7
- opacity: number;
8
- colour: number[];
9
- eraser: boolean;
10
- size: number;
11
- type: SketchStrokeType;
12
- }
13
- export interface SketchStrokeModelPoint {
14
- s: SketchPoint;
15
- h: SketchPoint | null;
16
- }
17
- export interface SketchStrokeModelData {
18
- style?: SketchStrokeStyle;
19
- points: SketchStrokeModelPoint[];
20
- }
21
- export default class SketchStrokeModel {
22
- style?: SketchStrokeStyle;
23
- points: SketchStrokeModelPoint[];
24
- constructor(style?: SketchStrokeStyle, firstPoint?: SketchPoint);
25
- length(): number;
26
- lastPoint(): SketchPoint;
27
- addPoint(newPoint: any): number;
28
- serialize(): {
29
- points: SketchStrokeModelPoint[];
30
- style: SketchStrokeStyle | undefined;
31
- };
32
- deserialize(serialized: any): void;
33
- }
@@ -1,48 +0,0 @@
1
- 'use strict';
2
-
3
- var SketchStrokeModel = (function () {
4
- function SketchStrokeModel(style, firstPoint) {
5
- if (style) {
6
- this.style = style;
7
- }
8
- this.points = [];
9
- if (firstPoint) {
10
- this.points.push({
11
- s: firstPoint,
12
- h: null
13
- });
14
- }
15
- }
16
- SketchStrokeModel.prototype.length = function () {
17
- return this.points.length;
18
- };
19
- SketchStrokeModel.prototype.lastPoint = function () {
20
- return this.points[this.points.length - 1].s;
21
- };
22
- SketchStrokeModel.prototype.addPoint = function (newPoint) {
23
- this.points[this.points.length - 1].h = {
24
- x: (this.points[this.points.length - 1].s.x + newPoint.x) / 2,
25
- y: (this.points[this.points.length - 1].s.y + newPoint.y) / 2
26
- };
27
- return this.points.push({
28
- s: newPoint,
29
- h: null
30
- });
31
- };
32
- SketchStrokeModel.prototype.serialize = function () {
33
- return {
34
- points: this.points,
35
- style: this.style
36
- };
37
- };
38
- SketchStrokeModel.prototype.deserialize = function (serialized) {
39
- if (!serialized)
40
- return;
41
- this.style = serialized.style;
42
- this.points = serialized.points || [];
43
- };
44
- return SketchStrokeModel;
45
- }());
46
-
47
- module.exports = SketchStrokeModel;
48
- //# sourceMappingURL=SketchStrokeModel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SketchStrokeModel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,16 +0,0 @@
1
- export interface Point {
2
- x: number;
3
- y: number;
4
- }
5
- interface Props {
6
- width: number;
7
- height: number;
8
- scale: number;
9
- onTouchStart?: (point: Point) => void;
10
- onTouchMove?: (point: Point) => void;
11
- onTouchEnd?: (point: Point) => void;
12
- onTouchLeave?: (point: Point) => void;
13
- onTouchEnter?: (point: Point) => void;
14
- }
15
- declare const _default: (props: Props) => HTMLDivElement;
16
- export default _default;
@@ -1,56 +0,0 @@
1
- 'use strict';
2
-
3
- var createInteractionSurface = (function (props) {
4
- var el = document.createElement('div');
5
- el.style.width = props.width + "px";
6
- el.style.height = props.height + "px";
7
- el.style.position = 'absolute';
8
- el.style.left = '0px';
9
- el.style.top = '0px';
10
- var getMousePoint = function (ev) {
11
- var rect = el.getBoundingClientRect();
12
- return {
13
- x: (ev.clientX - rect.left) * props.scale,
14
- y: (ev.clientY - rect.top) * props.scale
15
- };
16
- };
17
- var getTouchPoint = function (ev) {
18
- var rect = el.getBoundingClientRect();
19
- return {
20
- x: (ev.touches[0].clientX - rect.left) * props.scale,
21
- y: (ev.touches[0].clientY - rect.top) * props.scale
22
- };
23
- };
24
- var wrapMouseEvent = function (ev, handler) {
25
- ev.preventDefault();
26
- ev.stopPropagation();
27
- handler(getMousePoint(ev));
28
- };
29
- var wrapTouchEvent = function (ev, handler) {
30
- ev.preventDefault();
31
- ev.stopPropagation();
32
- if (ev.touches[0]) {
33
- handler(getTouchPoint(ev));
34
- }
35
- else {
36
- handler();
37
- }
38
- };
39
- el.addEventListener("mousedown", function (ev) { return wrapMouseEvent(ev, props.onTouchStart); });
40
- el.addEventListener("mousemove", function (ev) { return wrapMouseEvent(ev, props.onTouchMove); });
41
- el.addEventListener("mouseup", function (ev) { return wrapMouseEvent(ev, props.onTouchEnd); });
42
- el.addEventListener("mouseleave", function (ev) { return wrapMouseEvent(ev, props.onTouchLeave); });
43
- el.addEventListener("mouseenter", function (ev) {
44
- if (ev.buttons > 0) {
45
- wrapMouseEvent(ev, props.onTouchStart);
46
- }
47
- });
48
- el.addEventListener("touchstart", function (ev) { return wrapTouchEvent(ev, props.onTouchStart); });
49
- el.addEventListener("touchmove", function (ev) { return wrapTouchEvent(ev, props.onTouchMove); });
50
- el.addEventListener("touchend", function (ev) { return wrapTouchEvent(ev, props.onTouchEnd); });
51
- el.addEventListener("touchcancel", function (ev) { return wrapTouchEvent(ev, props.onTouchEnd); });
52
- return el;
53
- });
54
-
55
- module.exports = createInteractionSurface;
56
- //# sourceMappingURL=createInteractionSurface.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"createInteractionSurface.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,3 +0,0 @@
1
- import SketchStrokeModel from "./SketchStrokeModel";
2
- declare const _default: (stroke: SketchStrokeModel, ctx: CanvasRenderingContext2D) => void;
3
- export default _default;
@@ -1,24 +0,0 @@
1
- 'use strict';
2
-
3
- var trace = (function (stroke, ctx) {
4
- var nbPoints = stroke.length();
5
- ctx.beginPath();
6
- if (nbPoints < 3) {
7
- ctx.moveTo(stroke.points[0].s.x, stroke.points[0].s.y);
8
- ctx.lineTo(stroke.points[nbPoints - 1].s.x + 0.001, stroke.points[nbPoints - 1].s.y + 0.001);
9
- }
10
- else {
11
- ctx.moveTo(stroke.points[0].s.x, stroke.points[0].s.y);
12
- var i = void 0;
13
- var len = void 0;
14
- var move = void 0;
15
- var ref = stroke.points.slice(1, +(nbPoints - 2) + 1 || 9e9);
16
- for (i = 0, len = ref.length; i < len; i += 1) {
17
- move = ref[i];
18
- ctx.quadraticCurveTo(move.s.x, move.s.y, move.h.x, move.h.y);
19
- }
20
- }
21
- });
22
-
23
- module.exports = trace;
24
- //# sourceMappingURL=trace.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"trace.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,2 +0,0 @@
1
- declare function _default(canvas: any): any;
2
- export default _default;
@@ -1,42 +0,0 @@
1
- 'use strict';
2
-
3
- const rowBlank = (imageData, width, y) => {
4
- for (let x = 0; x < width; x+=1) {
5
- if (imageData.data[y * width * 4 + x * 4 + 3] !== 0) return false
6
- }
7
- return true
8
- };
9
-
10
- const columnBlank = (imageData, width, x, top, bottom) => {
11
- for (let y = top; y < bottom; y+=1) {
12
- if (imageData.data[y * width * 4 + x * 4 + 3] !== 0) return false
13
- }
14
- return true
15
- };
16
-
17
- var trimCanvas = (canvas) => {
18
- const ctx = canvas.getContext("2d");
19
-
20
- const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
21
- let top = 0;
22
- let bottom = imageData.height;
23
- let left = 0;
24
- let right = imageData.width;
25
-
26
- while (top < bottom && rowBlank(imageData, canvas.width, top)) top+=1;
27
- while (bottom - 1 > top && rowBlank(imageData, canvas.width, bottom - 1)) bottom-=1;
28
- while (left < right && columnBlank(imageData, canvas.width, left, top, bottom)) left+=1;
29
- while (right - 1 > left && columnBlank(imageData, canvas.width, right - 1, top, bottom)) right-=1;
30
-
31
- const trimmed = ctx.getImageData(left, top, right - left, bottom - top);
32
- const copy = canvas.ownerDocument.createElement("canvas");
33
- const copyCtx = copy.getContext("2d");
34
- copy.width = trimmed.width;
35
- copy.height = trimmed.height;
36
- copyCtx.putImageData(trimmed, 0, 0);
37
-
38
- return copy
39
- };
40
-
41
- module.exports = trimCanvas;
42
- //# sourceMappingURL=trimCanvas.js.map