@kitten-science/kitten-scientists
Version:
Add-on for the wonderful incremental browser game: https://kittensgame.com/web/
48 lines • 1.81 kB
JavaScript
import { Icons } from "../../../images/Icons.js";
import stylesButton from "../Button.module.css";
import { UiComponent } from "../UiComponent.js";
import styles from "./ExpandoButton.module.css";
export class ExpandoButton extends UiComponent {
element;
ineffective;
/**
* Constructs an expando element that is commonly used to expand and
* collapses a section of the UI.
*
* @param host A reference to the host.
* @param options Options for this expando.
*/
constructor(host, options) {
super(host, options);
const element = $("<div/>", {
html: `
<svg style="width: 18px; height: 18px;" viewBox="0 -960 960 960" fill="currentColor" class="${styles.down}"><path d="${Icons.ExpandCircleDown}"/></svg>
<svg style="width: 18px; height: 18px;" viewBox="0 -960 960 960" fill="currentColor" class="${styles.up}"><path d="${Icons.ExpandCircleUp}"/></svg>
`,
title: host.engine.i18n("ui.itemsShow"),
})
.addClass(stylesButton.iconButton)
.addClass(styles.expandoButton);
this.element = element;
this.addChildren(options?.children);
this.ineffective = false;
}
setCollapsed() {
this.element.removeClass(styles.expanded);
this.element.prop("title", this._host.engine.i18n("ui.itemsShow"));
}
setExpanded() {
this.element.addClass(styles.expanded);
this.element.prop("title", this._host.engine.i18n("ui.itemsHide"));
}
refreshUi() {
super.refreshUi();
if (this.ineffective) {
this.element.addClass(stylesButton.ineffective);
}
else {
this.element.removeClass(stylesButton.ineffective);
}
}
}
//# sourceMappingURL=ExpandoButton.js.map