/** * EGroupware egw_dragdrop_shoelaceTree - egw action framework * * @link https://www.egroupware.org * @author Andreas Stöckel * @copyright 2011 by Andreas Stöckel * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License * @package egw_action */ import {egwActionObjectInterface} from "./egw_action"; import {Et2Tree} from "../etemplate/Et2Tree/Et2Tree"; import {EGW_AI_DRAG_ENTER, EGW_AI_DRAG_OUT, EGW_AO_STATE_FOCUSED, EGW_AO_STATE_SELECTED} from "./egw_action_constants"; import {egwBitIsSet} from "./egw_action_common"; import {SlTreeItem} from "@shoelace-style/shoelace"; import {EgwActionObject} from "./EgwActionObject"; export const EXPAND_FOLDER_ON_DRAG_DROP_TIMEOUT = 1000 export class EgwDragDropShoelaceTree extends egwActionObjectInterface{ node: SlTreeItem; id: string; tree: Et2Tree; // Reference to the widget that's handling actions for us public findActionTargetHandler : EgwActionObject; private timeout : ReturnType; constructor(_tree : Et2Tree) { super(); this.tree = _tree this.findActionTargetHandler = _tree.widget_object; } public doTriggerEvent(egw_event : number, dom_event : Event) { const target = this.tree.findActionTarget(dom_event); if(egw_event == EGW_AI_DRAG_ENTER) { target.target.classList.add("draggedOver", "drop-hover"); this.timeout = setTimeout(() => { if(target.target.classList.contains("draggedOver")) { (target.target).expanded = true } }, EXPAND_FOLDER_ON_DRAG_DROP_TIMEOUT) } else if(egw_event == EGW_AI_DRAG_OUT) { target.target.classList.remove("draggedOver", "drop-hover"); clearTimeout(this.timeout) } else { debugger; } return true } public doSetState(_state) { if(!this.tree || !this.tree.focusItem) { return; } if(this.stateChangeContext) { const target = this.tree.shadowRoot.querySelector("[id='" + this.stateChangeContext.id + "']"); // Just set the attribute, we're not changing the tree value // The selected attribute will be reset by the tree next render() if(target && egwBitIsSet(_state, EGW_AO_STATE_SELECTED)) { target.setAttribute("selected", ""); } else if(target) { target.removeAttribute("selected"); } if(target && egwBitIsSet(_state, EGW_AO_STATE_FOCUSED)) { target.focus(); } } // Update the "focused" flag if(egwBitIsSet(_state, EGW_AO_STATE_FOCUSED)) { this.tree.focus(); } if(egwBitIsSet(_state, EGW_AO_STATE_SELECTED)) { // _tree.selectItem(this.id, false); // false = do not trigger onSelect } } doGetDOMNode() { return this.tree; } }