@aurigma/design-atoms
Version:
Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.
966 lines • 59.3 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
import { PointF } from "@aurigma/design-atoms-model/Math";
import { EventObject, EventWithSenderArg } from "@aurigma/design-atoms-model/EventObject";
import { Environment } from "@aurigma/design-atoms-model/Utils/Environment";
import { ArchedTextItem, BoundedTextItem, CurvedTextItem, OverflowStrategy, PathBoundedTextItem, PlainTextItem, TextAlignment } from "@aurigma/design-atoms-model/Product/Items";
import { Keys } from "@aurigma/design-atoms-text/TextEditor";
import { DefaultStyleExtractor } from "@aurigma/design-atoms-text/Serialization/DefaultStyleExtractor";
import { ColorPalette } from "@aurigma/design-atoms-text/Serialization/Model/ColorPalette";
import { ParagraphAlignment } from "@aurigma/design-atoms-text/Model";
import { ListStyleSheetManagerFactory } from "@aurigma/design-atoms-text/TextEditor/Services";
import { TextWhizzWrapper } from "@aurigma/design-atoms-text/TextEditor/TextWhizz/TextWhizzWrapper";
import { MouseEventType } from "@aurigma/design-atoms-text/TextEditor/Enums/MouseEventType";
import { NewTextEditor } from "@aurigma/design-atoms-text/TextEditor/NewTextEditor";
import { NewBoundedTextItemHandler, NewCurvedTextItemHandler, NewPlainTextItemHandler, NewArchedTextItemHandler, } from "../ItemHandlers";
import { TextStateType } from "./TextStateType";
import { ItemUtils } from "../Utils/ItemUtils";
import { Cursor, Utils } from "../Utils/Common";
import { MouseCommandType } from "./MouseCommandType";
import { MobileTextEditor } from "@aurigma/design-atoms-text/TextEditor/MobileTextEditor";
import { UpdateTextTriggerType } from "./UpdateTextTriggerType";
import { TextWhizzInitData } from "./TextWhizzInitData";
import { InputType, InputState } from "./../Input/InputManager/IInputManager";
import { Deferred } from "../Utils/Deferred";
import { ArgumentNullException } from "@aurigma/design-atoms-model";
//TODO:
// 1) Split controllers for mobile and TextWhizz version.
// 2) Remove dependency on Canvas and TextRenderer.
/**
* Manages a text editor (TextWhizz or mobile versions).
* @remarks The text editor is shared by item handlers, we get it from 'Canvas' entry. The TextWhizz is used as a text engine.
*/
var TextEditorController = /** @class */ (function () {
function TextEditorController(itemHandler, _textWhizz, textRenderer, activeTextCanvasHandler, viewerConfig, fontRegistry, colorParser, textFormattingEnabled, getTextEditor) {
var _this = this;
this._textWhizz = _textWhizz;
// events
this._exitedEditModeEvent = new EventWithSenderArg();
this._enteredEditModeEvent = new EventWithSenderArg();
this._userZoomInProgress = false;
this._waitUpdatePromise = null;
this._onMobileTextEditorInitialized = function () {
if (_this._itemHandler === _this._canvas.currentItemHandler)
_this.enterEditMode(0, 0);
else
_this._canvas.redraw();
};
this._onSelectedItemHandlerChanged = function () { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!(this._textState === TextStateType.InEdit)) return [3 /*break*/, 2];
return [4 /*yield*/, this.exitEditMode()];
case 1:
_a.sent();
_a.label = 2;
case 2: return [4 /*yield*/, this._setTextState(this.isOnlyThisItemSelected()
? TextStateType.Active
: TextStateType.Static)];
case 3:
_a.sent();
return [2 /*return*/];
}
});
}); };
this._onCanvasSelectionLocked = function () {
if (_this.isStatic)
return;
_this._isTextImageValid = false;
_this._updateTextImage();
};
this._onTextStateChanged = function () { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!this.ready || this._userZoomInProgress)
return [2 /*return*/];
if (!!(this.isStatic && this._isTextImageValid || this.isMobile && this.isInEdit)) return [3 /*break*/, 2];
return [4 /*yield*/, this._updateText(UpdateTextTriggerType.Frame)];
case 1:
_a.sent();
_a.label = 2;
case 2:
this._redrawText();
return [2 /*return*/];
}
});
}); };
this._onCanvasScroll = function () {
if (_this._textState == TextStateType.InEdit)
_this._textEditor.processZoomChangedEvent();
};
this._onCanvasZoomChanged = function (args) { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
this._userZoomInProgress = !args.fullUpdate;
if (!args.fullUpdate) return [3 /*break*/, 3];
if (!(this._textState !== TextStateType.InEdit)) return [3 /*break*/, 2];
return [4 /*yield*/, this._setTextState(this.isOnlyThisItemSelected()
? TextStateType.Active
: TextStateType.Static)];
case 1:
_a.sent();
_a.label = 2;
case 2:
this._isTextImageValid = false;
this._redrawText();
_a.label = 3;
case 3:
if (this._textState == TextStateType.InEdit)
this._textEditor.processZoomChangedEvent();
return [2 /*return*/];
}
});
}); };
this._onFrameChanged = function (frame) {
_this.updateItemHandler(frame);
};
this._onStyleChanged = function () {
_this.updateItemHandler();
_this._canvas.redrawDesign();
_this._canvas.updateSelection();
};
this._onInvalidInput = function () { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, this.exitEditMode()];
case 1:
_a.sent();
return [2 /*return*/];
}
});
}); };
if (_textWhizz == null)
throw new ArgumentNullException("TextEditorController: textWhizz must not be null.");
this._getTextEditor = getTextEditor;
// dependencies
this._itemHandler = itemHandler;
this._canvas = this._itemHandler.canvas;
this._textRenderer = textRenderer;
this._colorParser = colorParser;
this._viewerConfiguration = viewerConfig;
this._textFormattingEnabled = textFormattingEnabled;
this._activeTextCanvasHandler = activeTextCanvasHandler;
this._listStyleSheetManagerFactory = new ListStyleSheetManagerFactory(Utils.getListSettingFromConfig(viewerConfig.listSettings));
this._listStyleSheetManager = this._listStyleSheetManagerFactory.create();
this._colorPreviewService = this._itemHandler.colorPreviewService;
this._fontRegistry = fontRegistry;
// text engine wrapper
this._tw = this._createEngineWrapper(fontRegistry);
// internal variables (default)
this._textStateValue = this.isOnlyThisItemSelected() ? TextStateType.Active : TextStateType.Static;
this._textImageChanged = new EventObject();
this._initialFormattedText = '';
this._isEnterToEditModeLocked = false;
this._isExitFromEditModeLocked = false;
this._mouseDownStartedInside = false;
this._isTextImageValid = false;
this._isDisposed = false;
this._isCropped = null;
this._ready = false;
this._failed = false;
}
Object.defineProperty(TextEditorController.prototype, "_textEditor", {
get: function () {
return this._getTextEditor();
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "isMobile", {
//#region - Status -
get: function () {
return this._textEditor instanceof MobileTextEditor;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "ready", {
get: function () {
return this._ready;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "failed", {
get: function () {
return this._failed;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "isStatic", {
get: function () {
return this._textState === TextStateType.Static;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "isActive", {
get: function () {
return this._textState === TextStateType.Active;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "isInEdit", {
get: function () {
return this._textState === TextStateType.InEdit;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "isCropped", {
get: function () {
if (this._isCropped == null)
this._isCropped = this._tw.textMeasurer.isTextCropped();
return this._isCropped;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "enteredEditModeEvent", {
get: function () {
return this._enteredEditModeEvent;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "exitedEditModeEvent", {
get: function () {
return this._exitedEditModeEvent;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "activeTextEditor", {
get: function () {
return this._textState === TextStateType.InEdit ? this._textEditor : null;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "canRedo", {
get: function () {
return this._textEditor.canRedo;
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextEditorController.prototype, "canUndo", {
get: function () {
return this._textEditor.canUndo;
},
enumerable: true,
configurable: true
});
TextEditorController.prototype.waitUpdate = function () {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
if (this._ready)
return [2 /*return*/];
if (this._waitUpdatePromise != null)
return [2 /*return*/, this._waitUpdatePromise.promise];
this._updateText(UpdateTextTriggerType.Initialization);
if (this._waitUpdatePromise != null)
return [2 /*return*/, this._waitUpdatePromise.promise];
return [2 /*return*/];
});
});
};
TextEditorController.prototype.initialize = function () {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, this._initEngineWrapper()];
case 1:
_a.sent();
return [2 /*return*/];
}
});
});
};
TextEditorController.prototype.enterEditMode = function (x, y) {
return __awaiter(this, void 0, void 0, function () {
var enterToEditMode, point;
var _this = this;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!this._itemHandler.item.textPermissions.allowChangeText && !this._canvas.ignorePermissionsMode)
return [2 /*return*/];
if (!this._textEditor)
return [2 /*return*/];
if (this._textEditor.isActive || this._isEnterToEditModeLocked) {
console.warn("TextEditorController: Cannot enter to edit mode when the editor is active");
return [2 /*return*/];
}
this._isEnterToEditModeLocked = true;
enterToEditMode = function (point) { return __awaiter(_this, void 0, void 0, function () {
var _a;
return __generator(this, function (_b) {
switch (_b.label) {
case 0: return [4 /*yield*/, this._setTextState(TextStateType.InEdit)];
case 1:
_b.sent();
this._initialFormattedText = !this._itemHandler.isEmptyTextPlaceholder() ? this._itemHandler.item.text : '';
if (this._itemHandler instanceof NewBoundedTextItemHandler
&& ((_a = this._itemHandler.item) === null || _a === void 0 ? void 0 : _a.overflowStrategy) == OverflowStrategy.ExpandBox) {
this._initialBoundedRect = this._itemHandler.getTextRectangle().toRectangleF();
}
return [4 /*yield*/, this._initEngineWrapper(this._initialFormattedText)];
case 2:
_b.sent();
return [4 /*yield*/, this._initActiveTextEditor()];
case 3:
_b.sent();
this._bindToEditor();
this._textEditor.enterEditMode(point);
this._setCanvasForEnterToEdit();
this._enteredEditModeEvent.notify(this);
this._isEnterToEditModeLocked = false;
return [2 /*return*/];
}
});
}); };
point = { x: x, y: y };
if (!!this._itemHandler.item.transform.isEmpty) return [3 /*break*/, 2];
return [4 /*yield*/, this._itemHandler.frontEndUpdate()];
case 1:
_a.sent();
_a.label = 2;
case 2: return [4 /*yield*/, enterToEditMode(point)];
case 3:
_a.sent();
return [2 /*return*/];
}
});
});
};
TextEditorController.prototype.exitEditMode = function (isStayActive) {
if (isStayActive === void 0) { isStayActive = false; }
return __awaiter(this, void 0, void 0, function () {
var newText;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (this._textEditor == null || this._isExitFromEditModeLocked)
return [2 /*return*/];
this._isExitFromEditModeLocked = true;
return [4 /*yield*/, this._textEditor.getFormattedText()];
case 1:
newText = _a.sent();
this._textEditor.exitEditMode();
this._unbindFromEditor();
this._updateItemListStyles();
if (this._itemHandler.isEmptyTextPlaceholder())
this._restorePlaceholderText();
if (!(this._initialFormattedText !== newText)) return [3 /*break*/, 3];
return [4 /*yield*/, this._handleTextChanged(newText)];
case 2:
_a.sent();
_a.label = 3;
case 3:
// state change should be after text change processing
return [4 /*yield*/, this._setTextState(isStayActive ? TextStateType.Active : TextStateType.Static)];
case 4:
// state change should be after text change processing
_a.sent();
this._setCanvasForExitFromEdit();
this._exitedEditModeEvent.notify(this);
this._isExitFromEditModeLocked = false;
return [2 /*return*/];
}
});
});
};
TextEditorController.prototype.updateItemHandler = function (newFrame) {
this._isCropped = null;
var item = this._itemHandler.item;
var itemHandler = this._itemHandler;
var isPlainTextItem = itemHandler instanceof NewPlainTextItemHandler;
var isCurvedTextItem = itemHandler instanceof NewCurvedTextItemHandler;
var isArchedTextItem = itemHandler instanceof NewArchedTextItemHandler;
var isBoundedTextItem = itemHandler instanceof NewBoundedTextItemHandler && item instanceof BoundedTextItem;
var overflowStrategy = isBoundedTextItem ? item.overflowStrategy : null;
if (isPlainTextItem || isCurvedTextItem || isArchedTextItem) {
var handlerRect = newFrame;
if (newFrame == null || newFrame.isEmpty()) {
handlerRect = this.measureText();
}
this._itemHandler.updateRectangle(handlerRect, true);
this._tw.textHandler.setTextFrames(this._itemHandler.getFramesData(), false);
this._canvas.redrawDesign();
}
else if (isBoundedTextItem && overflowStrategy === OverflowStrategy.ExpandBox) {
var frame = newFrame !== null && newFrame !== void 0 ? newFrame : this.measureTextFrame(true);
if (frame && !frame.isEmpty()) {
if (frame.height > this._initialBoundedRect.height) {
var updateRect = this._initialBoundedRect.clone();
updateRect.height = frame.height + 1.5;
this._itemHandler.updateRectangle(updateRect, true);
}
else {
this._itemHandler.updateRectangle(this._initialBoundedRect, true);
}
}
this._tw.textHandler.setTextFrames(this._itemHandler.getFramesData(), false);
this._canvas.redrawDesign();
this._canvas.updateSelection();
this._itemHandler.raiseChanged();
}
else
this._itemHandler.raiseChanged();
};
TextEditorController.prototype.bindToCanvas = function (canvas) {
if (canvas == null)
return;
this._canvas = canvas;
this._canvas.add_onScroll(this._onCanvasScroll);
this._canvas.add_zoomChanged(this._onCanvasZoomChanged);
this._canvas.add_selectedItemHandlerChanged(this._onSelectedItemHandlerChanged);
this._canvas.add_onSelectionLocked(this._onCanvasSelectionLocked);
};
TextEditorController.prototype.unbindFromCanvas = function () {
var _a, _b, _c, _d;
(_a = this._canvas) === null || _a === void 0 ? void 0 : _a.remove_onScroll(this._onCanvasScroll);
(_b = this._canvas) === null || _b === void 0 ? void 0 : _b.remove_zoomChanged(this._onCanvasZoomChanged);
(_c = this._canvas) === null || _c === void 0 ? void 0 : _c.remove_selectedItemHandlerChanged(this._onSelectedItemHandlerChanged);
(_d = this._canvas) === null || _d === void 0 ? void 0 : _d.remove_onSelectionLocked(this._onCanvasSelectionLocked);
this._canvas = null;
};
TextEditorController.prototype.add_staticTextImageChanged = function (handler) {
this._textImageChanged.add(handler);
};
TextEditorController.prototype.remove_staticTextImageChanged = function (handler) {
this._textImageChanged.remove(handler);
};
TextEditorController.prototype.dispose = function () {
this.clearText();
this.unbindFromCanvas();
this._isDisposed = true;
};
TextEditorController.prototype.processKeyEvent = function (e) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!(e.code === Keys.Escape)) return [3 /*break*/, 2];
return [4 /*yield*/, this.exitEditMode(true)];
case 1:
_a.sent();
return [2 /*return*/, true];
case 2: return [4 /*yield*/, this._textEditor.processKeyEvent(e)];
case 3: return [2 /*return*/, _a.sent()];
}
});
});
};
TextEditorController.prototype.processMouseEvent = function (pointerParams, mouseOverCurrent) {
return __awaiter(this, void 0, void 0, function () {
var event, commandType, _a;
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
event = this._getMouseEvent(pointerParams);
this._updateMouseDownStartedInside(event.type, mouseOverCurrent);
commandType = this._getMouseCommandType(event, mouseOverCurrent);
_a = commandType;
switch (_a) {
case MouseCommandType.noProcessingRequired: return [3 /*break*/, 1];
case MouseCommandType.toProcessInEditMode: return [3 /*break*/, 2];
case MouseCommandType.enterToEditMode: return [3 /*break*/, 3];
case MouseCommandType.exitFromEditMode: return [3 /*break*/, 5];
case MouseCommandType.outsideSelection: return [3 /*break*/, 7];
}
return [3 /*break*/, 8];
case 1:
{
return [2 /*return*/, false];
}
_b.label = 2;
case 2:
{
if (!this.isMobile)
this._textEditor.processMouseEvent(event);
return [3 /*break*/, 8];
}
_b.label = 3;
case 3:
if (this._viewerConfiguration.rotatedTextInPlaceEditEnabled === false && ItemUtils.isRotated(this._itemHandler.item, this._canvas.contentAngle)) {
return [2 /*return*/, false];
}
if (this.isMobile && !this._textEditor.isReady) {
this._textEditor.editorInitialized.remove(this._onMobileTextEditorInitialized);
this._textEditor.editorInitialized.add(this._onMobileTextEditorInitialized);
this._canvas.redraw();
return [2 /*return*/, false];
}
return [4 /*yield*/, this.enterEditMode(event.x, event.y)];
case 4:
_b.sent();
return [3 /*break*/, 8];
case 5: return [4 /*yield*/, this.exitEditMode()];
case 6:
_b.sent();
return [2 /*return*/, false];
case 7:
{
this._canvas.enableSelection();
return [2 /*return*/, false];
}
_b.label = 8;
case 8:
this._defineCanvasCursor(mouseOverCurrent);
return [2 /*return*/, true];
}
});
});
};
TextEditorController.prototype.clearText = function () {
// clean
};
TextEditorController.prototype.updateText = function (trigger, force) {
if (force === void 0) { force = false; }
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, this._updateText(this._getUpdateTextTrigger(trigger), force)];
case 1:
_a.sent();
return [2 /*return*/];
}
});
});
};
TextEditorController.prototype.transformText = function (transform) {
var _a;
var item = this._itemHandler.item;
var center = this._itemHandler.getControlCenter();
var previewScale = item.previewScale;
var opacity = item.opacity;
var clippingPath = (_a = item.mask) === null || _a === void 0 ? void 0 : _a.vectorMask;
var engineHandler = this._tw.engineHandler;
this._textRenderer.transformText(engineHandler, transform, center, previewScale, opacity, clippingPath);
};
TextEditorController.prototype.measureText = function (extendToBlackBox) {
var previewScale = this._itemHandler.item.previewScale;
return this._tw.textMeasurer.measureText(previewScale, extendToBlackBox);
};
TextEditorController.prototype.measureTextFrame = function (useActiveText) {
if (useActiveText === void 0) { useActiveText = false; }
return this._tw.textMeasurer.measureTextFrames(useActiveText);
};
TextEditorController.prototype.redrawActiveText = function () {
var _a;
if (this._isDisposed)
return;
if (this._textState !== TextStateType.Active && this._textState !== TextStateType.InEdit)
return;
var item = this._itemHandler.item;
var useOpacityMultiplier = !this.isInEdit;
var opacityMultiplier = useOpacityMultiplier && this._itemHandler.isEmptyTextPlaceholder() ? 0.5 : 1;
var opacity = item.opacity * opacityMultiplier;
var textEngineHandler = this._tw.engineHandler;
var transform = item.transform;
var center = this._itemHandler.getControlCenter();
var previewScale = item.previewScale;
var clippingPath = this._textState !== TextStateType.InEdit ? (_a = item.mask) === null || _a === void 0 ? void 0 : _a.vectorMask : null;
this._textRenderer.drawText(textEngineHandler, transform, center, previewScale, opacity, clippingPath);
if (this._textState === TextStateType.InEdit)
this._textEditor.redraw();
};
TextEditorController.prototype.undo = function () {
this._textEditor.undo();
};
TextEditorController.prototype.redo = function () {
this._textEditor.redo();
};
TextEditorController.prototype._createEngineWrapper = function (fontRegistry) {
return new TextWhizzWrapper(this._textWhizz, fontRegistry.textWhizzFontRegistry, this._listStyleSheetManager, this._colorPreviewService, this._colorParser);
};
TextEditorController.prototype._getEngineWrapperInitData = function (text) {
if (text === void 0) { text = null; }
return __awaiter(this, void 0, void 0, function () {
var initData;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
initData = new TextWhizzInitData(this._itemHandler, this._colorPreviewService);
return [4 /*yield*/, initData.update(text)];
case 1:
_a.sent();
return [2 /*return*/, initData];
}
});
});
};
TextEditorController.prototype._initEngineWrapper = function (text) {
if (text === void 0) { text = null; }
return __awaiter(this, void 0, void 0, function () {
var missingFonts, _a, _b;
return __generator(this, function (_c) {
switch (_c.label) {
case 0:
missingFonts = this._getMissingFonts();
if (!(missingFonts.length > 0)) return [3 /*break*/, 2];
return [4 /*yield*/, this._fontRegistry.loadFonts(missingFonts)];
case 1:
_c.sent();
_c.label = 2;
case 2:
this._listStyleSheetManager.initialize(this._parseItemListStyles(this._itemHandler.item));
_b = (_a = this._tw).initialize;
return [4 /*yield*/, this._getEngineWrapperInitData(text)];
case 3:
_b.apply(_a, [_c.sent()]);
return [2 /*return*/];
}
});
});
};
TextEditorController.prototype._getTextWhizzEditorInitData = function () {
var item = this._itemHandler.item;
var itemHandler = this._itemHandler;
var isBoundedTextItem = itemHandler instanceof NewBoundedTextItemHandler && item instanceof BoundedTextItem;
var overflowStrategy = isBoundedTextItem ? item.overflowStrategy : null;
var textVerticalAlignment = isBoundedTextItem ? item.verticalAlignment : null;
var textFormattingEnabled = ItemUtils.getAllowTextFormatting(item, this._textFormattingEnabled);
var isEmptyTextPlaceholder = itemHandler.isEmptyTextPlaceholder();
var isSingleLineText = item instanceof ArchedTextItem || item instanceof CurvedTextItem;
return {
rectangle: itemHandler.rectangle.toRectangleF(),
previewScale: item.previewScale,
textVerticalAlignment: textVerticalAlignment,
overflowStrategy: overflowStrategy,
isBoundedText: isBoundedTextItem,
isTextFormattingEnabled: textFormattingEnabled,
isNewLineEnabled: !(item instanceof CurvedTextItem || item instanceof ArchedTextItem),
isEmptyTextPlaceholder: isEmptyTextPlaceholder,
limits: {
characterLimit: item.characterLimit,
maxLineCount: item.maxLineCount,
maxLineLength: item.maxLineLength,
isSingleLineText: isSingleLineText
}
};
};
TextEditorController.prototype._getMobileEditorInitData = function () {
return __awaiter(this, void 0, void 0, function () {
var item, alignment, isVertical, borderColorPreview, fillColorPreview, isSingleLineText, rectangle, _a;
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
item = this._itemHandler.item;
alignment = null;
if (item instanceof PlainTextItem || item instanceof CurvedTextItem)
alignment = item.alignment;
if (item instanceof ArchedTextItem)
alignment = TextAlignment.Center;
isVertical = false;
if (item instanceof PlainTextItem || item instanceof BoundedTextItem || item instanceof PathBoundedTextItem)
isVertical = item.isVertical;
return [4 /*yield*/, this._colorPreviewService.getPreviewAsync(item.borderColor)];
case 1:
borderColorPreview = _b.sent();
return [4 /*yield*/, this._colorPreviewService.getPreviewAsync(item.fillColor)];
case 2:
fillColorPreview = _b.sent();
isSingleLineText = item instanceof ArchedTextItem || item instanceof CurvedTextItem;
rectangle = this._itemHandler.rectangle.clone();
if (item instanceof ArchedTextItem || item instanceof CurvedTextItem) {
rectangle.translate(0, rectangle.height / 2);
rectangle.angle = 0;
}
_a = {
text: this._initialFormattedText,
rectangle: rectangle,
textAlignment: alignment
};
return [4 /*yield*/, TextWhizzInitData.getDefaultInlineStyle(item, this._colorPreviewService)];
case 3: return [2 /*return*/, (_a.defaultInlineStyle = _b.sent(),
_a.defaultParagraphStyle = TextWhizzInitData.getDefaultParagraphStyle(item),
_a.borderColor = borderColorPreview.toString(),
_a.borderWidth = item.borderWidth,
_a.fillColor = fillColorPreview.toString(),
_a.opacity = item.opacity,
_a.previewScale = item.previewScale,
_a.textFormattingEnabled = ItemUtils.getAllowTextFormatting(item, this._textFormattingEnabled),
_a.transform = item.transform,
_a.textVerticalAlignment = item instanceof BoundedTextItem ? item.verticalAlignment : null,
_a.listSettings = __assign({}, this._viewerConfiguration.listSettings),
_a.limits = {
characterLimit: item.characterLimit,
maxLineCount: item.maxLineCount,
maxLineLength: item.maxLineLength,
isSingleLineText: isSingleLineText
},
_a.isVertical = isVertical,
_a)];
}
});
});
};
TextEditorController.prototype._initActiveTextEditor = function () {
return __awaiter(this, void 0, void 0, function () {
var editorInitData, initData, colorPalette;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!this.activeTextEditor) return [3 /*break*/, 3];
editorInitData = this._getTextWhizzEditorInitData();
if (!(this._textEditor instanceof NewTextEditor)) return [3 /*break*/, 1];
this._textEditor.renderer.initialize(this._itemHandler);
this._textEditor.initialize(this._tw, editorInitData, this._listStyleSheetManager);
return [3 /*break*/, 3];
case 1:
if (!(this._textEditor instanceof MobileTextEditor)) return [3 /*break*/, 3];
return [4 /*yield*/, this._getMobileEditorInitData()];
case 2:
initData = _a.sent();
colorPalette = this._tw.colorPalette;
this._textEditor.initialize(initData, colorPalette, this._listStyleSheetManager);
_a.label = 3;
case 3: return [2 /*return*/];
}
});
});
};
TextEditorController.prototype._bindToEditor = function () {
this._textEditor.frameChanged.add(this._onFrameChanged);
this._textEditor.styleChanged.add(this._onStyleChanged);
this._textEditor.invalidCharEntered.add(this._onInvalidInput);
};
TextEditorController.prototype._unbindFromEditor = function () {
this._textEditor.frameChanged.remove(this._onFrameChanged);
this._textEditor.styleChanged.remove(this._onStyleChanged);
this._textEditor.invalidCharEntered.remove(this._onInvalidInput);
};
TextEditorController.prototype.redrawText = function () {
this._redrawText();
};
TextEditorController.prototype._getMissingFonts = function () {
var _this = this;
var itemFonts = this._itemHandler.getFonts();
return itemFonts.filter(function (font) { return !_this._fontRegistry.containsFonts([font]); });
};
TextEditorController.prototype._updateMouseDownStartedInside = function (eventType, mouseOverCurrent) {
if (this._textState !== TextStateType.InEdit)
return;
if (eventType === MouseEventType.mousedown)
this._mouseDownStartedInside = mouseOverCurrent;
if (eventType === MouseEventType.mouseup)
this._mouseDownStartedInside = false;
};
TextEditorController.prototype._getMouseCommandType = function (e, mouseOverCurrent) {
var isEditState = this._textState === TextStateType.InEdit;
switch (e.type) {
case MouseEventType.dblclick: {
if (!isEditState)
return MouseCommandType.enterToEditMode;
else
return mouseOverCurrent
? MouseCommandType.toProcessInEditMode
: MouseCommandType.exitFromEditMode;
}
case MouseEventType.mousedown: {
if (!isEditState)
return MouseCommandType.noProcessingRequired;
else
return mouseOverCurrent
? MouseCommandType.toProcessInEditMode
: MouseCommandType.noProcessingRequired;
}
case MouseEventType.mousemove: {
if (!isEditState)
return MouseCommandType.noProcessingRequired;
else {
var isExitFromEditMode = !mouseOverCurrent && e.isDrag && !this._mouseDownStartedInside && !Environment.IsTouchDevice();
return isExitFromEditMode
? MouseCommandType.exitFromEditMode
: MouseCommandType.toProcessInEditMode;
}
}
case MouseEventType.mouseup: {
if (!isEditState) {
return this.isOnlyThisItemSelected()
? MouseCommandType.enterToEditMode
: MouseCommandType.noProcessingRequired;
}
else
return !mouseOverCurrent && e.isClick
? MouseCommandType.exitFromEditMode
: MouseCommandType.toProcessInEditMode;
}
}
};
TextEditorController.prototype._getMouseEvent = function (e) {
var type = null;
var isMove = e.type === InputType.Move;
var state = isMove ? e.state : null;
if (e.type === InputType.PointerDown)
type = MouseEventType.mousedown;
if (e.type === InputType.Hover || (isMove && state === InputState.InProgress || state === InputState.Started))
type = MouseEventType.mousemove;
if (e.type === InputType.Click || (isMove && state === InputState.Finished))
type = MouseEventType.mouseup;
var point = this._translatePoint(new PointF(e.workspace.x, e.workspace.y));
return {
x: point.x,
y: point.y,
type: type,
isClick: e.type === InputType.Click,
isDrag: e.type === InputType.Move,
clickCount: e.clickCount,
};
};
TextEditorController.prototype._translatePoint = function (point) {
var offset = this._canvas.offset;
var transform = this._itemHandler.item.transform;
var previewScale = this._itemHandler.item.previewScale;
var rectangle = this._itemHandler.rectangle.toRectangleF();
point.translate(-offset.x, -offset.y);
if (transform != null) {
point.rotateAt(-transform.angle, rectangle.center);
point.translate(-transform.translateX, -transform.translateY);
}
point.scale(1 / previewScale, 1 / previewScale);
return point;
};
Object.defineProperty(TextEditorController.prototype, "_textState", {
get: function () {
return this._textStateValue;
},
enumerable: true,
configurable: true
});
TextEditorController.prototype._setTextState = function (value) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (this._textStateValue === value)
return [2 /*return*/];
this._textStateValue = value;
return [4 /*yield*/, this._onTextStateChanged()];
case 1:
_a.sent();
return [2 /*return*/];
}
});
});
};
TextEditorController.prototype._redrawText = function () {
var _a;
if (this._textState === TextStateType.Static) {
if (!this._isTextImageValid) {
this._updateTextImage();
}
}
(_a = this._canvas) === null || _a === void 0 ? void 0 : _a.redrawActiveTexts();
};
TextEditorController.prototype._updateTextImage = function () {
this._itemHandler.clearImageContainer();
var previewScale = this._itemHandler.item.previewScale;
var textRectangle = this._tw.textMeasurer.measureText(previewScale, true);
var textEngineHandler = this._tw.engineHandler;
var textImageCanvas = this._textRenderer.getTextImage(textEngineHandler, textRectangle, previewScale);
this._textImageChanged.fire({ rect: textRectangle, canvas: textImageCanvas });
this._isTextImageValid = true;
};
TextEditorController.prototype._updateText = function (trigger, force) {
if (force === void 0) { force = false; }
return __awaiter(this, void 0, void 0, function () {
var toCheckTextChanged, itemText, currentText, isTextActual, waitUpdatePromise, framesData, wrappingPathData, e_1, previewScale, textRectangle, updateFromTextEdit;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (this._isDisposed)
return [2 /*return*/];
toCheckTextChanged = !this.isMobile && trigger === UpdateTextTriggerType.Text && !force;
if (toCheckTextChanged) {
itemText = this._itemHandler.item.text;
currentText = this._tw.textHandler.getFormattedText();
isTextActual = itemText === currentText;
if (isTextActual)
return [2 /*return*/];
}
if (this._waitUpdatePromise != null)
return [2 /*return*/, this._waitUpdatePromise.promise];
waitUpdatePromise = new Deferred();
this._waitUpdatePromise = waitUpdatePromise;
this._ready = false;
_a.label = 1;
case 1:
_a.trys.push([1, , 10, 11]);
if (this._textState === TextStateType.Static) {
this._itemHandler.clearImageContainer();
}
_a.label = 2;
case 2:
_a.trys.push([2, 8, , 9]);
if (!(trigger === UpdateTextTriggerType.Initialization || trigger === UpdateTextTriggerType.Text)) return [3 /*break*/, 5];
return [4 /*yield*/, this._initEngineWrapper()];
case 3:
_a.sent();
return [4 /*yield*/, this._initActiveTextEditor()];
case 4:
_a.sent();
_a.label = 5;
case 5:
if (!(trigger === UpdateTextTriggerType.Frame)) return [3 /*break*/, 7];
return [4 /*yield*/, this._initEngineWrapper()];
case 6:
_a.sent();
// Currently there's no guarantee that this method is properly awaited
// so unexpected dispose can occur during method execution
if (this._isDisposed)
return [2 /*return*/];
framesData = thi