@mai3/phaser-sdk
Version:
A UI component library based on the Phaser game engine
142 lines (141 loc) • 7.81 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
import Utils from "../utils";
import { BaseButton } from "./BaseButton";
var TextButton = /** @class */ (function (_super) {
__extends(TextButton, _super);
function TextButton(scene, config) {
var _this = this;
var _a, _b;
config.width = (_a = config.width) !== null && _a !== void 0 ? _a : 200;
config.height = (_b = config.height) !== null && _b !== void 0 ? _b : 60;
_this = _super.call(this, scene, config, "TextButton") || this;
_this._config = config;
_this.columnSpan = 12;
_this.reDraw(config);
_this.setEventInteractive();
return _this;
}
TextButton.prototype.reDraw = function (config) {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
config.width = (_a = config.width) !== null && _a !== void 0 ? _a : 200;
config.height = (_b = config.height) !== null && _b !== void 0 ? _b : 60;
this._config = config;
var text = (_c = config.text) !== null && _c !== void 0 ? _c : "MiracleAI";
this.drawBackground(config);
if (!this.label)
this.label = this.scene.make.text({});
this.label.setText(text);
this.label.setStyle((_d = config.textStyle) !== null && _d !== void 0 ? _d : {});
this.label.setFontStyle((_e = config.textStyle) === null || _e === void 0 ? void 0 : _e.fontStyle);
this.label.setPadding((_g = (_f = config.textStyle) === null || _f === void 0 ? void 0 : _f.padding) !== null && _g !== void 0 ? _g : {});
this.label.setOrigin(0);
var x = (config.width - ((_h = this.label) === null || _h === void 0 ? void 0 : _h.displayWidth)) / 2;
var y = (config.height - ((_j = this.label) === null || _j === void 0 ? void 0 : _j.displayHeight)) / 2;
(_k = this.label) === null || _k === void 0 ? void 0 : _k.setPosition(x, y);
this.addChildAt(this.label, 1);
this.drawIcon(config);
this.setDepth((_l = config.depth) !== null && _l !== void 0 ? _l : 1);
this.setScrollFactor(config.isScrollFactor ? 0 : 1);
this.updateConfig(config);
this.RefreshBounds();
};
TextButton.prototype.drawIcon = function (config) {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
var iconWidth = (_a = config.iconWidth) !== null && _a !== void 0 ? _a : 20;
var iconHeight = (_b = config.iconHeight) !== null && _b !== void 0 ? _b : 20;
var iconPadding = (_c = config.iconPadding) !== null && _c !== void 0 ? _c : 4;
var iconPosition = (_d = config.iconPosition) !== null && _d !== void 0 ? _d : "left";
if (config.icon) {
var labelX = iconPosition === "left"
? (((_e = config.width) !== null && _e !== void 0 ? _e : 0) -
((_f = this.label) === null || _f === void 0 ? void 0 : _f.displayWidth) -
iconWidth -
iconPadding) /
2 +
iconWidth +
iconPadding
: (((_g = config.width) !== null && _g !== void 0 ? _g : 0) -
((_h = this.label) === null || _h === void 0 ? void 0 : _h.displayWidth) -
iconWidth -
iconPadding) /
2;
(_j = this.label) === null || _j === void 0 ? void 0 : _j.setPosition(labelX, this.label.y);
var icon = this.scene.add.image(0, 0, config.icon);
icon.setDisplaySize((_k = config.iconWidth) !== null && _k !== void 0 ? _k : 0, (_l = config.iconHeight) !== null && _l !== void 0 ? _l : 0);
icon.setOrigin(0);
icon.setPosition(iconPosition === "left"
? labelX - iconPadding - iconWidth
: labelX + iconPadding + ((_o = (_m = this.label) === null || _m === void 0 ? void 0 : _m.displayWidth) !== null && _o !== void 0 ? _o : 0), ((_q = (_p = this.label) === null || _p === void 0 ? void 0 : _p.y) !== null && _q !== void 0 ? _q : 0) +
((_s = (_r = this.label) === null || _r === void 0 ? void 0 : _r.displayHeight) !== null && _s !== void 0 ? _s : 0) / 2 -
iconHeight / 2);
this.addChildAt(icon, 2);
}
};
TextButton.prototype.drawBackground = function (config) {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
if (config.texture) {
if (this.image) {
this.image.destroy();
this.image = undefined;
}
if (!this.image)
this.image = this.scene.add.nineslice(0, 0, (_a = this._config.texture) !== null && _a !== void 0 ? _a : "", (_b = this._config.frame) !== null && _b !== void 0 ? _b : 0, this._config.width, this._config.height, (_c = this._config.leftWidth) !== null && _c !== void 0 ? _c : 0, (_d = this._config.rightWidth) !== null && _d !== void 0 ? _d : 0, (_e = this._config.topHeight) !== null && _e !== void 0 ? _e : 0, (_f = this._config.bottomHeight) !== null && _f !== void 0 ? _f : 0);
(_g = this.image) === null || _g === void 0 ? void 0 : _g.setTexture(((_h = this._config.texture) !== null && _h !== void 0 ? _h : ""), this._config.frame);
(_j = this.image) === null || _j === void 0 ? void 0 : _j.setDisplaySize((_k = this._config.width) !== null && _k !== void 0 ? _k : 0, (_l = this._config.height) !== null && _l !== void 0 ? _l : 0);
(_m = this.image) === null || _m === void 0 ? void 0 : _m.setOrigin(0);
this.addChild(this.image);
}
else {
var radius = (_o = config.radius) !== null && _o !== void 0 ? _o : 0;
var backgroundColor = (_p = config.backgroundColor) !== null && _p !== void 0 ? _p : 0;
var borderWidth = (_q = config.borderWidth) !== null && _q !== void 0 ? _q : 0;
var borderColor = config.borderColor || 0xcf4b00;
if (this.bg) {
this.bg.destroy(true);
this.bg = undefined;
}
this.bg = Utils.reDrawRoundedRectRenderTexture(this.scene, this.scene.make.renderTexture({
x: 0,
y: 0,
width: config.width,
height: config.height,
}), 0, 0, config.width, config.height, borderWidth, radius, borderColor, backgroundColor);
this.addChildAt(this.bg, 0);
}
};
Object.defineProperty(TextButton.prototype, "text", {
set: function (text) {
if (this.label)
this.label.text = text;
},
enumerable: false,
configurable: true
});
TextButton.prototype.destroy = function (fromScene) {
if (this.bg) {
this.bg.destroy();
this.bg = undefined;
}
if (this.label) {
this.label.destroy();
this.label = undefined;
}
_super.prototype.destroy.call(this, fromScene);
};
return TextButton;
}(BaseButton));
export { TextButton };