@wcardinal/wcardinal-geditor
Version:
WebGL-based graphic editor, tester and viewer for supervisory systems
395 lines • 16 kB
JavaScript
import { __extends } from "tslib";
import { DButtonAmbient, DControllers, DInputReal, DLayoutHorizontal, DLayoutVertical, DList, DListItem, DPane, DSelect, DText, DThemes } from "@wcardinal/wcardinal-ui";
import { ECommandShapeTableColumnValueAdd } from "./e-command-shape-table-column-value-add";
import { ECommandShapeTableColumnValueBringForward } from "./e-command-shape-table-column-value-bring-forward";
import { ECommandShapeTableColumnValueRemove } from "./e-command-shape-table-column-value-remove";
import { ECommandShapeTableColumnValueReplace } from "./e-command-shape-table-column-value-replace";
import { ECommandShapeTableColumnValueSendBackward } from "./e-command-shape-table-column-value-send-backward";
import { ECommandShapeTableRowHeight } from "./e-command-shape-table-row-height";
import { ECommandShapeTableRowSelectionType } from "./e-command-shape-table-row-selection-type";
import { EDialogTableColumn } from "./e-dialog-shape-table-column";
import { EShapeTable } from "./e-shape-table";
import { EShapeTableRowSelectionType } from "./e-shape-table-row-selection";
var EEditorShapeTable = /** @class */ (function (_super) {
__extends(EEditorShapeTable, _super);
function EEditorShapeTable(options) {
var _this = _super.call(this, options) || this;
_this._icons = options.icons;
var selection = options.selection;
_this._selection = selection;
_this.state.isDisabled = selection.isEmpty();
selection.on("change", function () {
_this.state.isDisabled = selection.isEmpty();
});
_this.content.setHeight("padding");
new DLayoutVertical({
parent: _this.content,
x: "padding",
y: "padding",
width: "padding",
height: "padding",
children: [
new DLayoutHorizontal({
width: "100%",
height: "auto",
children: [
_this.newTextLabel(),
_this.buttonNew,
_this.buttonDelete,
_this.buttonBringForward,
_this.buttonSendBackward
]
}),
_this.columnList,
new DText({
width: "100%",
text: {
value: _this.subtheme.getInputRowHeightLabel()
}
}),
_this.inputRowHeight,
new DText({
width: "100%",
text: {
value: _this.subtheme.getSelectRowSelectionTypeLabel()
}
}),
_this.selectRowSelectionType
]
});
selection.on("change", function () {
_this.onSelectionChange(selection);
});
var columnList = _this.columnList;
columnList.data.selection.on("change", function () {
_this.onListSelectionChange(columnList);
});
_this.onSelectionChange(selection);
return _this;
}
EEditorShapeTable.prototype.newTextLabel = function () {
return new DText({
weight: 1,
text: {
value: this.subtheme.getLabel()
}
});
};
Object.defineProperty(EEditorShapeTable.prototype, "buttonNew", {
get: function () {
var _a;
return ((_a = this._buttonNew) !== null && _a !== void 0 ? _a : (this._buttonNew = this.newButtonNew()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newButtonNew = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.new
},
title: this.subtheme.getButtonNewTitle(),
on: {
active: function (emitter) {
_this.onButtonNewActive(emitter);
}
}
});
};
EEditorShapeTable.prototype.onButtonNewActive = function (opener) {
var _this = this;
this.columnDialog
.reset()
.open(opener)
.then(function (value) {
if (value != null) {
DControllers.getCommandController().push(new ECommandShapeTableColumnValueAdd(value, _this._selection));
}
});
};
EEditorShapeTable.prototype.onSelectionChangeButtonNew = function (selection) {
var buttonNew = this.buttonNew;
if (selection.last() instanceof EShapeTable) {
buttonNew.state.isDisabled = false;
}
else {
buttonNew.state.isDisabled = true;
}
};
Object.defineProperty(EEditorShapeTable.prototype, "buttonDelete", {
get: function () {
var _a;
return ((_a = this._buttonDelete) !== null && _a !== void 0 ? _a : (this._buttonDelete = this.newButtonDelete()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newButtonDelete = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.delete
},
title: this.subtheme.getButtonDeleteTitle(),
on: {
active: function () {
var columnList = _this.columnList;
var first = columnList.data.selection.first;
if (first != null && 1 < columnList.data.size()) {
DControllers.getCommandController().push(new ECommandShapeTableColumnValueRemove(first, _this._selection));
}
}
}
});
};
EEditorShapeTable.prototype.onListSelectionChangeButtonDelete = function (columnList) {
this.buttonDelete.state.isDisabled =
columnList.data.size() <= 1 || columnList.data.selection.isEmpty();
};
Object.defineProperty(EEditorShapeTable.prototype, "buttonBringForward", {
get: function () {
var _a;
return ((_a = this._buttonBringForward) !== null && _a !== void 0 ? _a : (this._buttonBringForward = this.newButtonBringForward()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newButtonBringForward = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.arrow_up
},
title: this.subtheme.getButtonBringForwardTitle(),
on: {
active: function () {
var columnList = _this.columnList;
var first = columnList.selection.first;
if (first != null && columnList.data.items[0] !== first) {
DControllers.getCommandController().push(new ECommandShapeTableColumnValueBringForward(first, _this._selection));
}
}
}
});
};
EEditorShapeTable.prototype.onListSelectionChangeButtonBringForward = function (columnList) {
var first = columnList.data.selection.first;
var items = columnList.data.items;
this.buttonBringForward.state.isDisabled = first == null || items[0] === first;
};
Object.defineProperty(EEditorShapeTable.prototype, "buttonSendBackward", {
get: function () {
var _a;
return ((_a = this._buttonSendBackward) !== null && _a !== void 0 ? _a : (this._buttonSendBackward = this.newButtonSendBackward()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newButtonSendBackward = function () {
var _this = this;
return new DButtonAmbient({
width: 30,
image: {
source: this._icons.arrow_down
},
title: this.subtheme.getButtonSendBackwardTitle(),
on: {
active: function () {
var columnList = _this.columnList;
var first = columnList.selection.first;
var items = columnList.data.items;
if (first != null && items[items.length - 1] !== first) {
DControllers.getCommandController().push(new ECommandShapeTableColumnValueSendBackward(first, _this._selection));
}
}
}
});
};
EEditorShapeTable.prototype.onListSelectionChangeButtonSendBackward = function (columnList) {
var first = columnList.selection.first;
var items = columnList.data.items;
this.buttonSendBackward.state.isDisabled =
first == null || items[items.length - 1] === first;
};
Object.defineProperty(EEditorShapeTable.prototype, "columnDialog", {
get: function () {
var _a;
return ((_a = this._columnDialog) !== null && _a !== void 0 ? _a : (this._columnDialog = this.newColumnDialog()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newColumnDialog = function () {
return new EDialogTableColumn();
};
Object.defineProperty(EEditorShapeTable.prototype, "columnList", {
get: function () {
var _a;
return ((_a = this._columnList) !== null && _a !== void 0 ? _a : (this._columnList = this.newColumnList()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newColumnList = function () {
var _this = this;
var result = new DList({
width: "100%",
weight: 1,
data: {
toLabel: function (value) {
return value.toLabel();
}
},
updater: {
newItem: function (data) {
return new DListItem(data, {
on: {
dblclick: function (e, _, item) {
_this.onColumnListDblClick(e, _, item, result);
}
}
});
}
}
});
return result;
};
EEditorShapeTable.prototype.onColumnListDblClick = function (e, _, item, list) {
var _this = this;
var oldValue = item.value;
if (oldValue != null) {
var columnDialog_1 = this.columnDialog;
columnDialog_1.value = oldValue;
columnDialog_1.open(item).then(function () {
var newValue = columnDialog_1.value;
if (newValue != null) {
DControllers.getCommandController().push(new ECommandShapeTableColumnValueReplace(oldValue, newValue, _this._selection, list));
}
});
}
};
EEditorShapeTable.prototype.onSelectionChangeColumnList = function (selection) {
var last = selection.last();
var columnList = this.columnList;
columnList.data.items = last instanceof EShapeTable ? last.column.values : [];
this.onListSelectionChange(columnList);
};
Object.defineProperty(EEditorShapeTable.prototype, "inputRowHeight", {
get: function () {
var _a;
return ((_a = this._inputRowHeight) !== null && _a !== void 0 ? _a : (this._inputRowHeight = this.newInputRowHeight()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newInputRowHeight = function () {
var _this = this;
return new DInputReal({
width: "100%",
min: 5,
step: 1,
on: {
change: function (value) {
DControllers.getCommandController().push(new ECommandShapeTableRowHeight(value, _this._selection));
}
}
});
};
EEditorShapeTable.prototype.onSelectionChangeInputRowHeight = function (selection) {
var last = selection.last();
var input = this.inputRowHeight;
if (last instanceof EShapeTable) {
input.value = last.row.height;
input.state.isDisabled = false;
}
else {
input.state.isDisabled = true;
}
};
Object.defineProperty(EEditorShapeTable.prototype, "selectRowSelectionType", {
get: function () {
var _a;
return ((_a = this._selectRowSelectionType) !== null && _a !== void 0 ? _a : (this._selectRowSelectionType = this.newSelectRowSelectionType()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newSelectRowSelectionType = function () {
var _this = this;
var subtheme = this.subtheme;
return new DSelect({
width: "100%",
value: EShapeTableRowSelectionType.SINGLE,
menu: {
items: [
{
value: EShapeTableRowSelectionType.NONE,
text: {
value: subtheme.toSelectRowSelectionTypeLabel(EShapeTableRowSelectionType.NONE)
}
},
{
value: EShapeTableRowSelectionType.SINGLE,
text: {
value: subtheme.toSelectRowSelectionTypeLabel(EShapeTableRowSelectionType.SINGLE)
}
},
{
value: EShapeTableRowSelectionType.MULTIPLE,
text: {
value: subtheme.toSelectRowSelectionTypeLabel(EShapeTableRowSelectionType.MULTIPLE)
}
}
]
},
on: {
change: function (value) {
if (value == null) {
value = EShapeTableRowSelectionType.SINGLE;
}
DControllers.getCommandController().push(new ECommandShapeTableRowSelectionType(value, _this._selection));
}
}
});
};
EEditorShapeTable.prototype.onSelectionChangeSelectRowSelectionType = function (selection) {
var last = selection.last();
var select = this.selectRowSelectionType;
if (last instanceof EShapeTable) {
select.value = last.row.selection.type;
select.state.isDisabled = false;
}
else {
select.state.isDisabled = true;
}
};
EEditorShapeTable.prototype.onSelectionChange = function (selection) {
this.onSelectionChangeButtonNew(selection);
this.onSelectionChangeColumnList(selection);
this.onSelectionChangeInputRowHeight(selection);
this.onSelectionChangeSelectRowSelectionType(selection);
};
EEditorShapeTable.prototype.onListSelectionChange = function (columnList) {
this.onListSelectionChangeButtonDelete(columnList);
this.onListSelectionChangeButtonBringForward(columnList);
this.onListSelectionChangeButtonSendBackward(columnList);
};
Object.defineProperty(EEditorShapeTable.prototype, "subtheme", {
get: function () {
var _a;
return ((_a = this._subtheme) !== null && _a !== void 0 ? _a : (this._subtheme = this.newSubtheme()));
},
enumerable: false,
configurable: true
});
EEditorShapeTable.prototype.newSubtheme = function () {
return DThemes.get("EEditorShapeTable");
};
return EEditorShapeTable;
}(DPane));
export { EEditorShapeTable };
//# sourceMappingURL=e-editor-shape-table.js.map