js-draw 0.17.4 → 0.18.1
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.
- package/CHANGELOG.md +8 -0
- package/dist/bundle.js +9 -1
- package/package.json +35 -33
- package/tsconfig.json +3 -2
- package/tsconfig.mjs.json +9 -0
- package/.github/ISSUE_TEMPLATE/bug_report.md +0 -34
- package/.github/ISSUE_TEMPLATE/feature_request.md +0 -20
- package/.github/ISSUE_TEMPLATE/translation.yml +0 -902
- package/.github/pull_request_template.md +0 -15
- package/.github/workflows/firebase-hosting-merge.yml +0 -32
- package/.github/workflows/firebase-hosting-pull-request.yml +0 -32
- package/.github/workflows/github-pages.yml +0 -56
- package/.husky/pre-commit +0 -4
- package/build_tools/BundledFile.ts +0 -167
- package/build_tools/buildTranslationTemplate.ts +0 -121
- package/build_tools/bundle.ts +0 -11
- package/dist/build_tools/BundledFile.d.ts +0 -13
- package/dist/build_tools/BundledFile.js +0 -157
- package/dist/build_tools/buildTranslationTemplate.d.ts +0 -1
- package/dist/build_tools/buildTranslationTemplate.js +0 -94
- package/dist/build_tools/bundle.d.ts +0 -1
- package/dist/build_tools/bundle.js +0 -5
- package/dist/src/Color4.d.ts +0 -60
- package/dist/src/Color4.js +0 -192
- package/dist/src/Editor.d.ts +0 -308
- package/dist/src/Editor.js +0 -874
- package/dist/src/EditorImage.d.ts +0 -97
- package/dist/src/EditorImage.js +0 -477
- package/dist/src/EventDispatcher.d.ts +0 -30
- package/dist/src/EventDispatcher.js +0 -54
- package/dist/src/Pointer.d.ts +0 -24
- package/dist/src/Pointer.js +0 -80
- package/dist/src/SVGLoader.d.ts +0 -48
- package/dist/src/SVGLoader.js +0 -442
- package/dist/src/UndoRedoHistory.d.ts +0 -19
- package/dist/src/UndoRedoHistory.js +0 -91
- package/dist/src/Viewport.d.ts +0 -71
- package/dist/src/Viewport.js +0 -256
- package/dist/src/bundle/bundled.d.ts +0 -4
- package/dist/src/bundle/bundled.js +0 -5
- package/dist/src/commands/Command.d.ts +0 -16
- package/dist/src/commands/Command.js +0 -30
- package/dist/src/commands/Duplicate.d.ts +0 -14
- package/dist/src/commands/Duplicate.js +0 -33
- package/dist/src/commands/Erase.d.ts +0 -14
- package/dist/src/commands/Erase.js +0 -57
- package/dist/src/commands/SerializableCommand.d.ts +0 -12
- package/dist/src/commands/SerializableCommand.js +0 -36
- package/dist/src/commands/UnresolvedCommand.d.ts +0 -14
- package/dist/src/commands/UnresolvedCommand.js +0 -22
- package/dist/src/commands/invertCommand.d.ts +0 -4
- package/dist/src/commands/invertCommand.js +0 -44
- package/dist/src/commands/lib.d.ts +0 -7
- package/dist/src/commands/lib.js +0 -7
- package/dist/src/commands/localization.d.ts +0 -23
- package/dist/src/commands/localization.js +0 -21
- package/dist/src/commands/uniteCommands.d.ts +0 -4
- package/dist/src/commands/uniteCommands.js +0 -116
- package/dist/src/components/AbstractComponent.d.ts +0 -73
- package/dist/src/components/AbstractComponent.js +0 -252
- package/dist/src/components/ImageBackground.d.ts +0 -42
- package/dist/src/components/ImageBackground.js +0 -139
- package/dist/src/components/ImageComponent.d.ts +0 -31
- package/dist/src/components/ImageComponent.js +0 -146
- package/dist/src/components/RestylableComponent.d.ts +0 -24
- package/dist/src/components/RestylableComponent.js +0 -80
- package/dist/src/components/SVGGlobalAttributesObject.d.ts +0 -21
- package/dist/src/components/SVGGlobalAttributesObject.js +0 -59
- package/dist/src/components/Stroke.d.ts +0 -40
- package/dist/src/components/Stroke.js +0 -185
- package/dist/src/components/TextComponent.d.ts +0 -53
- package/dist/src/components/TextComponent.js +0 -252
- package/dist/src/components/UnknownSVGObject.d.ts +0 -18
- package/dist/src/components/UnknownSVGObject.js +0 -44
- package/dist/src/components/builders/ArrowBuilder.d.ts +0 -19
- package/dist/src/components/builders/ArrowBuilder.js +0 -86
- package/dist/src/components/builders/FreehandLineBuilder.d.ts +0 -33
- package/dist/src/components/builders/FreehandLineBuilder.js +0 -165
- package/dist/src/components/builders/LineBuilder.d.ts +0 -18
- package/dist/src/components/builders/LineBuilder.js +0 -58
- package/dist/src/components/builders/PressureSensitiveFreehandLineBuilder.d.ts +0 -36
- package/dist/src/components/builders/PressureSensitiveFreehandLineBuilder.js +0 -339
- package/dist/src/components/builders/RectangleBuilder.d.ts +0 -20
- package/dist/src/components/builders/RectangleBuilder.js +0 -50
- package/dist/src/components/builders/types.d.ts +0 -12
- package/dist/src/components/builders/types.js +0 -1
- package/dist/src/components/lib.d.ts +0 -12
- package/dist/src/components/lib.js +0 -12
- package/dist/src/components/localization.d.ts +0 -11
- package/dist/src/components/localization.js +0 -10
- package/dist/src/components/util/StrokeSmoother.d.ts +0 -35
- package/dist/src/components/util/StrokeSmoother.js +0 -210
- package/dist/src/components/util/describeComponentList.d.ts +0 -4
- package/dist/src/components/util/describeComponentList.js +0 -14
- package/dist/src/lib.d.ts +0 -34
- package/dist/src/lib.js +0 -34
- package/dist/src/localization.d.ts +0 -14
- package/dist/src/localization.js +0 -10
- package/dist/src/localizations/de.d.ts +0 -3
- package/dist/src/localizations/de.js +0 -4
- package/dist/src/localizations/en.d.ts +0 -3
- package/dist/src/localizations/en.js +0 -4
- package/dist/src/localizations/es.d.ts +0 -3
- package/dist/src/localizations/es.js +0 -18
- package/dist/src/localizations/getLocalizationTable.d.ts +0 -3
- package/dist/src/localizations/getLocalizationTable.js +0 -45
- package/dist/src/math/LineSegment2.d.ts +0 -24
- package/dist/src/math/LineSegment2.js +0 -125
- package/dist/src/math/Mat33.d.ts +0 -118
- package/dist/src/math/Mat33.js +0 -326
- package/dist/src/math/Path.d.ts +0 -71
- package/dist/src/math/Path.js +0 -648
- package/dist/src/math/Rect2.d.ts +0 -52
- package/dist/src/math/Rect2.js +0 -228
- package/dist/src/math/Triangle.d.ts +0 -11
- package/dist/src/math/Triangle.js +0 -19
- package/dist/src/math/Vec2.d.ts +0 -13
- package/dist/src/math/Vec2.js +0 -13
- package/dist/src/math/Vec3.d.ts +0 -106
- package/dist/src/math/Vec3.js +0 -174
- package/dist/src/math/lib.d.ts +0 -7
- package/dist/src/math/lib.js +0 -7
- package/dist/src/math/rounding.d.ts +0 -4
- package/dist/src/math/rounding.js +0 -128
- package/dist/src/rendering/Display.d.ts +0 -75
- package/dist/src/rendering/Display.js +0 -207
- package/dist/src/rendering/RenderingStyle.d.ts +0 -31
- package/dist/src/rendering/RenderingStyle.js +0 -38
- package/dist/src/rendering/TextRenderingStyle.d.ts +0 -36
- package/dist/src/rendering/TextRenderingStyle.js +0 -23
- package/dist/src/rendering/caching/CacheRecord.d.ts +0 -20
- package/dist/src/rendering/caching/CacheRecord.js +0 -55
- package/dist/src/rendering/caching/CacheRecordManager.d.ts +0 -12
- package/dist/src/rendering/caching/CacheRecordManager.js +0 -43
- package/dist/src/rendering/caching/RenderingCache.d.ts +0 -11
- package/dist/src/rendering/caching/RenderingCache.js +0 -45
- package/dist/src/rendering/caching/RenderingCacheNode.d.ts +0 -29
- package/dist/src/rendering/caching/RenderingCacheNode.js +0 -320
- package/dist/src/rendering/caching/testUtils.d.ts +0 -9
- package/dist/src/rendering/caching/testUtils.js +0 -20
- package/dist/src/rendering/caching/types.d.ts +0 -19
- package/dist/src/rendering/caching/types.js +0 -1
- package/dist/src/rendering/lib.d.ts +0 -5
- package/dist/src/rendering/lib.js +0 -5
- package/dist/src/rendering/localization.d.ts +0 -10
- package/dist/src/rendering/localization.js +0 -9
- package/dist/src/rendering/renderers/AbstractRenderer.d.ts +0 -68
- package/dist/src/rendering/renderers/AbstractRenderer.js +0 -144
- package/dist/src/rendering/renderers/CanvasRenderer.d.ts +0 -63
- package/dist/src/rendering/renderers/CanvasRenderer.js +0 -230
- package/dist/src/rendering/renderers/DummyRenderer.d.ts +0 -35
- package/dist/src/rendering/renderers/DummyRenderer.js +0 -106
- package/dist/src/rendering/renderers/SVGRenderer.d.ts +0 -57
- package/dist/src/rendering/renderers/SVGRenderer.js +0 -304
- package/dist/src/rendering/renderers/TextOnlyRenderer.d.ts +0 -29
- package/dist/src/rendering/renderers/TextOnlyRenderer.js +0 -57
- package/dist/src/testing/beforeEachFile.d.ts +0 -1
- package/dist/src/testing/beforeEachFile.js +0 -7
- package/dist/src/testing/createEditor.d.ts +0 -4
- package/dist/src/testing/createEditor.js +0 -9
- package/dist/src/testing/lib.d.ts +0 -2
- package/dist/src/testing/lib.js +0 -2
- package/dist/src/testing/loadExpectExtensions.d.ts +0 -2
- package/dist/src/testing/loadExpectExtensions.js +0 -24
- package/dist/src/testing/sendPenEvent.d.ts +0 -12
- package/dist/src/testing/sendPenEvent.js +0 -19
- package/dist/src/testing/sendTouchEvent.d.ts +0 -42
- package/dist/src/testing/sendTouchEvent.js +0 -62
- package/dist/src/toolbar/HTMLToolbar.d.ts +0 -103
- package/dist/src/toolbar/HTMLToolbar.js +0 -376
- package/dist/src/toolbar/IconProvider.d.ts +0 -62
- package/dist/src/toolbar/IconProvider.js +0 -654
- package/dist/src/toolbar/lib.d.ts +0 -3
- package/dist/src/toolbar/lib.js +0 -3
- package/dist/src/toolbar/localization.d.ts +0 -49
- package/dist/src/toolbar/localization.js +0 -48
- package/dist/src/toolbar/makeColorInput.d.ts +0 -6
- package/dist/src/toolbar/makeColorInput.js +0 -113
- package/dist/src/toolbar/types.d.ts +0 -4
- package/dist/src/toolbar/types.js +0 -1
- package/dist/src/toolbar/widgets/ActionButtonWidget.d.ts +0 -15
- package/dist/src/toolbar/widgets/ActionButtonWidget.js +0 -25
- package/dist/src/toolbar/widgets/BaseToolWidget.d.ts +0 -11
- package/dist/src/toolbar/widgets/BaseToolWidget.js +0 -44
- package/dist/src/toolbar/widgets/BaseWidget.d.ts +0 -72
- package/dist/src/toolbar/widgets/BaseWidget.js +0 -307
- package/dist/src/toolbar/widgets/DocumentPropertiesWidget.d.ts +0 -18
- package/dist/src/toolbar/widgets/DocumentPropertiesWidget.js +0 -120
- package/dist/src/toolbar/widgets/EraserToolWidget.d.ts +0 -17
- package/dist/src/toolbar/widgets/EraserToolWidget.js +0 -57
- package/dist/src/toolbar/widgets/HandToolWidget.d.ts +0 -17
- package/dist/src/toolbar/widgets/HandToolWidget.js +0 -172
- package/dist/src/toolbar/widgets/InsertImageWidget.d.ts +0 -19
- package/dist/src/toolbar/widgets/InsertImageWidget.js +0 -170
- package/dist/src/toolbar/widgets/OverflowWidget.d.ts +0 -25
- package/dist/src/toolbar/widgets/OverflowWidget.js +0 -71
- package/dist/src/toolbar/widgets/PenToolWidget.d.ts +0 -27
- package/dist/src/toolbar/widgets/PenToolWidget.js +0 -220
- package/dist/src/toolbar/widgets/SelectionToolWidget.d.ts +0 -13
- package/dist/src/toolbar/widgets/SelectionToolWidget.js +0 -147
- package/dist/src/toolbar/widgets/TextToolWidget.d.ts +0 -16
- package/dist/src/toolbar/widgets/TextToolWidget.js +0 -109
- package/dist/src/toolbar/widgets/lib.d.ts +0 -10
- package/dist/src/toolbar/widgets/lib.js +0 -10
- package/dist/src/tools/BaseTool.d.ts +0 -22
- package/dist/src/tools/BaseTool.js +0 -63
- package/dist/src/tools/Eraser.d.ts +0 -23
- package/dist/src/tools/Eraser.js +0 -106
- package/dist/src/tools/FindTool.d.ts +0 -21
- package/dist/src/tools/FindTool.js +0 -114
- package/dist/src/tools/PanZoom.d.ts +0 -52
- package/dist/src/tools/PanZoom.js +0 -414
- package/dist/src/tools/PasteHandler.d.ts +0 -23
- package/dist/src/tools/PasteHandler.js +0 -93
- package/dist/src/tools/Pen.d.ts +0 -39
- package/dist/src/tools/Pen.js +0 -173
- package/dist/src/tools/PipetteTool.d.ts +0 -18
- package/dist/src/tools/PipetteTool.js +0 -39
- package/dist/src/tools/SelectionTool/SelectAllShortcutHandler.d.ts +0 -8
- package/dist/src/tools/SelectionTool/SelectAllShortcutHandler.js +0 -22
- package/dist/src/tools/SelectionTool/Selection.d.ts +0 -64
- package/dist/src/tools/SelectionTool/Selection.js +0 -459
- package/dist/src/tools/SelectionTool/SelectionHandle.d.ts +0 -38
- package/dist/src/tools/SelectionTool/SelectionHandle.js +0 -81
- package/dist/src/tools/SelectionTool/SelectionTool.d.ts +0 -36
- package/dist/src/tools/SelectionTool/SelectionTool.js +0 -398
- package/dist/src/tools/SelectionTool/TransformMode.d.ts +0 -34
- package/dist/src/tools/SelectionTool/TransformMode.js +0 -98
- package/dist/src/tools/SelectionTool/types.d.ts +0 -9
- package/dist/src/tools/SelectionTool/types.js +0 -11
- package/dist/src/tools/TextTool.d.ts +0 -33
- package/dist/src/tools/TextTool.js +0 -256
- package/dist/src/tools/ToolController.d.ts +0 -18
- package/dist/src/tools/ToolController.js +0 -158
- package/dist/src/tools/ToolEnabledGroup.d.ts +0 -6
- package/dist/src/tools/ToolEnabledGroup.js +0 -11
- package/dist/src/tools/ToolSwitcherShortcut.d.ts +0 -16
- package/dist/src/tools/ToolSwitcherShortcut.js +0 -32
- package/dist/src/tools/ToolbarShortcutHandler.d.ts +0 -12
- package/dist/src/tools/ToolbarShortcutHandler.js +0 -23
- package/dist/src/tools/UndoRedoShortcut.d.ts +0 -8
- package/dist/src/tools/UndoRedoShortcut.js +0 -22
- package/dist/src/tools/lib.d.ts +0 -16
- package/dist/src/tools/lib.js +0 -16
- package/dist/src/tools/localization.d.ts +0 -28
- package/dist/src/tools/localization.js +0 -27
- package/dist/src/types.d.ts +0 -151
- package/dist/src/types.js +0 -35
- package/dist/src/util/assertions.d.ts +0 -23
- package/dist/src/util/assertions.js +0 -45
- package/dist/src/util/fileToBase64.d.ts +0 -3
- package/dist/src/util/fileToBase64.js +0 -13
- package/dist/src/util/untilNextAnimationFrame.d.ts +0 -3
- package/dist/src/util/untilNextAnimationFrame.js +0 -7
- package/dist/src/util/waitForTimeout.d.ts +0 -2
- package/dist/src/util/waitForTimeout.js +0 -7
- package/src/Color4.test.ts +0 -40
- package/src/Color4.ts +0 -234
- package/src/Editor.css +0 -86
- package/src/Editor.loadFrom.test.ts +0 -24
- package/src/Editor.toSVG.test.ts +0 -111
- package/src/Editor.ts +0 -1122
- package/src/EditorImage.test.ts +0 -120
- package/src/EditorImage.ts +0 -603
- package/src/EventDispatcher.test.ts +0 -123
- package/src/EventDispatcher.ts +0 -71
- package/src/Pointer.ts +0 -127
- package/src/SVGLoader.test.ts +0 -114
- package/src/SVGLoader.ts +0 -511
- package/src/UndoRedoHistory.test.ts +0 -33
- package/src/UndoRedoHistory.ts +0 -102
- package/src/Viewport.ts +0 -319
- package/src/bundle/bundled.ts +0 -7
- package/src/commands/Command.ts +0 -45
- package/src/commands/Duplicate.ts +0 -48
- package/src/commands/Erase.ts +0 -74
- package/src/commands/SerializableCommand.ts +0 -49
- package/src/commands/UnresolvedCommand.ts +0 -37
- package/src/commands/invertCommand.ts +0 -51
- package/src/commands/lib.ts +0 -16
- package/src/commands/localization.ts +0 -47
- package/src/commands/uniteCommands.test.ts +0 -23
- package/src/commands/uniteCommands.ts +0 -135
- package/src/components/AbstractComponent.transformBy.test.ts +0 -22
- package/src/components/AbstractComponent.ts +0 -364
- package/src/components/ImageBackground.test.ts +0 -35
- package/src/components/ImageBackground.ts +0 -176
- package/src/components/ImageComponent.ts +0 -171
- package/src/components/RestylableComponent.ts +0 -142
- package/src/components/SVGGlobalAttributesObject.ts +0 -81
- package/src/components/Stroke.test.ts +0 -139
- package/src/components/Stroke.ts +0 -245
- package/src/components/TextComponent.test.ts +0 -99
- package/src/components/TextComponent.ts +0 -315
- package/src/components/UnknownSVGObject.test.ts +0 -10
- package/src/components/UnknownSVGObject.ts +0 -60
- package/src/components/builders/ArrowBuilder.ts +0 -107
- package/src/components/builders/FreehandLineBuilder.ts +0 -212
- package/src/components/builders/LineBuilder.ts +0 -77
- package/src/components/builders/PressureSensitiveFreehandLineBuilder.ts +0 -454
- package/src/components/builders/RectangleBuilder.ts +0 -74
- package/src/components/builders/types.ts +0 -15
- package/src/components/lib.ts +0 -25
- package/src/components/localization.ts +0 -22
- package/src/components/util/StrokeSmoother.ts +0 -293
- package/src/components/util/describeComponentList.ts +0 -18
- package/src/lib.ts +0 -37
- package/src/localization.ts +0 -34
- package/src/localizations/de.ts +0 -98
- package/src/localizations/en.ts +0 -8
- package/src/localizations/es.ts +0 -74
- package/src/localizations/getLocalizationTable.test.ts +0 -27
- package/src/localizations/getLocalizationTable.ts +0 -55
- package/src/math/LineSegment2.test.ts +0 -99
- package/src/math/LineSegment2.ts +0 -160
- package/src/math/Mat33.test.ts +0 -244
- package/src/math/Mat33.ts +0 -437
- package/src/math/Path.fromString.test.ts +0 -223
- package/src/math/Path.test.ts +0 -198
- package/src/math/Path.toString.test.ts +0 -77
- package/src/math/Path.ts +0 -790
- package/src/math/Rect2.test.ts +0 -204
- package/src/math/Rect2.ts +0 -315
- package/src/math/Triangle.ts +0 -29
- package/src/math/Vec2.test.ts +0 -30
- package/src/math/Vec2.ts +0 -18
- package/src/math/Vec3.test.ts +0 -44
- package/src/math/Vec3.ts +0 -218
- package/src/math/lib.ts +0 -15
- package/src/math/rounding.test.ts +0 -65
- package/src/math/rounding.ts +0 -156
- package/src/rendering/Display.ts +0 -249
- package/src/rendering/RenderingStyle.test.ts +0 -68
- package/src/rendering/RenderingStyle.ts +0 -55
- package/src/rendering/TextRenderingStyle.ts +0 -45
- package/src/rendering/caching/CacheRecord.test.ts +0 -49
- package/src/rendering/caching/CacheRecord.ts +0 -77
- package/src/rendering/caching/CacheRecordManager.ts +0 -71
- package/src/rendering/caching/RenderingCache.test.ts +0 -44
- package/src/rendering/caching/RenderingCache.ts +0 -66
- package/src/rendering/caching/RenderingCacheNode.ts +0 -405
- package/src/rendering/caching/testUtils.ts +0 -35
- package/src/rendering/caching/types.ts +0 -34
- package/src/rendering/lib.ts +0 -6
- package/src/rendering/localization.ts +0 -20
- package/src/rendering/renderers/AbstractRenderer.ts +0 -222
- package/src/rendering/renderers/CanvasRenderer.ts +0 -296
- package/src/rendering/renderers/DummyRenderer.test.ts +0 -42
- package/src/rendering/renderers/DummyRenderer.ts +0 -136
- package/src/rendering/renderers/SVGRenderer.ts +0 -354
- package/src/rendering/renderers/TextOnlyRenderer.ts +0 -70
- package/src/styles.js +0 -7
- package/src/testing/beforeEachFile.ts +0 -8
- package/src/testing/createEditor.ts +0 -11
- package/src/testing/global.d.ts +0 -17
- package/src/testing/lib.ts +0 -3
- package/src/testing/loadExpectExtensions.ts +0 -25
- package/src/testing/sendPenEvent.ts +0 -31
- package/src/testing/sendTouchEvent.ts +0 -78
- package/src/toolbar/HTMLToolbar.ts +0 -492
- package/src/toolbar/IconProvider.ts +0 -736
- package/src/toolbar/lib.ts +0 -4
- package/src/toolbar/localization.ts +0 -106
- package/src/toolbar/makeColorInput.ts +0 -145
- package/src/toolbar/toolbar.css +0 -213
- package/src/toolbar/types.ts +0 -5
- package/src/toolbar/widgets/ActionButtonWidget.ts +0 -39
- package/src/toolbar/widgets/BaseToolWidget.ts +0 -56
- package/src/toolbar/widgets/BaseWidget.ts +0 -377
- package/src/toolbar/widgets/DocumentPropertiesWidget.ts +0 -167
- package/src/toolbar/widgets/EraserToolWidget.ts +0 -85
- package/src/toolbar/widgets/HandToolWidget.ts +0 -250
- package/src/toolbar/widgets/InsertImageWidget.css +0 -44
- package/src/toolbar/widgets/InsertImageWidget.ts +0 -223
- package/src/toolbar/widgets/OverflowWidget.css +0 -27
- package/src/toolbar/widgets/OverflowWidget.ts +0 -92
- package/src/toolbar/widgets/PenToolWidget.ts +0 -288
- package/src/toolbar/widgets/SelectionToolWidget.ts +0 -190
- package/src/toolbar/widgets/TextToolWidget.ts +0 -145
- package/src/toolbar/widgets/lib.ts +0 -13
- package/src/tools/BaseTool.ts +0 -76
- package/src/tools/Eraser.test.ts +0 -103
- package/src/tools/Eraser.ts +0 -139
- package/src/tools/FindTool.css +0 -7
- package/src/tools/FindTool.ts +0 -152
- package/src/tools/PanZoom.test.ts +0 -310
- package/src/tools/PanZoom.ts +0 -520
- package/src/tools/PasteHandler.ts +0 -95
- package/src/tools/Pen.test.ts +0 -194
- package/src/tools/Pen.ts +0 -226
- package/src/tools/PipetteTool.ts +0 -55
- package/src/tools/SelectionTool/SelectAllShortcutHandler.ts +0 -28
- package/src/tools/SelectionTool/Selection.ts +0 -607
- package/src/tools/SelectionTool/SelectionHandle.ts +0 -108
- package/src/tools/SelectionTool/SelectionTool.css +0 -23
- package/src/tools/SelectionTool/SelectionTool.test.ts +0 -261
- package/src/tools/SelectionTool/SelectionTool.ts +0 -480
- package/src/tools/SelectionTool/TransformMode.ts +0 -114
- package/src/tools/SelectionTool/types.ts +0 -11
- package/src/tools/TextTool.ts +0 -326
- package/src/tools/ToolController.ts +0 -178
- package/src/tools/ToolEnabledGroup.ts +0 -14
- package/src/tools/ToolSwitcherShortcut.ts +0 -39
- package/src/tools/ToolbarShortcutHandler.ts +0 -34
- package/src/tools/UndoRedoShortcut.test.ts +0 -56
- package/src/tools/UndoRedoShortcut.ts +0 -25
- package/src/tools/lib.ts +0 -21
- package/src/tools/localization.ts +0 -66
- package/src/types.ts +0 -234
- package/src/util/assertions.ts +0 -55
- package/src/util/fileToBase64.ts +0 -18
- package/src/util/untilNextAnimationFrame.ts +0 -9
- package/src/util/waitForTimeout.ts +0 -9
@@ -1,120 +0,0 @@
|
|
1
|
-
import { EditorImageEventType } from '../../EditorImage';
|
2
|
-
import Rect2 from '../../math/Rect2';
|
3
|
-
import { EditorEventType } from '../../types';
|
4
|
-
import { toolbarCSSPrefix } from '../HTMLToolbar';
|
5
|
-
import makeColorInput from '../makeColorInput';
|
6
|
-
import BaseWidget from './BaseWidget';
|
7
|
-
export default class DocumentPropertiesWidget extends BaseWidget {
|
8
|
-
constructor(editor, localizationTable) {
|
9
|
-
super(editor, 'zoom-widget', localizationTable);
|
10
|
-
this.updateDropdownContent = () => { };
|
11
|
-
this.dropdownUpdateQueued = false;
|
12
|
-
// Make it possible to open the dropdown, even if this widget isn't selected.
|
13
|
-
this.container.classList.add('dropdownShowable');
|
14
|
-
this.editor.notifier.on(EditorEventType.UndoRedoStackUpdated, () => {
|
15
|
-
this.queueDropdownUpdate();
|
16
|
-
});
|
17
|
-
this.editor.image.notifier.on(EditorImageEventType.ExportViewportChanged, () => {
|
18
|
-
this.queueDropdownUpdate();
|
19
|
-
});
|
20
|
-
}
|
21
|
-
getTitle() {
|
22
|
-
return this.localizationTable.documentProperties;
|
23
|
-
}
|
24
|
-
createIcon() {
|
25
|
-
return this.editor.icons.makeConfigureDocumentIcon();
|
26
|
-
}
|
27
|
-
handleClick() {
|
28
|
-
this.setDropdownVisible(!this.isDropdownVisible());
|
29
|
-
this.queueDropdownUpdate();
|
30
|
-
}
|
31
|
-
queueDropdownUpdate() {
|
32
|
-
if (!this.dropdownUpdateQueued) {
|
33
|
-
requestAnimationFrame(() => this.updateDropdown());
|
34
|
-
this.dropdownUpdateQueued = true;
|
35
|
-
}
|
36
|
-
}
|
37
|
-
updateDropdown() {
|
38
|
-
this.dropdownUpdateQueued = false;
|
39
|
-
if (this.isDropdownVisible()) {
|
40
|
-
this.updateDropdownContent();
|
41
|
-
}
|
42
|
-
}
|
43
|
-
setBackgroundColor(color) {
|
44
|
-
this.editor.dispatch(this.editor.setBackgroundColor(color));
|
45
|
-
}
|
46
|
-
getBackgroundColor() {
|
47
|
-
return this.editor.estimateBackgroundColor();
|
48
|
-
}
|
49
|
-
updateImportExportRectSize(size) {
|
50
|
-
const filterDimension = (dim) => {
|
51
|
-
if (dim !== undefined && (!isFinite(dim) || dim <= 0)) {
|
52
|
-
dim = 100;
|
53
|
-
}
|
54
|
-
return dim;
|
55
|
-
};
|
56
|
-
const width = filterDimension(size.width);
|
57
|
-
const height = filterDimension(size.height);
|
58
|
-
const currentRect = this.editor.getImportExportRect();
|
59
|
-
const newRect = new Rect2(currentRect.x, currentRect.y, width !== null && width !== void 0 ? width : currentRect.w, height !== null && height !== void 0 ? height : currentRect.h);
|
60
|
-
this.editor.dispatch(this.editor.image.setImportExportRect(newRect));
|
61
|
-
this.editor.queueRerender();
|
62
|
-
}
|
63
|
-
fillDropdown(dropdown) {
|
64
|
-
const container = document.createElement('div');
|
65
|
-
container.classList.add(`${toolbarCSSPrefix}spacedList`);
|
66
|
-
const backgroundColorRow = document.createElement('div');
|
67
|
-
const backgroundColorLabel = document.createElement('label');
|
68
|
-
backgroundColorLabel.innerText = this.localizationTable.backgroundColor;
|
69
|
-
const [colorInput, backgroundColorInputContainer, setBgColorInputValue] = makeColorInput(this.editor, color => {
|
70
|
-
if (!color.eq(this.getBackgroundColor())) {
|
71
|
-
this.setBackgroundColor(color);
|
72
|
-
}
|
73
|
-
});
|
74
|
-
colorInput.id = `${toolbarCSSPrefix}docPropertiesColorInput-${DocumentPropertiesWidget.idCounter++}`;
|
75
|
-
backgroundColorLabel.htmlFor = colorInput.id;
|
76
|
-
backgroundColorRow.replaceChildren(backgroundColorLabel, backgroundColorInputContainer);
|
77
|
-
const addDimensionRow = (labelContent, onChange) => {
|
78
|
-
const row = document.createElement('div');
|
79
|
-
const label = document.createElement('label');
|
80
|
-
const spacer = document.createElement('span');
|
81
|
-
const input = document.createElement('input');
|
82
|
-
label.innerText = labelContent;
|
83
|
-
input.type = 'number';
|
84
|
-
input.min = '0';
|
85
|
-
input.id = `${toolbarCSSPrefix}docPropertiesDimensionRow-${DocumentPropertiesWidget.idCounter++}`;
|
86
|
-
label.htmlFor = input.id;
|
87
|
-
spacer.style.flexGrow = '1';
|
88
|
-
input.style.flexGrow = '2';
|
89
|
-
input.style.width = '25px';
|
90
|
-
row.style.display = 'flex';
|
91
|
-
input.oninput = () => {
|
92
|
-
onChange(parseFloat(input.value));
|
93
|
-
};
|
94
|
-
row.replaceChildren(label, spacer, input);
|
95
|
-
return {
|
96
|
-
setValue: (value) => {
|
97
|
-
input.value = value.toString();
|
98
|
-
},
|
99
|
-
element: row,
|
100
|
-
};
|
101
|
-
};
|
102
|
-
const imageWidthRow = addDimensionRow(this.localizationTable.imageWidthOption, (value) => {
|
103
|
-
this.updateImportExportRectSize({ width: value });
|
104
|
-
});
|
105
|
-
const imageHeightRow = addDimensionRow(this.localizationTable.imageHeightOption, (value) => {
|
106
|
-
this.updateImportExportRectSize({ height: value });
|
107
|
-
});
|
108
|
-
this.updateDropdownContent = () => {
|
109
|
-
setBgColorInputValue(this.getBackgroundColor());
|
110
|
-
const importExportRect = this.editor.getImportExportRect();
|
111
|
-
imageWidthRow.setValue(importExportRect.width);
|
112
|
-
imageHeightRow.setValue(importExportRect.height);
|
113
|
-
};
|
114
|
-
this.updateDropdownContent();
|
115
|
-
container.replaceChildren(backgroundColorRow, imageWidthRow.element, imageHeightRow.element);
|
116
|
-
dropdown.replaceChildren(container);
|
117
|
-
return true;
|
118
|
-
}
|
119
|
-
}
|
120
|
-
DocumentPropertiesWidget.idCounter = 0;
|
@@ -1,17 +0,0 @@
|
|
1
|
-
import Editor from '../../Editor';
|
2
|
-
import Eraser from '../../tools/Eraser';
|
3
|
-
import { ToolbarLocalization } from '../localization';
|
4
|
-
import BaseToolWidget from './BaseToolWidget';
|
5
|
-
import { SavedToolbuttonState } from './BaseWidget';
|
6
|
-
export default class EraserToolWidget extends BaseToolWidget {
|
7
|
-
private tool;
|
8
|
-
private thicknessInput;
|
9
|
-
constructor(editor: Editor, tool: Eraser, localizationTable?: ToolbarLocalization);
|
10
|
-
protected getTitle(): string;
|
11
|
-
protected createIcon(): Element;
|
12
|
-
private updateInputs;
|
13
|
-
private static nextThicknessInputId;
|
14
|
-
protected fillDropdown(dropdown: HTMLElement): boolean;
|
15
|
-
serializeState(): SavedToolbuttonState;
|
16
|
-
deserializeFrom(state: SavedToolbuttonState): void;
|
17
|
-
}
|
@@ -1,57 +0,0 @@
|
|
1
|
-
import { EditorEventType } from '../../types';
|
2
|
-
import { toolbarCSSPrefix } from '../HTMLToolbar';
|
3
|
-
import BaseToolWidget from './BaseToolWidget';
|
4
|
-
export default class EraserToolWidget extends BaseToolWidget {
|
5
|
-
constructor(editor, tool, localizationTable) {
|
6
|
-
super(editor, tool, 'eraser-tool-widget', localizationTable);
|
7
|
-
this.tool = tool;
|
8
|
-
this.thicknessInput = null;
|
9
|
-
this.editor.notifier.on(EditorEventType.ToolUpdated, toolEvt => {
|
10
|
-
if (toolEvt.kind === EditorEventType.ToolUpdated && toolEvt.tool === this.tool) {
|
11
|
-
this.updateInputs();
|
12
|
-
this.updateIcon();
|
13
|
-
}
|
14
|
-
});
|
15
|
-
}
|
16
|
-
getTitle() {
|
17
|
-
return this.localizationTable.eraser;
|
18
|
-
}
|
19
|
-
createIcon() {
|
20
|
-
return this.editor.icons.makeEraserIcon(this.tool.getThickness());
|
21
|
-
}
|
22
|
-
updateInputs() {
|
23
|
-
if (this.thicknessInput) {
|
24
|
-
this.thicknessInput.value = `${this.tool.getThickness()}`;
|
25
|
-
}
|
26
|
-
}
|
27
|
-
fillDropdown(dropdown) {
|
28
|
-
const thicknessLabel = document.createElement('label');
|
29
|
-
this.thicknessInput = document.createElement('input');
|
30
|
-
this.thicknessInput.type = 'range';
|
31
|
-
this.thicknessInput.min = '4';
|
32
|
-
this.thicknessInput.max = '40';
|
33
|
-
this.thicknessInput.oninput = () => {
|
34
|
-
this.tool.setThickness(parseFloat(this.thicknessInput.value));
|
35
|
-
};
|
36
|
-
this.thicknessInput.id = `${toolbarCSSPrefix}eraserThicknessInput${EraserToolWidget.nextThicknessInputId++}`;
|
37
|
-
thicknessLabel.innerText = this.localizationTable.thicknessLabel;
|
38
|
-
thicknessLabel.htmlFor = this.thicknessInput.id;
|
39
|
-
this.updateInputs();
|
40
|
-
dropdown.replaceChildren(thicknessLabel, this.thicknessInput);
|
41
|
-
return true;
|
42
|
-
}
|
43
|
-
serializeState() {
|
44
|
-
return Object.assign(Object.assign({}, super.serializeState()), { thickness: this.tool.getThickness() });
|
45
|
-
}
|
46
|
-
deserializeFrom(state) {
|
47
|
-
super.deserializeFrom(state);
|
48
|
-
if (state.thickness) {
|
49
|
-
const parsedThickness = parseFloat(state.thickness);
|
50
|
-
if (typeof parsedThickness !== 'number' || !isFinite(parsedThickness)) {
|
51
|
-
throw new Error(`Deserializing property ${parsedThickness} is not a number or is not finite.`);
|
52
|
-
}
|
53
|
-
this.tool.setThickness(parsedThickness);
|
54
|
-
}
|
55
|
-
}
|
56
|
-
}
|
57
|
-
EraserToolWidget.nextThicknessInputId = 0;
|
@@ -1,17 +0,0 @@
|
|
1
|
-
import Editor from '../../Editor';
|
2
|
-
import PanZoom from '../../tools/PanZoom';
|
3
|
-
import { ToolbarLocalization } from '../localization';
|
4
|
-
import BaseToolWidget from './BaseToolWidget';
|
5
|
-
import { SavedToolbuttonState } from './BaseWidget';
|
6
|
-
export default class HandToolWidget extends BaseToolWidget {
|
7
|
-
protected overridePanZoomTool: PanZoom;
|
8
|
-
private allowTogglingBaseTool;
|
9
|
-
constructor(editor: Editor, overridePanZoomTool: PanZoom, localizationTable: ToolbarLocalization);
|
10
|
-
private static getPrimaryHandTool;
|
11
|
-
protected getTitle(): string;
|
12
|
-
protected createIcon(): Element;
|
13
|
-
protected handleClick(): void;
|
14
|
-
setSelected(selected: boolean): void;
|
15
|
-
serializeState(): SavedToolbuttonState;
|
16
|
-
deserializeFrom(state: SavedToolbuttonState): void;
|
17
|
-
}
|
@@ -1,172 +0,0 @@
|
|
1
|
-
import Mat33 from '../../math/Mat33';
|
2
|
-
import PanZoom, { PanZoomMode } from '../../tools/PanZoom';
|
3
|
-
import { EditorEventType } from '../../types';
|
4
|
-
import Viewport from '../../Viewport';
|
5
|
-
import { toolbarCSSPrefix } from '../HTMLToolbar';
|
6
|
-
import BaseToolWidget from './BaseToolWidget';
|
7
|
-
import BaseWidget from './BaseWidget';
|
8
|
-
const makeZoomControl = (localizationTable, editor) => {
|
9
|
-
const zoomLevelRow = document.createElement('div');
|
10
|
-
const increaseButton = document.createElement('button');
|
11
|
-
const decreaseButton = document.createElement('button');
|
12
|
-
const resetViewButton = document.createElement('button');
|
13
|
-
const zoomLevelDisplay = document.createElement('span');
|
14
|
-
increaseButton.innerText = '+';
|
15
|
-
decreaseButton.innerText = '-';
|
16
|
-
resetViewButton.innerText = localizationTable.resetView;
|
17
|
-
zoomLevelRow.replaceChildren(zoomLevelDisplay, increaseButton, decreaseButton, resetViewButton);
|
18
|
-
zoomLevelRow.classList.add(`${toolbarCSSPrefix}zoomLevelEditor`);
|
19
|
-
zoomLevelDisplay.classList.add('zoomDisplay');
|
20
|
-
let lastZoom;
|
21
|
-
const updateZoomDisplay = () => {
|
22
|
-
let zoomLevel = editor.viewport.getScaleFactor() * 100;
|
23
|
-
if (zoomLevel > 0.1) {
|
24
|
-
zoomLevel = Math.round(zoomLevel * 10) / 10;
|
25
|
-
}
|
26
|
-
else {
|
27
|
-
zoomLevel = Math.round(zoomLevel * 1000) / 1000;
|
28
|
-
}
|
29
|
-
if (zoomLevel !== lastZoom) {
|
30
|
-
zoomLevelDisplay.innerText = localizationTable.zoomLevel(zoomLevel);
|
31
|
-
lastZoom = zoomLevel;
|
32
|
-
}
|
33
|
-
};
|
34
|
-
updateZoomDisplay();
|
35
|
-
editor.notifier.on(EditorEventType.ViewportChanged, (event) => {
|
36
|
-
if (event.kind === EditorEventType.ViewportChanged) {
|
37
|
-
updateZoomDisplay();
|
38
|
-
// Can't reset if already reset.
|
39
|
-
resetViewButton.disabled = event.newTransform.eq(Mat33.identity);
|
40
|
-
}
|
41
|
-
});
|
42
|
-
const zoomBy = (factor) => {
|
43
|
-
const screenCenter = editor.viewport.visibleRect.center;
|
44
|
-
const transformUpdate = Mat33.scaling2D(factor, screenCenter);
|
45
|
-
editor.dispatch(Viewport.transformBy(transformUpdate), false);
|
46
|
-
};
|
47
|
-
increaseButton.onclick = () => {
|
48
|
-
zoomBy(5.0 / 4);
|
49
|
-
};
|
50
|
-
decreaseButton.onclick = () => {
|
51
|
-
zoomBy(4.0 / 5);
|
52
|
-
};
|
53
|
-
resetViewButton.onclick = () => {
|
54
|
-
editor.dispatch(Viewport.transformBy(editor.viewport.canvasToScreenTransform.inverse()), true);
|
55
|
-
};
|
56
|
-
return zoomLevelRow;
|
57
|
-
};
|
58
|
-
class ZoomWidget extends BaseWidget {
|
59
|
-
constructor(editor, localizationTable) {
|
60
|
-
super(editor, 'zoom-widget', localizationTable);
|
61
|
-
// Make it possible to open the dropdown, even if this widget isn't selected.
|
62
|
-
this.container.classList.add('dropdownShowable');
|
63
|
-
}
|
64
|
-
getTitle() {
|
65
|
-
return this.localizationTable.zoom;
|
66
|
-
}
|
67
|
-
createIcon() {
|
68
|
-
return this.editor.icons.makeZoomIcon();
|
69
|
-
}
|
70
|
-
handleClick() {
|
71
|
-
this.setDropdownVisible(!this.isDropdownVisible());
|
72
|
-
}
|
73
|
-
fillDropdown(dropdown) {
|
74
|
-
dropdown.replaceChildren(makeZoomControl(this.localizationTable, this.editor));
|
75
|
-
return true;
|
76
|
-
}
|
77
|
-
}
|
78
|
-
class HandModeWidget extends BaseWidget {
|
79
|
-
constructor(editor, tool, flag, makeIcon, title, localizationTable) {
|
80
|
-
super(editor, `pan-mode-${flag}`, localizationTable);
|
81
|
-
this.tool = tool;
|
82
|
-
this.flag = flag;
|
83
|
-
this.makeIcon = makeIcon;
|
84
|
-
this.title = title;
|
85
|
-
editor.notifier.on(EditorEventType.ToolUpdated, toolEvt => {
|
86
|
-
if (toolEvt.kind === EditorEventType.ToolUpdated && toolEvt.tool === tool) {
|
87
|
-
const allEnabled = !!(tool.getMode() & PanZoomMode.SinglePointerGestures);
|
88
|
-
this.setSelected(!!(tool.getMode() & flag) || allEnabled);
|
89
|
-
// Unless this widget toggles all single pointer gestures, toggling while
|
90
|
-
// single pointer gestures are enabled should have no effect
|
91
|
-
this.setDisabled(allEnabled && flag !== PanZoomMode.SinglePointerGestures);
|
92
|
-
}
|
93
|
-
});
|
94
|
-
this.setSelected(false);
|
95
|
-
}
|
96
|
-
setModeFlag(enabled) {
|
97
|
-
this.tool.setModeEnabled(this.flag, enabled);
|
98
|
-
}
|
99
|
-
handleClick() {
|
100
|
-
this.setModeFlag(!this.isSelected());
|
101
|
-
}
|
102
|
-
getTitle() {
|
103
|
-
return this.title;
|
104
|
-
}
|
105
|
-
createIcon() {
|
106
|
-
return this.makeIcon();
|
107
|
-
}
|
108
|
-
fillDropdown(_dropdown) {
|
109
|
-
return false;
|
110
|
-
}
|
111
|
-
}
|
112
|
-
export default class HandToolWidget extends BaseToolWidget {
|
113
|
-
constructor(editor,
|
114
|
-
// Pan zoom tool that overrides all other tools (enabling this tool for a device
|
115
|
-
// causes that device to pan/zoom instead of interact with the primary tools)
|
116
|
-
overridePanZoomTool, localizationTable) {
|
117
|
-
const primaryHandTool = HandToolWidget.getPrimaryHandTool(editor.toolController);
|
118
|
-
const tool = primaryHandTool !== null && primaryHandTool !== void 0 ? primaryHandTool : overridePanZoomTool;
|
119
|
-
super(editor, tool, 'hand-tool-widget', localizationTable);
|
120
|
-
this.overridePanZoomTool = overridePanZoomTool;
|
121
|
-
// Only allow toggling a hand tool if we're using the primary hand tool and not the override
|
122
|
-
// hand tool for this button.
|
123
|
-
this.allowTogglingBaseTool = primaryHandTool !== null;
|
124
|
-
// Allow showing/hiding the dropdown, even if `overridePanZoomTool` isn't enabled.
|
125
|
-
if (!this.allowTogglingBaseTool) {
|
126
|
-
this.container.classList.add('dropdownShowable');
|
127
|
-
}
|
128
|
-
// Controls for the overriding hand tool.
|
129
|
-
const touchPanningWidget = new HandModeWidget(editor, overridePanZoomTool, PanZoomMode.OneFingerTouchGestures, () => this.editor.icons.makeTouchPanningIcon(), localizationTable.touchPanning, localizationTable);
|
130
|
-
const rotationLockWidget = new HandModeWidget(editor, overridePanZoomTool, PanZoomMode.RotationLocked, () => this.editor.icons.makeRotationLockIcon(), localizationTable.lockRotation, localizationTable);
|
131
|
-
this.addSubWidget(touchPanningWidget);
|
132
|
-
this.addSubWidget(rotationLockWidget);
|
133
|
-
this.addSubWidget(new ZoomWidget(editor, localizationTable));
|
134
|
-
}
|
135
|
-
static getPrimaryHandTool(toolController) {
|
136
|
-
const primaryPanZoomToolList = toolController.getPrimaryTools().filter(tool => tool instanceof PanZoom);
|
137
|
-
const primaryPanZoomTool = primaryPanZoomToolList[0];
|
138
|
-
return primaryPanZoomTool;
|
139
|
-
}
|
140
|
-
getTitle() {
|
141
|
-
return this.localizationTable.handTool;
|
142
|
-
}
|
143
|
-
createIcon() {
|
144
|
-
return this.editor.icons.makeHandToolIcon();
|
145
|
-
}
|
146
|
-
handleClick() {
|
147
|
-
if (this.allowTogglingBaseTool) {
|
148
|
-
super.handleClick();
|
149
|
-
}
|
150
|
-
else {
|
151
|
-
this.setDropdownVisible(!this.isDropdownVisible());
|
152
|
-
}
|
153
|
-
}
|
154
|
-
setSelected(selected) {
|
155
|
-
if (this.allowTogglingBaseTool) {
|
156
|
-
super.setSelected(selected);
|
157
|
-
}
|
158
|
-
}
|
159
|
-
serializeState() {
|
160
|
-
const toolMode = this.overridePanZoomTool.getMode();
|
161
|
-
return Object.assign(Object.assign({}, super.serializeState()), { touchPanning: toolMode & PanZoomMode.OneFingerTouchGestures, rotationLocked: toolMode & PanZoomMode.RotationLocked });
|
162
|
-
}
|
163
|
-
deserializeFrom(state) {
|
164
|
-
if (state.touchPanning !== undefined) {
|
165
|
-
this.overridePanZoomTool.setModeEnabled(PanZoomMode.OneFingerTouchGestures, state.touchPanning);
|
166
|
-
}
|
167
|
-
if (state.rotationLocked !== undefined) {
|
168
|
-
this.overridePanZoomTool.setModeEnabled(PanZoomMode.RotationLocked, state.rotationLocked);
|
169
|
-
}
|
170
|
-
super.deserializeFrom(state);
|
171
|
-
}
|
172
|
-
}
|
@@ -1,19 +0,0 @@
|
|
1
|
-
import Editor from '../../Editor';
|
2
|
-
import { ToolbarLocalization } from '../localization';
|
3
|
-
import ActionButtonWidget from './ActionButtonWidget';
|
4
|
-
export default class InsertImageWidget extends ActionButtonWidget {
|
5
|
-
private imageSelectionOverlay;
|
6
|
-
private imagePreview;
|
7
|
-
private imageFileInput;
|
8
|
-
private imageAltTextInput;
|
9
|
-
private statusView;
|
10
|
-
private imageBase64URL;
|
11
|
-
private submitButton;
|
12
|
-
constructor(editor: Editor, localization?: ToolbarLocalization);
|
13
|
-
private static nextInputId;
|
14
|
-
private fillOverlay;
|
15
|
-
private hideDialog;
|
16
|
-
private updateImageSizeDisplay;
|
17
|
-
private clearInputs;
|
18
|
-
private onClicked;
|
19
|
-
}
|
@@ -1,170 +0,0 @@
|
|
1
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
2
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
3
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
4
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
5
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
6
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
7
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
8
|
-
});
|
9
|
-
};
|
10
|
-
import ImageComponent from '../../components/ImageComponent';
|
11
|
-
import Erase from '../../commands/Erase';
|
12
|
-
import EditorImage from '../../EditorImage';
|
13
|
-
import uniteCommands from '../../commands/uniteCommands';
|
14
|
-
import SelectionTool from '../../tools/SelectionTool/SelectionTool';
|
15
|
-
import Mat33 from '../../math/Mat33';
|
16
|
-
import fileToBase64 from '../../util/fileToBase64';
|
17
|
-
import ActionButtonWidget from './ActionButtonWidget';
|
18
|
-
export default class InsertImageWidget extends ActionButtonWidget {
|
19
|
-
constructor(editor, localization) {
|
20
|
-
localization !== null && localization !== void 0 ? localization : (localization = editor.localization);
|
21
|
-
super(editor, 'insert-image-widget', () => editor.icons.makeInsertImageIcon(), localization.image, () => this.onClicked());
|
22
|
-
this.imageSelectionOverlay = document.createElement('div');
|
23
|
-
this.imageSelectionOverlay.classList.add('toolbar-image-selection-overlay');
|
24
|
-
this.fillOverlay();
|
25
|
-
this.editor.createHTMLOverlay(this.imageSelectionOverlay);
|
26
|
-
this.imageSelectionOverlay.style.display = 'none';
|
27
|
-
}
|
28
|
-
fillOverlay() {
|
29
|
-
const container = document.createElement('div');
|
30
|
-
const chooseImageRow = document.createElement('div');
|
31
|
-
const altTextRow = document.createElement('div');
|
32
|
-
this.imagePreview = document.createElement('img');
|
33
|
-
this.statusView = document.createElement('div');
|
34
|
-
const actionButtonRow = document.createElement('div');
|
35
|
-
actionButtonRow.classList.add('action-button-row');
|
36
|
-
this.submitButton = document.createElement('button');
|
37
|
-
const cancelButton = document.createElement('button');
|
38
|
-
this.imageFileInput = document.createElement('input');
|
39
|
-
this.imageAltTextInput = document.createElement('input');
|
40
|
-
const imageFileInputLabel = document.createElement('label');
|
41
|
-
const imageAltTextLabel = document.createElement('label');
|
42
|
-
const fileInputId = `insert-image-file-input-${InsertImageWidget.nextInputId++}`;
|
43
|
-
const altTextInputId = `insert-image-alt-text-input-${InsertImageWidget.nextInputId++}`;
|
44
|
-
this.imageFileInput.setAttribute('id', fileInputId);
|
45
|
-
this.imageAltTextInput.setAttribute('id', altTextInputId);
|
46
|
-
imageAltTextLabel.htmlFor = altTextInputId;
|
47
|
-
imageFileInputLabel.htmlFor = fileInputId;
|
48
|
-
this.imageFileInput.accept = 'image/*';
|
49
|
-
imageAltTextLabel.innerText = this.localizationTable.inputAltText;
|
50
|
-
imageFileInputLabel.innerText = this.localizationTable.chooseFile;
|
51
|
-
this.imageFileInput.type = 'file';
|
52
|
-
this.imageAltTextInput.type = 'text';
|
53
|
-
this.statusView.setAttribute('aria-live', 'polite');
|
54
|
-
cancelButton.innerText = this.localizationTable.cancel;
|
55
|
-
this.submitButton.innerText = this.localizationTable.submit;
|
56
|
-
this.imageFileInput.onchange = () => __awaiter(this, void 0, void 0, function* () {
|
57
|
-
if (this.imageFileInput.value === '' || !this.imageFileInput.files || !this.imageFileInput.files[0]) {
|
58
|
-
this.imagePreview.style.display = 'none';
|
59
|
-
this.submitButton.disabled = true;
|
60
|
-
return;
|
61
|
-
}
|
62
|
-
this.imagePreview.style.display = 'block';
|
63
|
-
const image = this.imageFileInput.files[0];
|
64
|
-
let data = null;
|
65
|
-
try {
|
66
|
-
data = yield fileToBase64(image);
|
67
|
-
}
|
68
|
-
catch (e) {
|
69
|
-
this.statusView.innerText = this.localizationTable.imageLoadError(e);
|
70
|
-
}
|
71
|
-
this.imageBase64URL = data;
|
72
|
-
if (data) {
|
73
|
-
this.imagePreview.src = data;
|
74
|
-
this.submitButton.disabled = false;
|
75
|
-
this.updateImageSizeDisplay();
|
76
|
-
}
|
77
|
-
else {
|
78
|
-
this.submitButton.disabled = true;
|
79
|
-
this.statusView.innerText = '';
|
80
|
-
}
|
81
|
-
});
|
82
|
-
cancelButton.onclick = () => {
|
83
|
-
this.hideDialog();
|
84
|
-
};
|
85
|
-
this.imageSelectionOverlay.onclick = (evt) => {
|
86
|
-
// If clicking on the backdrop
|
87
|
-
if (evt.target === this.imageSelectionOverlay) {
|
88
|
-
this.hideDialog();
|
89
|
-
}
|
90
|
-
};
|
91
|
-
chooseImageRow.replaceChildren(imageFileInputLabel, this.imageFileInput);
|
92
|
-
altTextRow.replaceChildren(imageAltTextLabel, this.imageAltTextInput);
|
93
|
-
actionButtonRow.replaceChildren(cancelButton, this.submitButton);
|
94
|
-
container.replaceChildren(chooseImageRow, altTextRow, this.imagePreview, this.statusView, actionButtonRow);
|
95
|
-
this.imageSelectionOverlay.replaceChildren(container);
|
96
|
-
}
|
97
|
-
hideDialog() {
|
98
|
-
this.imageSelectionOverlay.style.display = 'none';
|
99
|
-
}
|
100
|
-
updateImageSizeDisplay() {
|
101
|
-
var _a;
|
102
|
-
const imageData = (_a = this.imageBase64URL) !== null && _a !== void 0 ? _a : '';
|
103
|
-
const sizeInKiB = imageData.length / 1024;
|
104
|
-
const sizeInMiB = sizeInKiB / 1024;
|
105
|
-
let units = 'KiB';
|
106
|
-
let size = sizeInKiB;
|
107
|
-
if (sizeInMiB >= 1) {
|
108
|
-
size = sizeInMiB;
|
109
|
-
units = 'MiB';
|
110
|
-
}
|
111
|
-
this.statusView.innerText = this.localizationTable.imageSize(Math.round(size), units);
|
112
|
-
}
|
113
|
-
clearInputs() {
|
114
|
-
this.imageFileInput.value = '';
|
115
|
-
this.imageAltTextInput.value = '';
|
116
|
-
this.imagePreview.style.display = 'none';
|
117
|
-
this.submitButton.disabled = true;
|
118
|
-
this.statusView.innerText = '';
|
119
|
-
}
|
120
|
-
onClicked() {
|
121
|
-
var _a;
|
122
|
-
this.imageSelectionOverlay.style.display = '';
|
123
|
-
this.clearInputs();
|
124
|
-
this.imageFileInput.focus();
|
125
|
-
const selectionTools = this.editor.toolController.getMatchingTools(SelectionTool);
|
126
|
-
const selectedObjects = selectionTools.map(tool => tool.getSelectedObjects()).flat();
|
127
|
-
let editingImage = null;
|
128
|
-
if (selectedObjects.length === 1 && selectedObjects[0] instanceof ImageComponent) {
|
129
|
-
editingImage = selectedObjects[0];
|
130
|
-
this.imageAltTextInput.value = (_a = editingImage.getAltText()) !== null && _a !== void 0 ? _a : '';
|
131
|
-
this.imagePreview.style.display = 'block';
|
132
|
-
this.submitButton.disabled = false;
|
133
|
-
this.imageBase64URL = editingImage.getURL();
|
134
|
-
this.imagePreview.src = this.imageBase64URL;
|
135
|
-
this.updateImageSizeDisplay();
|
136
|
-
}
|
137
|
-
else {
|
138
|
-
selectionTools.forEach(tool => tool.clearSelection());
|
139
|
-
}
|
140
|
-
this.submitButton.onclick = () => __awaiter(this, void 0, void 0, function* () {
|
141
|
-
var _b;
|
142
|
-
if (!this.imageBase64URL) {
|
143
|
-
return;
|
144
|
-
}
|
145
|
-
const image = new Image();
|
146
|
-
image.src = this.imageBase64URL;
|
147
|
-
image.setAttribute('alt', this.imageAltTextInput.value);
|
148
|
-
const component = yield ImageComponent.fromImage(image, Mat33.identity);
|
149
|
-
if (component.getBBox().area === 0) {
|
150
|
-
this.statusView.innerText = this.localizationTable.errorImageHasZeroSize;
|
151
|
-
return;
|
152
|
-
}
|
153
|
-
this.imageSelectionOverlay.style.display = 'none';
|
154
|
-
if (editingImage) {
|
155
|
-
const eraseCommand = new Erase([editingImage]);
|
156
|
-
yield this.editor.dispatch(uniteCommands([
|
157
|
-
EditorImage.addElement(component),
|
158
|
-
component.transformBy(editingImage.getTransformation()),
|
159
|
-
component.setZIndex(editingImage.getZIndex()),
|
160
|
-
eraseCommand,
|
161
|
-
]));
|
162
|
-
(_b = selectionTools[0]) === null || _b === void 0 ? void 0 : _b.setSelection([component]);
|
163
|
-
}
|
164
|
-
else {
|
165
|
-
yield this.editor.addAndCenterComponents([component]);
|
166
|
-
}
|
167
|
-
});
|
168
|
-
}
|
169
|
-
}
|
170
|
-
InsertImageWidget.nextInputId = 0;
|
@@ -1,25 +0,0 @@
|
|
1
|
-
import Editor from '../../Editor';
|
2
|
-
import { ToolbarLocalization } from '../localization';
|
3
|
-
import BaseWidget from './BaseWidget';
|
4
|
-
export default class OverflowWidget extends BaseWidget {
|
5
|
-
private overflowChildren;
|
6
|
-
private overflowContainer;
|
7
|
-
constructor(editor: Editor, localizationTable?: ToolbarLocalization);
|
8
|
-
protected getTitle(): string;
|
9
|
-
protected createIcon(): Element | null;
|
10
|
-
protected handleClick(): void;
|
11
|
-
protected fillDropdown(dropdown: HTMLElement): boolean;
|
12
|
-
/**
|
13
|
-
* Removes all `BaseWidget`s from this and returns them.
|
14
|
-
*/
|
15
|
-
clearChildren(): BaseWidget[];
|
16
|
-
getChildWidgets(): BaseWidget[];
|
17
|
-
hasAsChild(widget: BaseWidget): boolean;
|
18
|
-
/**
|
19
|
-
* Adds `widget` to this.
|
20
|
-
* `widget`'s previous parent is still responsible
|
21
|
-
* for serializing/deserializing its state.
|
22
|
-
*/
|
23
|
-
addToOverflow(widget: BaseWidget): void;
|
24
|
-
canBeInOverflowMenu(): boolean;
|
25
|
-
}
|
@@ -1,71 +0,0 @@
|
|
1
|
-
import BaseWidget from './BaseWidget';
|
2
|
-
export default class OverflowWidget extends BaseWidget {
|
3
|
-
constructor(editor, localizationTable) {
|
4
|
-
var _a;
|
5
|
-
super(editor, 'overflow-widget', localizationTable);
|
6
|
-
this.overflowChildren = [];
|
7
|
-
this.container.classList.add('toolbar-overflow-widget');
|
8
|
-
// Make the dropdown openable
|
9
|
-
this.container.classList.add('dropdownShowable');
|
10
|
-
(_a = this.overflowContainer) !== null && _a !== void 0 ? _a : (this.overflowContainer = document.createElement('div'));
|
11
|
-
}
|
12
|
-
getTitle() {
|
13
|
-
return this.localizationTable.toggleOverflow;
|
14
|
-
}
|
15
|
-
createIcon() {
|
16
|
-
return this.editor.icons.makeOverflowIcon();
|
17
|
-
}
|
18
|
-
handleClick() {
|
19
|
-
this.setDropdownVisible(!this.isDropdownVisible());
|
20
|
-
}
|
21
|
-
fillDropdown(dropdown) {
|
22
|
-
var _a;
|
23
|
-
(_a = this.overflowContainer) !== null && _a !== void 0 ? _a : (this.overflowContainer = document.createElement('div'));
|
24
|
-
if (this.overflowContainer.parentElement) {
|
25
|
-
this.overflowContainer.remove();
|
26
|
-
}
|
27
|
-
this.overflowContainer.classList.add('toolbar-overflow-widget-overflow-list');
|
28
|
-
dropdown.appendChild(this.overflowContainer);
|
29
|
-
return true;
|
30
|
-
}
|
31
|
-
/**
|
32
|
-
* Removes all `BaseWidget`s from this and returns them.
|
33
|
-
*/
|
34
|
-
clearChildren() {
|
35
|
-
this.overflowContainer.replaceChildren();
|
36
|
-
this.container.classList.remove('horizontal');
|
37
|
-
const overflowChildren = this.overflowChildren;
|
38
|
-
this.overflowChildren = [];
|
39
|
-
return overflowChildren;
|
40
|
-
}
|
41
|
-
getChildWidgets() {
|
42
|
-
return [...this.overflowChildren];
|
43
|
-
}
|
44
|
-
hasAsChild(widget) {
|
45
|
-
for (const otherWidget of this.overflowChildren) {
|
46
|
-
if (widget === otherWidget) {
|
47
|
-
return true;
|
48
|
-
}
|
49
|
-
}
|
50
|
-
return false;
|
51
|
-
}
|
52
|
-
/**
|
53
|
-
* Adds `widget` to this.
|
54
|
-
* `widget`'s previous parent is still responsible
|
55
|
-
* for serializing/deserializing its state.
|
56
|
-
*/
|
57
|
-
addToOverflow(widget) {
|
58
|
-
this.overflowChildren.push(widget);
|
59
|
-
widget.addTo(this.overflowContainer);
|
60
|
-
widget.setIsToplevel(false);
|
61
|
-
// Switch to a horizontal layout if enough children
|
62
|
-
if (this.overflowChildren.length > 2) {
|
63
|
-
this.container.classList.add('horizontal');
|
64
|
-
}
|
65
|
-
}
|
66
|
-
// This always returns false.
|
67
|
-
// Don't try to move the overflow menu to itself.
|
68
|
-
canBeInOverflowMenu() {
|
69
|
-
return false;
|
70
|
-
}
|
71
|
-
}
|