js-draw 0.1.9 → 0.1.10

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 (59) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +15 -3
  3. package/dist/bundle.js +1 -1
  4. package/dist/src/Editor.d.ts +1 -0
  5. package/dist/src/Editor.js +28 -15
  6. package/dist/src/UndoRedoHistory.js +3 -0
  7. package/dist/src/bundle/bundled.d.ts +2 -1
  8. package/dist/src/bundle/bundled.js +2 -1
  9. package/dist/src/geometry/LineSegment2.d.ts +1 -0
  10. package/dist/src/geometry/LineSegment2.js +16 -0
  11. package/dist/src/geometry/Rect2.d.ts +1 -0
  12. package/dist/src/geometry/Rect2.js +16 -0
  13. package/dist/src/localizations/en.d.ts +3 -0
  14. package/dist/src/localizations/en.js +4 -0
  15. package/dist/src/localizations/es.d.ts +3 -0
  16. package/dist/src/localizations/es.js +18 -0
  17. package/dist/src/localizations/getLocalizationTable.d.ts +3 -0
  18. package/dist/src/localizations/getLocalizationTable.js +43 -0
  19. package/dist/src/toolbar/HTMLToolbar.js +5 -7
  20. package/dist/src/toolbar/icons.js +13 -13
  21. package/dist/src/toolbar/localization.d.ts +1 -0
  22. package/dist/src/toolbar/localization.js +1 -0
  23. package/dist/src/toolbar/widgets/BaseWidget.js +29 -0
  24. package/dist/src/tools/BaseTool.d.ts +2 -1
  25. package/dist/src/tools/BaseTool.js +3 -0
  26. package/dist/src/tools/PanZoom.d.ts +2 -1
  27. package/dist/src/tools/PanZoom.js +4 -0
  28. package/dist/src/tools/SelectionTool.d.ts +9 -2
  29. package/dist/src/tools/SelectionTool.js +131 -19
  30. package/dist/src/tools/ToolController.js +6 -2
  31. package/dist/src/tools/localization.d.ts +1 -0
  32. package/dist/src/tools/localization.js +1 -0
  33. package/dist/src/types.d.ts +8 -2
  34. package/dist/src/types.js +1 -0
  35. package/package.json +9 -1
  36. package/src/Editor.ts +31 -14
  37. package/src/UndoRedoHistory.ts +4 -0
  38. package/src/bundle/bundled.ts +2 -1
  39. package/src/geometry/LineSegment2.test.ts +15 -0
  40. package/src/geometry/LineSegment2.ts +20 -0
  41. package/src/geometry/Rect2.test.ts +20 -7
  42. package/src/geometry/Rect2.ts +19 -1
  43. package/src/localizations/en.ts +8 -0
  44. package/src/localizations/es.ts +60 -0
  45. package/src/localizations/getLocalizationTable.test.ts +27 -0
  46. package/src/localizations/getLocalizationTable.ts +53 -0
  47. package/src/toolbar/HTMLToolbar.ts +5 -8
  48. package/src/toolbar/icons.ts +13 -13
  49. package/src/toolbar/localization.ts +2 -0
  50. package/src/toolbar/toolbar.css +5 -0
  51. package/src/toolbar/widgets/BaseWidget.ts +34 -0
  52. package/src/tools/BaseTool.ts +5 -1
  53. package/src/tools/PanZoom.ts +6 -0
  54. package/src/tools/SelectionTool.test.ts +24 -1
  55. package/src/tools/SelectionTool.ts +158 -23
  56. package/src/tools/ToolController.ts +6 -2
  57. package/src/tools/localization.ts +2 -0
  58. package/src/types.ts +9 -1
  59. package/dist-test/test-dist-bundle.html +0 -42
package/src/tools/localization.ts CHANGED
@@ -1,5 +1,6 @@
1
1
 
2
2
  export interface ToolLocalization {
3
+ keyboardPanZoom: string;
3
4
  penTool: (penId: number)=>string;
4
5
  selectionTool: string;
5
6
  eraserTool: string;
@@ -25,6 +26,7 @@ export const defaultToolLocalization: ToolLocalization = {
25
26
  undoRedoTool: 'Undo/Redo',
26
27
  rightClickDragPanTool: 'Right-click drag',
27
28
  pipetteTool: 'Pick color from screen',
29
+ keyboardPanZoom: 'Keyboard pan/zoom shortcuts',
28
30
 
29
31
  textTool: 'Text',
30
32
  enterTextToInsert: 'Text to insert',
package/src/types.ts CHANGED
@@ -24,6 +24,7 @@ export interface PointerEvtListener {
24
24
  onGestureCancel(): void;
25
25
  }
26
26
 
27
+
27
28
  export enum InputEvtType {
28
29
  PointerDownEvt,
29
30
  PointerMoveEvt,
@@ -32,6 +33,7 @@ export enum InputEvtType {
32
33
 
33
34
  WheelEvt,
34
35
  KeyPressEvent,
36
+ KeyUpEvent
35
37
  }
36
38
 
37
39
  // [delta.x] is horizontal scroll,
@@ -49,6 +51,12 @@ export interface KeyPressEvent {
49
51
  readonly ctrlKey: boolean;
50
52
  }
51
53
 
54
+ export interface KeyUpEvent {
55
+ readonly kind: InputEvtType.KeyUpEvent;
56
+ readonly key: string;
57
+ readonly ctrlKey: boolean;
58
+ }
59
+
52
60
  // Event triggered when pointer capture is taken by a different [PointerEvtListener].
53
61
  export interface GestureCancelEvt {
54
62
  readonly kind: InputEvtType.GestureCancelEvt;
@@ -72,7 +80,7 @@ export interface PointerUpEvt extends PointerEvtBase {
72
80
  }
73
81
 
74
82
  export type PointerEvt = PointerDownEvt | PointerMoveEvt | PointerUpEvt;
75
- export type InputEvt = KeyPressEvent | WheelEvt | GestureCancelEvt | PointerEvt;
83
+ export type InputEvt = KeyPressEvent | KeyUpEvent | WheelEvt | GestureCancelEvt | PointerEvt;
76
84
 
77
85
  export type EditorNotifier = EventDispatcher<EditorEventType, EditorEventDataType>;
78
86
 
package/dist-test/test-dist-bundle.html DELETED
@@ -1,42 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
5
- <meta charset="utf-8"/>
6
- <title>Editor from a bundle</title>
7
- <style>
8
- body .imageEditorContainer {
9
- height: 800px;
10
-
11
- --primary-background-color: green;
12
- --primary-background-color-transparent: rgba(255, 240, 200, 0.5);
13
- --secondary-background-color: yellow;
14
- --primary-foreground-color: black;
15
- --secondary-foreground-color: black;
16
- }
17
- </style>
18
- </head>
19
- <body>
20
- <p>
21
- This file tests the bundled version of <code>js-draw</code>.
22
- Be sure to run <code>yarn build</code> before opening this!
23
- </p>
24
- <script src="../dist/bundle.js"></script>
25
- <script>
26
- const editor1 = new jsdraw.Editor(document.body, {
27
- wheelEventsEnabled: false,
28
- });
29
- editor1.addToolbar();
30
- editor1.loadFromSVG('<svg><text>Wheel events disabled.</text></svg>');
31
-
32
- const editor2 = new jsdraw.Editor(document.body, {
33
- wheelEventsEnabled: 'only-if-focused',
34
- });
35
- editor2.addToolbar();
36
- editor2.loadFromSVG('<svg><text>Wheel events enabled, only if focused.</text></svg>');
37
-
38
- const editor3 = new jsdraw.Editor(document.body);
39
- editor3.addToolbar();
40
- </script>
41
- </body>
42
- </html>