Support vaulting and unvaulting domain cards via dragdrop (#2070)

lang/en.json

@@ -3233,7 +3233,7 @@
                 "beastformToManyAdvantages": "You cannot select any more advantages.",
                 "beastformToManyFeatures": "You cannot select any more features.",
                 "beastformEquipWeapon": "You cannot use weapons while in a Beastform.",
-                "loadoutMaxReached": "You've reached maximum loadout. Move atleast one domain card to the vault, or increase the limit in homebrew settings if desired.",
+                "loadoutMaxReached": "You've reached the maximum loadout size. To add more, move at least one domain card to the vault.",
                 "domainMaxReached": "You've reached the maximum domains for the class. Increase the limit in homebrew settings if desired.",
                 "insufficientResources": "You don't have enough resources to use that action.",
                 "actionNoUsesRemaining": "That action doesn't have remaining uses.",

module/applications/sheets/actors/character.mjs

@@ -914,7 +914,7 @@ export default class CharacterSheet extends DHBaseActorSheet {
         const doc = await getDocFromElement(button);
         const { available } = this.document.system.loadoutSlot;
         if (doc.system.inVault && !available && !doc.system.loadoutIgnore) {
-            return ui.notifications.warn(game.i18n.localize('DAGGERHEART.UI.Notifications.loadoutMaxReached'));
+            return ui.notifications.warn('DAGGERHEART.UI.Notifications.loadoutMaxReached', { localize: true });
         }
 
         await doc?.update({ 'system.inVault': !doc.system.inVault });
@@ -1206,10 +1206,22 @@ export default class CharacterSheet extends DHBaseActorSheet {
             if (!confirmed) return;
         }
 
-        if (this.document.uuid === item.parent?.uuid) {
+        // Check for same actor drag/drop attempts
+        const isSameActor = this.document.uuid === item.parent?.uuid;
+        const loadoutFieldset = event.target.closest('[data-in-vault]');
+        const vaulting = loadoutFieldset?.dataset.inVault === 'true';
+        if (isSameActor && loadoutFieldset && item.type === 'domainCard' && vaulting !== item.system.inVault) {
+            // This is likely an attempt to vault or unvault an item
+            const { available } = this.document.system.loadoutSlot;
+            if (!vaulting && !available && !item.system.loadoutIgnore) {
+                return ui.notifications.warn('DAGGERHEART.UI.Notifications.loadoutMaxReached', { localize: true });
+            }
+            return item.update({ 'system.inVault': vaulting });
+        } else if (isSameActor) {
             return super._onDropItem(event, item);
         }
 
+        // Handle beastforms
         if (item.type === 'beastform') {
             if (this.document.effects.find(x => x.type === 'beastform')) {
                 return ui.notifications.warn(

templates/sheets/actors/character/loadout.hbs

@@ -1,42 +1,43 @@
-<section class='tab {{tabs.loadout.cssClass}} {{tabs.loadout.id}}' data-tab='{{tabs.loadout.id}}'
+<section class='tab {{tabs.loadout.cssClass}} {{tabs.loadout.id}}' data-tab='{{tabs.loadout.id}}'
-    data-group='{{tabs.loadout.group}}'>
+    data-group='{{tabs.loadout.group}}'>
-    <div class="search-section">
+    <div class="search-section">
-        <div class="search-bar">
+        <div class="search-bar">
-            <div class="icon">
+            <div class="icon">
-                <i class="fa-solid fa-magnifying-glass"></i>
+                <i class="fa-solid fa-magnifying-glass"></i>
-            </div>
+            </div>
-            <input type="search" name="search" class="search-loadout" placeholder="{{localize "DAGGERHEART.GENERAL.searchPlaceholder"}}">
+            <input type="search" name="search" class="search-loadout" placeholder="{{localize "DAGGERHEART.GENERAL.searchPlaceholder"}}">
-        </div>
+        </div>
-        <a class="filter-button">
+        <a class="filter-button">
-            <i class="fa-solid fa-filter"></i>
+            <i class="fa-solid fa-filter"></i>
-        </a>
+        </a>
-        <button type="button" class="btn-toggle-view" data-action="toggleLoadoutView" data-value="{{not cardView}}">
+        <button type="button" class="btn-toggle-view" data-action="toggleLoadoutView" data-value="{{not cardView}}">
-            <span class="{{ifThen cardView '' 'list-active'}} list-icon">
+            <span class="{{ifThen cardView '' 'list-active'}} list-icon">
-                <i class="fa-solid fa-bars"></i>
+                <i class="fa-solid fa-bars"></i>
-            </span>
+            </span>
-            <span class="{{ifThen cardView 'grid-active' ''}} grid-icon">
+            <span class="{{ifThen cardView 'grid-active' ''}} grid-icon">
-                <i class="fa-solid fa-grip"></i>
+                <i class="fa-solid fa-grip"></i>
-            </span>
+            </span>
-        </button>
+        </button>
-    </div>
+    </div>
-
+
-    <div class="items-section">
+    <div class="items-section">
-        {{> 'daggerheart.inventory-items'
+        {{> 'daggerheart.inventory-items'
-        title='DAGGERHEART.GENERAL.Tabs.loadout'
+        title='DAGGERHEART.GENERAL.Tabs.loadout'
-        type='domainCard'
+        type='domainCard'
-        isGlassy=true
+        isGlassy=true
-        cardView=cardView
+        cardView=cardView
-        collection=document.system.domainCards.loadout
+        collection=document.system.domainCards.loadout
-        canCreate=@root.editable
+        canCreate=@root.editable
-        }}
+        inVault=false
-        {{> 'daggerheart.inventory-items'
+        }}
-        title='DAGGERHEART.GENERAL.Tabs.vault'
+        {{> 'daggerheart.inventory-items'
-        type='domainCard'
+        title='DAGGERHEART.GENERAL.Tabs.vault'
-        isGlassy=true
+        type='domainCard'
-        cardView=cardView
+        isGlassy=true
-        collection=document.system.domainCards.vault
+        cardView=cardView
-        canCreate=@root.editable
+        collection=document.system.domainCards.vault
-        inVault=true
+        canCreate=@root.editable
-        }}
+        inVault=true
-    </div>
+        }}
+    </div>
 </section>

templates/sheets/actors/character/sidebar.hbs

@@ -110,7 +110,7 @@
                 {{/each}}
             </ul>
         </div>
-        <div class="loadout-section">
+        <div class="loadout-section" data-in-vault="false">
             <div class="title">
                 <side-line-div class="invert"></side-line-div>
                 <h3>{{localize "DAGGERHEART.GENERAL.loadout"}}</h3>
@@ -118,11 +118,10 @@
             </div>
             <ul class="items-sidebar-list">
                 {{#each document.system.domainCards.loadout as |card|}}
-                {{> 'daggerheart.inventory-item-compact'
+                    {{> 'daggerheart.inventory-item-compact'
-                    item=card
+                        item=card
-                    type='domainCard'
+                        type='domainCard'
-                }}
+                    }}
-
                 {{/each}}
             </ul>
         </div>

templates/sheets/global/partials/inventory-fieldset-items-V2.hbs

@@ -26,7 +26,7 @@ Parameters:
 - showActions {boolean} : If true show feature's actions. 
 --}}
 
-<fieldset class="{{#if isGlassy}}glassy{{/if}} drop-section">
+<fieldset class="{{#if isGlassy}}glassy{{/if}} drop-section" {{#unless (isNullish inVault)}}data-in-vault="{{inVault}}"{{/unless}}>
   <legend>
     {{localize title}}
     {{#if canCreate}}