@wcardinal/wcardinal-geditor
Version:
WebGL-based graphic editor, tester and viewer for supervisory systems
536 lines • 19.9 kB
JavaScript
import { __extends } from "tslib";
import { DBaseState, DButtonAmbient, DButtonCheckRight, DControllers, DInputRealAndLabel, DLayoutHorizontal, DLayoutSpace, DLayoutVertical, DList, DListItem } from "@wcardinal/wcardinal-ui";
import { ECommandDocumentSnapBringForward } from "../command/e-command-document-snap-bring-forward";
import { ECommandDocumentSnapCreate } from "../command/e-command-document-snap-create";
import { ECommandDocumentSnapDelete } from "../command/e-command-document-snap-delete";
import { ECommandDocumentSnapGridSize } from "../command/e-command-document-snap-grid-size";
import { ECommandDocumentSnapGridToggle } from "../command/e-command-document-snap-grid-toggle";
import { ECommandDocumentSnapGridToggleVisibility } from "../command/e-command-document-snap-grid-toggle-visibility";
import { ECommandDocumentSnapReplace } from "../command/e-command-document-snap-replace";
import { ECommandDocumentSnapSendBackward } from "../command/e-command-document-snap-send-backward";
import { ECommandDocumentSnapTargetToggle } from "../command/e-command-document-snap-target-toggle";
import { ECommandDocumentSnapTargetToggleVisibility } from "../command/e-command-document-snap-target-toggle-visibility";
import { ECommandDocumentSnapToggle } from "../command/e-command-document-snap-toggle";
import { EDialogSnap } from "../editor/e-dialog-snap";
var EEditorSnap = /** @class */ (function (_super) {
__extends(EEditorSnap, _super);
function EEditorSnap(options) {
var _this = _super.call(this, options) || this;
// Icons
_this._icons = options.icons;
// Diagram
var diagram = options.diagram;
_this._diagram = diagram;
_this.state.isDisabled = diagram.canvas == null;
diagram.on("unset", function () {
_this.state.isDisabled = true;
});
diagram.on("set", function () {
_this.state.isDisabled = false;
});
// Snapper
var snapper = diagram.snapper;
_this._snapper = snapper;
snapper.on("change", function () {
_this.onSnapperChange(snapper);
});
var snapperTarget = snapper.target;
snapperTarget.on("change", function () {
_this.onSnapperTargetChange(snapperTarget);
});
var snapperGrid = snapper.grid;
snapperGrid.on("change", function () {
_this.onSnapperGridChange(snapperGrid);
});
// Layout
_this.addChild(_this.buttonLabel);
_this.addChild(_this.buttonGrid);
_this.addChild(new DLayoutHorizontal({
x: "padding",
width: "padding",
height: "auto",
children: [_this.buttonGridEye, _this.inputGridSize]
}));
_this.addChild(_this.buttonTarget);
_this.addChild(new DLayoutHorizontal({
x: "padding",
width: "padding",
height: "auto",
children: [
new DLayoutSpace({ weight: 1 }),
_this.buttonTargetNew,
_this.buttonTargetDelete,
_this.buttonTargetBringForward,
_this.buttonTargetSendBackward,
_this.buttonTargetEye,
new DLayoutSpace({ weight: 1 })
]
}));
_this.addChild(_this.listTarget);
// Selection
var listSnapTarget = _this.listTarget;
listSnapTarget.data.selection.on("change", function () {
_this.onSelectionChange(listSnapTarget);
});
// Initialization
_this.onSnapperChange(snapper);
_this.onSnapperTargetChange(snapperTarget);
_this.onSnapperGridChange(snapperGrid);
_this.onSelectionChange(listSnapTarget);
return _this;
}
Object.defineProperty(EEditorSnap.prototype, "buttonLabel", {
get: function () {
var result = this._buttonLabel;
if (result == null) {
result = this.newButtonLabel();
this._buttonLabel = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonLabel = function () {
var snapper = this._diagram.snapper;
return new DButtonCheckRight({
x: "padding",
width: "padding",
text: {
value: this.theme.getLabel()
},
padding: 0,
background: {
color: null
},
on: {
active: function () {
if (!snapper.enable) {
DControllers.getCommandController().push(new ECommandDocumentSnapToggle(snapper));
}
},
inactive: function () {
if (snapper.enable) {
DControllers.getCommandController().push(new ECommandDocumentSnapToggle(snapper));
}
}
}
});
};
Object.defineProperty(EEditorSnap.prototype, "buttonTarget", {
get: function () {
var result = this._buttonTarget;
if (result == null) {
result = this.newButtonTarget();
this._buttonTarget = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonTarget = function () {
var _this = this;
return new DButtonCheckRight({
x: "padding",
width: "padding",
text: {
value: this.theme.getButtonTargetLabel()
},
padding: 0,
background: {
color: null
},
on: {
active: function () {
var snapper = _this._snapper;
if (!snapper.target.enable) {
DControllers.getCommandController().push(new ECommandDocumentSnapTargetToggle(snapper));
}
},
inactive: function () {
var snapper = _this._snapper;
if (snapper.target.enable) {
DControllers.getCommandController().push(new ECommandDocumentSnapTargetToggle(snapper));
}
}
}
});
};
Object.defineProperty(EEditorSnap.prototype, "buttonTargetNew", {
get: function () {
var result = this._buttonTargetNew;
if (result == null) {
result = this.newButtonTargetNew();
this._buttonTargetNew = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonTargetNew = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.new
},
title: this.theme.getButtonTargetNewTitle(),
on: {
active: function (emitter) {
_this.onButtonTargetNewActive(emitter);
}
}
});
};
EEditorSnap.prototype.onButtonTargetNewActive = function (opener) {
var _this = this;
this.dialogTarget
.reset()
.open(opener)
.then(function (value) {
if (value != null) {
DControllers.getCommandController().push(new ECommandDocumentSnapCreate(_this._snapper, value));
}
});
};
Object.defineProperty(EEditorSnap.prototype, "buttonTargetDelete", {
get: function () {
var result = this._buttonTargetDelete;
if (result == null) {
result = this.newButtonTargetDelete();
this._buttonTargetDelete = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonTargetDelete = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.delete
},
title: this.theme.getButtonTargetDeleteTitle(),
state: DBaseState.DISABLED,
on: {
active: function () {
var listTarget = _this.listTarget;
var first = listTarget.data.selection.first;
if (first != null) {
var items = listTarget.data.items;
var index = items.indexOf(first);
if (0 <= index) {
DControllers.getCommandController().push(new ECommandDocumentSnapDelete(_this._snapper, index, first));
}
}
}
}
});
};
Object.defineProperty(EEditorSnap.prototype, "buttonTargetBringForward", {
get: function () {
var result = this._buttonTargetBringForward;
if (result == null) {
result = this.newButtonTargetBringForward();
this._buttonTargetBringForward = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonTargetBringForward = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.arrow_up
},
title: this.theme.getButtonTargetBringForwardTitle(),
state: DBaseState.DISABLED,
on: {
active: function () {
var listTarget = _this.listTarget;
var first = listTarget.data.selection.first;
var items = listTarget.data.items;
if (first != null && items[0] !== first) {
var index = items.indexOf(first);
if (0 <= index) {
DControllers.getCommandController().push(new ECommandDocumentSnapBringForward(_this._snapper, index));
}
}
}
}
});
};
Object.defineProperty(EEditorSnap.prototype, "buttonTargetSendBackward", {
get: function () {
var result = this._buttonTargetSendBackward;
if (result == null) {
result = this.newButtonTargetSendBackward();
this._buttonTargetSendBackward = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonTargetSendBackward = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.arrow_down
},
title: this.theme.getButtonTargetSendBackwardTitle(),
state: DBaseState.DISABLED,
on: {
active: function () {
var snapper = _this._snapper;
var listTarget = _this.listTarget;
var first = listTarget.data.selection.first;
var items = listTarget.data.items;
if (first != null && items[items.length] !== first) {
var index = items.indexOf(first);
if (0 <= index) {
DControllers.getCommandController().push(new ECommandDocumentSnapSendBackward(snapper, index));
}
}
}
}
});
};
Object.defineProperty(EEditorSnap.prototype, "buttonTargetEye", {
get: function () {
var result = this._buttonTargetEye;
if (result == null) {
result = this.newButtonTargetEye();
this._buttonTargetEye = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonTargetEye = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.eye
},
title: this.theme.getButtonTargetEyeTitle(),
on: {
active: function () {
DControllers.getCommandController().push(new ECommandDocumentSnapTargetToggleVisibility(_this._snapper));
}
}
});
};
Object.defineProperty(EEditorSnap.prototype, "dialogTarget", {
get: function () {
var result = this._dialogTarget;
if (result == null) {
result = this.newDialogTarget();
this._dialogTarget = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newDialogTarget = function () {
return new EDialogSnap();
};
Object.defineProperty(EEditorSnap.prototype, "listTarget", {
get: function () {
var result = this._listTarget;
if (result == null) {
result = this.newListTarget();
this._listTarget = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newListTarget = function () {
var _this = this;
var theme = this.theme;
var result = new DList({
x: "padding",
width: "padding",
weight: 1,
data: {
toLabel: function (value) {
return theme.getListTargetItemLabel(value);
}
},
updater: {
newItem: function (data) {
return new DListItem(data, {
on: {
dblclick: function (e, _, item) {
_this.onListTargetDblClick(e, _, item, result);
}
}
});
}
}
});
return result;
};
EEditorSnap.prototype.onListTargetDblClick = function (e, _, item, list) {
var _this = this;
var oldValue = item.value;
if (oldValue != null) {
var index = list.data.items.indexOf(oldValue);
if (0 <= index) {
var dialog = this.dialogTarget;
dialog.value = oldValue;
dialog.open(item).then(function (newValue) {
if (newValue != null) {
DControllers.getCommandController().push(new ECommandDocumentSnapReplace(_this._snapper, oldValue, newValue, list));
}
});
}
}
};
Object.defineProperty(EEditorSnap.prototype, "buttonGrid", {
get: function () {
var result = this._buttonGrid;
if (result == null) {
result = this.newButtonGrid();
this._buttonGrid = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonGrid = function () {
var _this = this;
return new DButtonCheckRight({
x: "padding",
width: "padding",
text: {
value: this.theme.getButtonGridLabel()
},
padding: 0,
background: {
color: null
},
on: {
active: function () {
var snapper = _this._snapper;
if (!snapper.grid.enable) {
DControllers.getCommandController().push(new ECommandDocumentSnapGridToggle(snapper));
}
},
inactive: function () {
var snapper = _this._snapper;
if (snapper.grid.enable) {
DControllers.getCommandController().push(new ECommandDocumentSnapGridToggle(snapper));
}
}
}
});
};
Object.defineProperty(EEditorSnap.prototype, "buttonGridEye", {
get: function () {
var result = this._buttonGridEye;
if (result == null) {
result = this.newButtonGridEye();
this._buttonGridEye = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newButtonGridEye = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.eye
},
title: this.theme.getButtonGridEyeTitle(),
on: {
active: function () {
DControllers.getCommandController().push(new ECommandDocumentSnapGridToggleVisibility(_this._snapper));
}
}
});
};
Object.defineProperty(EEditorSnap.prototype, "inputGridSize", {
get: function () {
var result = this._inputGridSize;
if (result == null) {
result = this.newInputGridSize();
this._inputGridSize = result;
}
return result;
},
enumerable: false,
configurable: true
});
EEditorSnap.prototype.newInputGridSize = function () {
var _this = this;
return new DInputRealAndLabel({
weight: 1,
label: {
text: {
value: this.theme.getInputGridSizeLabel()
}
},
input: {
weight: 1,
text: {
value: 10
},
min: 2,
on: {
change: function (value) {
DControllers.getCommandController().push(new ECommandDocumentSnapGridSize(_this._snapper, value));
}
}
}
});
};
EEditorSnap.prototype.onSnapperChange = function (snapper) {
this.buttonLabel.state.isActive = snapper.enable;
};
EEditorSnap.prototype.onSnapperTargetChange = function (target) {
this.buttonTarget.state.isActive = target.enable;
var icons = this._icons;
this.buttonTargetEye.image = target.visible ? icons.eye : icons.eye_slash;
var listTarget = this.listTarget;
listTarget.data.items = target.values;
this.onSelectionChange(listTarget);
};
EEditorSnap.prototype.onSnapperGridChange = function (grid) {
this.buttonGrid.state.isActive = grid.enable;
var icons = this._icons;
this.buttonGridEye.image = grid.visible ? icons.eye : icons.eye_slash;
this.inputGridSize.input.value = grid.size;
};
EEditorSnap.prototype.onSelectionChange = function (listSnapTarget) {
this.buttonTargetDelete.state.isDisabled = listSnapTarget.data.selection.isEmpty();
var first = listSnapTarget.data.selection.first;
var items = listSnapTarget.data.items;
this.buttonTargetBringForward.state.isDisabled = first == null || items[0] === first;
this.buttonTargetSendBackward.state.isDisabled =
first == null || items[items.length - 1] === first;
};
EEditorSnap.prototype.getType = function () {
return "EEditorSnap";
};
return EEditorSnap;
}(DLayoutVertical));
export { EEditorSnap };
//# sourceMappingURL=e-editor-snap.js.map