Foundry/taf
1
0
Fork 0
Code Issues 8 Pull requests Releases 3 Wiki Activity Actions

Update the handling of attribtute drag and drop to make it more user-friendly (closes #30)

Browse source
This commit is contained in:
Oliver 2026-02-15 15:06:56 -07:00
parent 60fe27e170
commit 37660fc94d
2 changed files with 26 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

30
module/apps/AttributeManager.mjs
View file

@ -5,7 +5,7 @@ import { toID } from "../utils/toID.mjs";
const { HandlebarsApplicationMixin, ApplicationV2 } = foundry.applications.api; const { HandlebarsApplicationMixin, ApplicationV2 } = foundry.applications.api;
const { deepClone, diffObject, mergeObject, performIntegerSort, randomID, setProperty } = foundry.utils; const { deepClone, diffObject, mergeObject, performIntegerSort, randomID, setProperty } = foundry.utils;
const { DragDrop, TextEditor } = foundry.applications.ux; const { DragDrop } = foundry.applications.ux;
export class AttributeManager extends HandlebarsApplicationMixin(ApplicationV2) { export class AttributeManager extends HandlebarsApplicationMixin(ApplicationV2) {
@ -71,7 +71,8 @@ export class AttributeManager extends HandlebarsApplicationMixin(ApplicationV2)
}; };
new DragDrop.implementation({ new DragDrop.implementation({
dragSelector: `.draggable`, dragSelector: `.attribute-drag-handle`,
dropSelector: `.attributes`,
permissions: { permissions: {
dragstart: this._canDragStart.bind(this), dragstart: this._canDragStart.bind(this),
drop: this._canDragDrop.bind(this), drop: this._canDragDrop.bind(this),
@ -172,6 +173,7 @@ export class AttributeManager extends HandlebarsApplicationMixin(ApplicationV2)
return [ id, attr ]; return [ id, attr ];
}); });
const data = Object.fromEntries(entries); const data = Object.fromEntries(entries);
this.#attributes = data;
const diff = diffObject( const diff = diffObject(
this.#doc.system.attr, this.#doc.system.attr,
@ -195,24 +197,34 @@ export class AttributeManager extends HandlebarsApplicationMixin(ApplicationV2)
_onDragStart(event) { _onDragStart(event) {
const target = event.currentTarget.closest(`[data-attribute]`); const target = event.currentTarget.closest(`[data-attribute]`);
if (`link` in event.target.dataset) { return }; if (`link` in event.target.dataset) { return };
let dragData; if (!target.dataset.attribute) { return };
if (target.dataset.attribute) {
const attributeID = target.dataset.attribute; const attributeID = target.dataset.attribute;
const attribute = this.#attributes[attributeID]; const attribute = this.#attributes[attributeID];
dragData = { const dragData = {
_id: attributeID, _id: attributeID,
sort: attribute.sort, sort: attribute.sort,
}; };
};
if (!dragData) { return };
event.dataTransfer.setDragImage(target, 16, 23); event.dataTransfer.setDragImage(target, 16, 23);
event.dataTransfer.setData(`text/plain`, JSON.stringify(dragData)); event.dataTransfer.setData(`taf/json`, JSON.stringify(dragData));
// Provide an attribute reference in a way that prose-mirror can use
if (!attribute.isNew) {
event.dataTransfer.setData(
`text/plain`,
`[[@${attributeID}]]{${attribute.name}}`,
);
};
}; };
_onDrop(event) { _onDrop(event) {
const dropped = TextEditor.implementation.getDragEventData(event); let dropped;
try {
dropped = JSON.parse(event.dataTransfer.getData(`taf/json`));
} catch {
return;
}
const dropTarget = event.target.closest(`[data-attribute]`); const dropTarget = event.target.closest(`[data-attribute]`);
if (!dropTarget) { return }; if (!dropTarget) { return };

2
templates/AttributeManager/attribute-list.hbs
View file

@ -8,7 +8,7 @@
name="icons/drag-handle" name="icons/drag-handle"
var:stroke="currentColor" var:stroke="currentColor"
var:fill="currentColor" var:fill="currentColor"
class="draggable" class="attribute-drag-handle"
></taf-icon> ></taf-icon>
{{#if attr.isNew}} {{#if attr.isNew}}
<input <input