Enhance actor sheet

css/fvtt-hellborn.css

@@ -216,6 +216,12 @@ i.fvtt-hellborn {
   max-width: 16rem;
   margin-bottom: auto;
 }
+.fvtt-hellborn .character-main .character-pc .character-right .character-definition .trait {
+  min-width: 13rem;
+  max-width: 13rem;
+  margin-right: 1rem;
+  margin-bottom: auto;
+}
 .fvtt-hellborn .character-main .character-pc .character-right .character-name {
   display: flex;
 }
@@ -579,6 +585,38 @@ i.fvtt-hellborn {
 .fvtt-hellborn .tab.character-biography .main-div .splitted-text fieldset {
   width: 100%;
 }
+.fvtt-hellborn .tab.character-biography .main-div .deals {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 4px;
+}
+.fvtt-hellborn .tab.character-biography .main-div .deals .deal {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  margin-left: 4px;
+  min-width: 12rem;
+  max-width: 12rem;
+}
+.fvtt-hellborn .tab.character-biography .main-div .deals .deal .rollable:hover,
+.fvtt-hellborn .tab.character-biography .main-div .deals .deal .rollable:focus {
+  text-shadow: 0 0 8px var(--color-shadow-primary);
+  cursor: pointer;
+}
+.fvtt-hellborn .tab.character-biography .main-div .deals .deal .controls {
+  font-size: 0.7rem;
+  min-width: 1.8rem;
+  max-width: 1.8rem;
+}
+.fvtt-hellborn .tab.character-biography .main-div .deals .deal .name {
+  min-width: 10rem;
+  max-width: 10rem;
+}
+.fvtt-hellborn .tab.character-biography .main-div .deals .deal .item-img {
+  width: 24px;
+  height: 24px;
+  margin: 4px 0 0 0;
+}
 .fvtt-hellborn .tab.character-biography .main-div .biodata {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
@@ -597,16 +635,20 @@ i.fvtt-hellborn {
   align-items: center;
   gap: 4px;
   margin-left: 4px;
-  min-width: 12rem;
+  min-width: 14rem;
-  max-width: 12rem;
+  max-width: 14rem;
 }
 .fvtt-hellborn .tab.character-biography .main-div .biodata .form-group label {
   min-width: 6rem;
   max-width: 6rem;
 }
+.fvtt-hellborn .tab.character-biography .main-div .biodata input .tarot {
+  min-width: 8rem;
+  max-width: 8rem;
+}
 .fvtt-hellborn .tab.character-biography .main-div .biodata input {
-  min-width: 4rem;
+  min-width: 8rem;
-  max-width: 4rem;
+  max-width: 8rem;
 }
 .fvtt-hellborn .tab.character-biography .main-div prose-mirror.inactive {
   min-height: 40px;

lang/en.json

@@ -315,6 +315,8 @@
       }
     },
     "Label": {
+      "deals": "Deals",
+      "tarot": "Tarot",
       "backstory": "Backstory",
       "scars": "Scars",
       "likes": "Likes",
@@ -444,7 +446,10 @@
         }
       }
     },
-    "Notifications": {},
+    "Notifications": {
+      "tarotDeleted": "Previous Tarot card deleted : ",
+      "speciesTraitDeleted": "Previous Species Trait deleted : "
+    },
     "Perk": {
       "FIELDS": {
         "description": {

module/applications/sheets/character-sheet.mjs

@@ -71,6 +71,9 @@ export default class HellbornCharacterSheet extends HellbornActorSheet {
     const context = await super._prepareContext()
     context.tabs = this.#getTabs()
 
+    const doc = this.document
+    context.trait = doc.itemTypes['species-trait']?.[0]
+
     return context
   }
 
@@ -106,7 +109,7 @@ export default class HellbornCharacterSheet extends HellbornActorSheet {
         context.tab = context.tabs.biography
         context.deals = doc.itemTypes.deal
         context.deals.sort((a, b) => a.name.localeCompare(b.name))
-        context.tarot = doc.itemTypes.tarot
+        context.tarot = doc.itemTypes.tarot?.[0]
         context.enrichedBackstory = await foundry.applications.ux.TextEditor.implementation.enrichHTML(this.document.system.backstory, { async: true })
         context.enrichedAppearance = await foundry.applications.ux.TextEditor.implementation.enrichHTML(this.document.system.appearance, { async: true })
         context.enrichedScars = await foundry.applications.ux.TextEditor.implementation.enrichHTML(this.document.system.scars, { async: true })
@@ -121,6 +124,7 @@ export default class HellbornCharacterSheet extends HellbornActorSheet {
         context.enrichedNotes = await foundry.applications.ux.TextEditor.implementation.enrichHTML(this.document.system.notes, { async: true })
         break
     }
+    console.log("context", context)
     return context
   }
 
@@ -188,14 +192,32 @@ export default class HellbornCharacterSheet extends HellbornActorSheet {
 
   async _onDrop(event) {
     if (!this.isEditable || !this.isEditMode) return
-    const data = TextEditor.getDragEventData(event)
+    const data = foundry.applications.ux.TextEditor.implementation.getDragEventData(event)
 
     // Handle different data types
-    switch (data.type) {
+    if  (data.type === "Item") {
-      case "Item":
+      const item = await fromUuid(data.uuid)
-        const item = await fromUuid(data.uuid)
+      if (item.type === "tarot") {
-        return super._onDropItem(item)
+        // Delete the existing tarot item
+        const existingTarot = this.document.items.find(i => i.type === "tarot")
+        if (existingTarot) {
+          await existingTarot.delete()
+          // Display info message
+          ui.notifications.info(game.i18n.localize("HELLBORN.Notifications.tarotDeleted") + existingTarot.name)
+        }
+      }
+      if (item.type === "species-trait") {
+        // Check if the item is already in the actor
+        const existingTrait = this.document.items.find(i => i.type === "species-trait" && i.name === item.name)
+        if (existingTrait) {
+          await existingTrait.delete()
+          // Display info message
+          ui.notifications.info(game.i18n.localize("HELLBORN.Notifications.speciesTraitDeleted")+ existingTrait.name)
+        }
+      }
+      return super._onDropItem(item)
     }
+
   }
 
 }

styles/character.less

@@ -78,6 +78,12 @@
           max-width: 16rem;
           margin-bottom: auto;
         }
+        .trait{
+          min-width: 13rem;
+          max-width: 13rem;
+          margin-right: 1rem;
+          margin-bottom: auto;
+        }
       }
       .character-name {
         display: flex;
@@ -470,6 +476,38 @@
       width: 100%;
     }
   }
+  .deals {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: 4px;
+    .deal {
+      display: flex;
+      align-items: center;
+      gap: 4px;
+      margin-left: 4px;
+      min-width: 12rem;
+      max-width: 12rem;
+      .rollable:hover,
+      .rollable:focus {
+        text-shadow: 0 0 8px var(--color-shadow-primary);
+        cursor: pointer;
+      }
+      .controls {
+        font-size: 0.7rem;
+        min-width: 1.8rem;
+        max-width: 1.8rem;
+      }
+      .name {
+        min-width: 10rem;
+        max-width: 10rem;
+      }
+      .item-img {
+        width: 24px;
+        height: 24px;
+        margin: 4px 0 0 0;
+      }
+    }
+  }
   .biodata {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
@@ -491,13 +529,17 @@
       align-items: center;
       gap: 4px;
       margin-left: 4px;
-      min-width: 12rem;
+      min-width: 14rem;
-      max-width: 12rem;
+      max-width: 14rem;
+    }
+    input .tarot {
+      min-width: 8rem;
+      max-width: 8rem;
     }
     input {
-      min-width: 4rem;
+      min-width: 8rem;
-      max-width: 4rem;
+      max-width: 8rem;
-  }
+    }
   }
 
   prose-mirror.inactive {

templates/character-biography.hbs

@@ -41,8 +41,44 @@
         {{formField systemFields.biodata.fields.birthplace value=system.biodata.birthplace rootId=partId
         disabled=isPlayMode}}
       </div>
+      <div class="experience">
+        <div class="form-group">
+          <label>{{localize "HELLBORN.Label.tarot"}}</label>
+          <input class="tarot" type="text" value="{{tarot.name}}" disabled >
+            <div class="controls">
+              <a data-tooltip="{{localize 'HELLBORN.Edit'}}" data-action="edit" data-item-id="{{tarot.id}}"
+                data-item-uuid="{{tarot.uuid}}"><i class="fas fa-edit"></i></a>
+              <a data-tooltip="{{localize 'HELLBORN.Delete'}}" data-action="delete" data-item-id="{{tarot.id}}"
+                data-item-uuid="{{tarot.uuid}}"><i class="fas fa-trash"></i></a>
+            </div>
+        </div>
+      </div>
   </fieldset>
 
+  <fieldset>
+    <legend>{{localize "HELLBORN.Label.deals"}}{{#if isEditMode}}
+      <a class="action" data-tooltip="{{localize "HELLBORN.Tooltip.addDeals"}}" data-tooltip-direction="UP"><i
+          class="fas fa-plus" data-action="createDeal"></i></a>{{/if}}
+    </legend>
+    <div class="deals">
+      {{#each deals as |item|}}
+      <div class="deal" data-item-id="{{item.id}}" data-item-uuid="{{item.uuid}}">
+        <img class="item-img" src="{{item.img}}" data-tooltip="{{item.name}}" />
+        <div class="name" data-tooltip="{{{item.system.description}}}">
+          {{item.name}}
+        </div>
+        <div class="controls">
+          <a data-tooltip="{{localize 'HELLBORN.Edit'}}" data-action="edit" data-item-id="{{item.id}}"
+            data-item-uuid="{{item.uuid}}"><i class="fas fa-edit"></i></a>
+          <a data-tooltip="{{localize 'HELLBORN.Delete'}}" data-action="delete" data-item-id="{{item.id}}"
+            data-item-uuid="{{item.uuid}}"><i class="fas fa-trash"></i></a>
+        </div>
+      </div>
+      {{/each}}
+    </div>
+  </fieldset>
+
+
   <fieldset>
     <legend>{{localize "HELLBORN.Label.backstory"}}</legend>
     {{formInput systemFields.backstory enriched=enrichedBackstory value=system.backstory name="system.backstory" toggled=true}}

templates/character-main.hbs

@@ -26,7 +26,16 @@
             {{formField systemFields.species value=system.species rootId=partId disabled=isPlayMode}}
           </div>
           <div class="flexrow">
-            {{formField systemFields.trait value=system.trait rootId=partId disabled=isPlayMode}}
+            <div class="form-group">
+              <label>Trait</label>
+              <input class="trait" type="text" value="{{trait.name}}" disabled >
+              <div class="controls">
+                <a data-tooltip="{{localize 'HELLBORN.Edit'}}" data-action="edit" data-item-id="{{trait.id}}"
+                  data-item-uuid="{{trait.uuid}}"><i class="fas fa-edit"></i></a>
+                <a data-tooltip="{{localize 'HELLBORN.Delete'}}" data-action="delete" data-item-id="{{trait.id}}"
+                  data-item-uuid="{{trait.uuid}}"><i class="fas fa-trash"></i></a>
+              </div>
+            </div>
           </div>
         </fieldset>