laravel-jstools
Version:
JS tools for building front-side of Laravel applications
123 lines (122 loc) • 4.06 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.JsTree = void 0;
class JsTree {
constructor(treeId, options, data) {
this.collapseAllDefault = true;
this.expandAllDefault = true;
this.deselectAllDefault = true;
this.treeId = treeId;
this.$tree = $(`#${treeId}`);
this.$tree.jstree(options);
this.tree = this.$tree.jstree(true);
this.setListeners();
if (data) {
this.setData(data, this.$tree.data('value'));
}
else {
this.selectInitial();
}
}
setCollapseAllCallback(callback, saveDefault = true) {
this.callbackCollapseAll = callback;
this.collapseAllDefault = saveDefault;
}
setExpandAllCallback(callback, saveDefault = true) {
this.callbackExpandAll = callback;
this.expandAllDefault = saveDefault;
}
setDeselectAllCallback(callback, saveDefault = true) {
this.callbackDeselectAll = callback;
this.deselectAllDefault = saveDefault;
}
setListeners() {
this.$tree.on('hover_node.jstree', () => {
const bar = this.$tree.find('.jstree-wholerow-hovered');
bar.css('height', bar.parent().children('a.jstree-anchor').height() + 'px');
});
$(`#${this.treeId}__collapse`).on('click', () => {
if (this.collapseAllDefault) {
this.closeAll();
}
if (this.callbackCollapseAll) {
this.callbackCollapseAll();
}
});
$(`#${this.treeId}__expand`).on('click', () => {
if (this.expandAllDefault) {
this.openAll();
}
if (this.callbackExpandAll) {
this.callbackExpandAll();
}
});
$(`#${this.treeId}__deselect`).on('click', () => {
if (this.deselectAllDefault) {
this.deselectAll();
}
if (this.callbackDeselectAll) {
this.callbackDeselectAll();
}
});
}
prepareData(data) {
const nodeData = [];
data.forEach((item) => {
const nodeItem = {};
nodeItem.id = `${this.treeId}_${item.value}`;
nodeItem.li_attr = { 'data-value': item.value };
nodeItem.a_attr = { 'data-value': item.value };
nodeItem.text = item.text;
nodeItem.children = this.prepareData(item.children);
nodeData.push(nodeItem);
});
return nodeData;
}
on(event, closure) {
this.$tree.on(event, closure);
}
onChanged(closure) {
this.$tree.on('changed.jstree', (e, data) => {
if (!['ready'].includes(data.action)) {
closure(e, data);
}
});
}
setData(data, value) {
if (value) {
this.$tree.on('refresh.jstree', () => {
this.select(value, true);
this.$tree.off('refresh.jstree');
});
}
this.closeAll();
this.tree.settings.core.data = this.prepareData(data);
this.tree.refresh();
}
select(value, suppressEvent = false, preventOpen = false) {
this.reset(true);
this.tree.select_node(`${this.treeId}_${value}`, suppressEvent, preventOpen);
}
getValue() {
const selected = this.tree.get_selected(true)[0];
return selected ? selected.li_attr['data-value'] : null;
}
closeAll() {
this.tree.close_all();
}
deselectAll(suppressEvent = false) {
this.tree.deselect_all(suppressEvent);
}
openAll() {
this.tree.open_all();
}
reset(suppressEvent = false) {
this.closeAll();
this.deselectAll(suppressEvent);
}
selectInitial() {
this.select(this.$tree.data('value'), true);
}
}
exports.JsTree = JsTree;