sparnatural
Version:
Visual client-side SPARQL query builder and knowledge graph exploration tool
58 lines • 2.63 kB
JavaScript
import { Order } from "../../../SparnaturalQueryIfc";
import { I18n } from "../../../settings/I18n";
import { AscendBtn } from "../../buttons/AscendBtn";
import { DescendBtn } from "../../buttons/DescendBtn";
import { NoOrderBtn } from "../../buttons/NoOrderBtn";
import { VariableOptionsSelectBtn } from "../../buttons/VariableOptionsSelectBtn";
import { HTMLComponent } from "../../HtmlComponent";
class VariableSortOption extends HTMLComponent {
constructor(parentComponent) {
let widgetHtml = $(`<strong>${I18n.labels.labelOrderSort}</strong>`);
super("variablesOrdersSelect", parentComponent, widgetHtml);
this.changeSortOrderCallBack = (order) => {
this.html[0].dispatchEvent(new CustomEvent("changeSortOrder", { bubbles: true, detail: order }));
};
this.toggleVarNames = () => {
this.html[0].dispatchEvent(new CustomEvent("toggleVarNames", { bubbles: true }));
};
}
render() {
this.htmlParent = $(this.parentComponent.html).find(".line1");
super.render();
this.ascendBtn = new AscendBtn(this, this.changeSortOrderCallBack).render();
this.descendBtn = new DescendBtn(this, this.changeSortOrderCallBack).render();
this.noOrderBtn = new NoOrderBtn(this, this.changeSortOrderCallBack).render();
// select no order by default
this.noOrderBtn.setSelected(true);
this.variableOptionSelectBtn = new VariableOptionsSelectBtn(this, this.toggleVarNames).render();
// when one of the button is clicked, unselect the other ones
this.html[0].addEventListener("changeSortOrder", (e) => {
switch (e.detail) {
case Order.ASC: {
this.ascendBtn.setSelected(true);
this.descendBtn.setSelected(false);
this.noOrderBtn.setSelected(false);
break;
}
case Order.DESC: {
this.ascendBtn.setSelected(false);
this.descendBtn.setSelected(true);
this.noOrderBtn.setSelected(false);
break;
}
case Order.NOORDER: {
this.ascendBtn.setSelected(false);
this.descendBtn.setSelected(false);
this.noOrderBtn.setSelected(true);
break;
}
default: {
break;
}
}
});
return this;
}
}
export default VariableSortOption;
//# sourceMappingURL=VariableSortOptions.js.map