@geogirafe/lib-geoportal
Version:
GeoGirafe is a flexible application to build online geoportals.
102 lines (101 loc) • 3.39 kB
JavaScript
import GirafeHTMLElement from '../../../base/GirafeHTMLElement';
import LayerManager from '../../../tools/layers/layermanager';
import DragManager from './dragmanager';
export default class TreeViewElement extends GirafeHTMLElement {
constructor(layer, name) {
super(name);
Object.defineProperty(this, "dragManager", {
enumerable: true,
configurable: true,
writable: true,
value: void 0
});
Object.defineProperty(this, "layerManager", {
enumerable: true,
configurable: true,
writable: true,
value: void 0
});
Object.defineProperty(this, "layer", {
enumerable: true,
configurable: true,
writable: true,
value: void 0
});
Object.defineProperty(this, "dragButton", {
enumerable: true,
configurable: true,
writable: true,
value: void 0
});
Object.defineProperty(this, "container", {
enumerable: true,
configurable: true,
writable: true,
value: void 0
});
this.layer = layer;
this.layerManager = LayerManager.getInstance();
this.dragManager = DragManager.getInstance();
}
render() {
super.render();
this.dragButton = this.shadow.getElementById('drag-button');
this.container = this.shadow.getElementById('container');
super.girafeTranslate();
this.initializeDrag();
this.createTooltips();
}
refreshRender(layer) {
if (this.state.treeview.renderEnabled && (!layer || layer === this.layer)) {
// Is called without param, call refresh
// Else, call refresh only if the layer in param is the current one
super.refreshRender();
this.createTooltips();
}
}
createTooltips() {
super.activateTooltips(false, [800, 0], 'top');
}
showMetadata() {
window.gOpenWindow(this.layer.name, this.layer.metadataUrl);
}
initializeDrag() {
this.dragButton.draggable = true;
this.dragButton.ondragstart = (e) => this.dragStart(e);
this.dragButton.ondragend = (e) => this.dragEnd(e);
this.ondragenter = (e) => this.dragEnter(e);
this.ondragleave = (e) => this.dragLeave(e);
}
dragStart(event) {
this.dragManager.dragStart(this.layer);
event.dataTransfer.setDragImage(this, this.offsetWidth, 0);
}
dragEnd(_event) {
this.dragManager.dragEnd();
}
dragEnter(_event) {
if (this.dragManager.dragEnter(this.layer)) {
this.setDragStyle();
}
}
dragLeave(_event) {
if (this.dragManager.dragLeave(this.layer)) {
this.setDragStyle();
}
}
setDragStyle() {
if (this.dragManager.dragAfter) {
this.container.classList.remove('dragBefore');
this.container.classList.add('dragAfter');
}
else if (this.dragManager.dragBefore) {
this.container.classList.remove('dragAfter');
this.container.classList.add('dragBefore');
}
else {
this.container.classList.remove('dragAfter');
this.container.classList.remove('dragBefore');
}
}
}