@wcardinal/wcardinal-geditor
Version:
WebGL-based graphic editor, tester and viewer for supervisory systems
454 lines • 16 kB
JavaScript
import { __extends } from "tslib";
import { DButtonCheck, DButtonColor, DDialogLayered, DInputLabel, DInputReal, DInputTextAndLabel, DLayoutHorizontal, DLayoutSpace, DSelectMultiple, EShapeActionValueGestureOperationType } from "@wcardinal/wcardinal-ui";
import { EDialogLayerValue } from "./e-dialog-layer-value";
import { EDialogLayerValueBackground } from "./e-dialog-layer-value-background";
var EDialogLayer = /** @class */ (function (_super) {
__extends(EDialogLayer, _super);
function EDialogLayer() {
return _super !== null && _super.apply(this, arguments) || this;
}
EDialogLayer.prototype.newContentChildren = function (theme, options) {
var result = _super.prototype.newContentChildren.call(this, theme, options);
result.push(this.inputName, this.inputPositionLayout, this.inputSizeLayout, this.checkBackgroundLayout, this.colorBackgroundLayout, this.selectGestureLayout, this.checkVisibleLayout, this.checkInteractiveLayout);
return result;
};
EDialogLayer.prototype.newLabel = function (label) {
return new DInputLabel({
width: 60,
text: {
value: label
}
});
};
EDialogLayer.prototype.newSpace = function () {
return new DLayoutSpace({
width: 60
});
};
EDialogLayer.prototype.newLabeled = function (label, inputA, inputB) {
return new DLayoutHorizontal({
width: "padding",
height: "auto",
children: [
label != null ? this.newLabel(label) : this.newSpace(),
inputA,
inputB,
this.newSpace()
]
});
};
Object.defineProperty(EDialogLayer.prototype, "inputName", {
get: function () {
var result = this._inputName;
if (result == null) {
result = this.newInputName();
this._inputName = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newInputName = function () {
var _this = this;
return new DInputTextAndLabel({
width: "padding",
height: "auto",
label: {
width: 60,
text: {
value: this.theme.getInputNameLabel()
}
},
input: {
weight: 1,
text: {
value: ""
},
on: {
enter: function () {
_this.ok();
}
}
},
space: {
width: 60
}
});
};
Object.defineProperty(EDialogLayer.prototype, "inputX", {
get: function () {
var result = this._inputX;
if (result == null) {
result = this.newInputX();
this._inputX = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newInputX = function () {
var _this = this;
return new DInputReal({
weight: 1,
on: {
enter: function () {
_this.ok();
}
}
});
};
Object.defineProperty(EDialogLayer.prototype, "inputY", {
get: function () {
var result = this._inputY;
if (result == null) {
result = this.newInputY();
this._inputY = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newInputY = function () {
var _this = this;
return new DInputReal({
weight: 1,
on: {
enter: function () {
_this.ok();
}
}
});
};
Object.defineProperty(EDialogLayer.prototype, "inputPositionLayout", {
get: function () {
var result = this._inputPositionLayout;
if (result == null) {
result = this.newLabeled(this.theme.getInputPositionLabel(), this.inputX, this.inputY);
this._inputPositionLayout = result;
}
return result;
},
enumerable: false,
configurable: true
});
Object.defineProperty(EDialogLayer.prototype, "inputWidth", {
get: function () {
var result = this._inputWidth;
if (result == null) {
result = this.newInputWidth();
this._inputWidth = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newInputWidth = function () {
var _this = this;
return new DInputReal({
weight: 1,
on: {
enter: function () {
_this.ok();
}
}
});
};
Object.defineProperty(EDialogLayer.prototype, "inputHeight", {
get: function () {
var result = this._inputHeight;
if (result == null) {
result = this.newInputHeight();
this._inputHeight = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newInputHeight = function () {
var _this = this;
return new DInputReal({
weight: 1,
on: {
enter: function () {
_this.ok();
}
}
});
};
Object.defineProperty(EDialogLayer.prototype, "inputSizeLayout", {
get: function () {
var result = this._inputSizeLayout;
if (result == null) {
result = this.newLabeled(this.theme.getInputSizeLabel(), this.inputWidth, this.inputHeight);
this._inputSizeLayout = result;
}
return result;
},
enumerable: false,
configurable: true
});
Object.defineProperty(EDialogLayer.prototype, "checkBackground", {
get: function () {
var result = this._checkBackground;
if (result == null) {
result = this.newCheckBackground();
this._checkBackground = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newCheckBackground = function () {
var _this = this;
return new DButtonCheck({
weight: 1,
text: {
value: this.theme.getCheckBackgroundLabel(),
align: {
horizontal: "LEFT"
}
},
on: {
active: function () {
_this.onCheckBackgroundChange(true);
},
inactive: function () {
_this.onCheckBackgroundChange(false);
}
}
});
};
EDialogLayer.prototype.onCheckBackgroundChange = function (isActive) {
this.colorBackground.state.isDisabled = !isActive;
};
Object.defineProperty(EDialogLayer.prototype, "checkBackgroundLayout", {
get: function () {
var result = this._checkBackgroundLayout;
if (result == null) {
result = this.newLabeled(this.theme.getTextBackgroundLabel(), this.checkBackground, null);
this._checkBackgroundLayout = result;
}
return result;
},
enumerable: false,
configurable: true
});
Object.defineProperty(EDialogLayer.prototype, "colorBackground", {
get: function () {
var result = this._colorBackground;
if (result == null) {
result = this.newColorBackground();
this._colorBackground = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newColorBackground = function () {
return new DButtonColor({
weight: 1
});
};
Object.defineProperty(EDialogLayer.prototype, "colorBackgroundLayout", {
get: function () {
var result = this._colorBackgroundLayout;
if (result == null) {
result = this.newLabeled(null, this.colorBackground, null);
this._colorBackgroundLayout = result;
}
return result;
},
enumerable: false,
configurable: true
});
Object.defineProperty(EDialogLayer.prototype, "checkVisible", {
get: function () {
var result = this._checkVisible;
if (result == null) {
result = this.newCheckVisible();
this._checkVisible = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newCheckVisible = function () {
return new DButtonCheck({
weight: 1,
text: {
value: this.theme.getCheckVisibleLabel(),
align: {
horizontal: "LEFT"
}
}
});
};
Object.defineProperty(EDialogLayer.prototype, "checkVisibleLayout", {
get: function () {
var result = this._checkVisibleLayout;
if (result == null) {
result = this.newLabeled(null, this.checkVisible, null);
this._checkVisibleLayout = result;
}
return result;
},
enumerable: false,
configurable: true
});
Object.defineProperty(EDialogLayer.prototype, "checkInteractive", {
get: function () {
var result = this._checkInteractive;
if (result == null) {
result = this.newCheckInteractive();
this._checkInteractive = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newCheckInteractive = function () {
return new DButtonCheck({
weight: 1,
text: {
value: this.theme.getCheckInteractiveLabel(),
align: {
horizontal: "LEFT"
}
}
});
};
Object.defineProperty(EDialogLayer.prototype, "checkInteractiveLayout", {
get: function () {
var result = this._checkInteractiveLayout;
if (result == null) {
result = this.newLabeled(null, this.checkInteractive, null);
this._checkInteractiveLayout = result;
}
return result;
},
enumerable: false,
configurable: true
});
Object.defineProperty(EDialogLayer.prototype, "selectGesture", {
get: function () {
var result = this._selectGesture;
if (result == null) {
result = this.newSelectGesture();
this._selectGesture = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.newSelectGesture = function () {
var theme = this.theme;
return new DSelectMultiple({
weight: 1,
values: this.fromGestureOperationType(EShapeActionValueGestureOperationType.ALL),
menu: {
items: [
{
value: EShapeActionValueGestureOperationType.DRAG,
text: {
value: theme.getSelectGestureValueLabel(EShapeActionValueGestureOperationType.DRAG)
},
check: true
},
{
value: EShapeActionValueGestureOperationType.PINCH,
text: {
value: theme.getSelectGestureValueLabel(EShapeActionValueGestureOperationType.PINCH)
},
check: true
}
]
}
});
};
EDialogLayer.prototype.toGestureOperationType = function (types) {
var result = EShapeActionValueGestureOperationType.NONE;
for (var i = 0, imax = types.length; i < imax; ++i) {
result |= types[i];
}
return result;
};
EDialogLayer.prototype.fromGestureOperationType = function (type) {
var result = [];
if (type & EShapeActionValueGestureOperationType.DRAG) {
result.push(EShapeActionValueGestureOperationType.DRAG);
}
if (type & EShapeActionValueGestureOperationType.PINCH) {
result.push(EShapeActionValueGestureOperationType.PINCH);
}
return result;
};
Object.defineProperty(EDialogLayer.prototype, "selectGestureLayout", {
get: function () {
var result = this._selectGestureLayout;
if (result == null) {
result = this.newLabeled(this.theme.getSelectGestureLabel(), this.selectGesture, null);
this._selectGestureLayout = result;
}
return result;
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.reset = function (width, height) {
this.inputName.input.value = "";
this.inputX.value = 0;
this.inputY.value = 0;
this.inputWidth.value = width;
this.inputHeight.value = height;
this.checkBackground.state.isActive = false;
this.colorBackground.value.color = 0xffffff;
this.colorBackground.value.alpha = 1;
this.checkVisible.state.isActive = true;
this.checkInteractive.state.isActive = true;
this.selectGesture.values = [];
this.onCheckBackgroundChange(false);
return this;
};
Object.defineProperty(EDialogLayer.prototype, "value", {
get: function () {
return new EDialogLayerValue(this.inputName.input.value, this.inputX.value, this.inputY.value, this.inputWidth.value, this.inputHeight.value, new EDialogLayerValueBackground(this.checkBackground.state.isActive, this.colorBackground.value.color, this.colorBackground.value.alpha), this.checkVisible.state.isActive, this.checkInteractive.state.isActive, this.toGestureOperationType(this.selectGesture.values));
},
set: function (value) {
if (value != null) {
this.inputName.input.value = value.name;
this.inputX.value = value.x;
this.inputY.value = value.y;
this.inputWidth.value = value.width;
this.inputHeight.value = value.height;
this.checkBackground.state.isActive = value.background.enable;
this.colorBackground.value.color = value.background.color;
this.colorBackground.value.alpha = value.background.alpha;
this.checkVisible.state.isActive = value.visible;
this.checkInteractive.state.isActive = value.interactive;
this.selectGesture.values = this.fromGestureOperationType(value.gesture);
this.onCheckBackgroundChange(value.background.enable);
}
},
enumerable: false,
configurable: true
});
EDialogLayer.prototype.getResolvedValue = function () {
return this.value;
};
EDialogLayer.prototype.getType = function () {
return "EDialogLayer";
};
return EDialogLayer;
}(DDialogLayered));
export { EDialogLayer };
//# sourceMappingURL=e-dialog-layer.js.map