From ed694372d5be83aca8e87a03a4b68d550d6f22c7 Mon Sep 17 00:00:00 2001
From: Cal Corum <calcorum@users.noreply.github.com>
Date: Mon, 22 Dec 2025 15:01:27 -0600
Subject: [PATCH] Add clickable profile image to change actor portrait
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Update templates to use data-action="editImage" (v13 style)
- Add custom #onEditImage handler using FilePicker API
- Add hover effect and cursor:pointer to profile images

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 module/sheets/base-actor-sheet.mjs   | 21 +++++++++++++++++++++
 styles/scss/sheets/_actor-sheet.scss |  7 +++++--
 templates/actor/character-header.hbs |  2 +-
 templates/actor/npc-header.hbs       |  2 +-
 4 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/module/sheets/base-actor-sheet.mjs b/module/sheets/base-actor-sheet.mjs
index 4703527..9ecd440 100644
--- a/module/sheets/base-actor-sheet.mjs
+++ b/module/sheets/base-actor-sheet.mjs
@@ -55,6 +55,7 @@ export default class VagabondActorSheet extends HandlebarsApplicationMixin(Actor
       closeOnSubmit: false,
     },
     actions: {
+      editImage: VagabondActorSheet.#onEditImage,
       rollSkill: VagabondActorSheet.#onRollSkill,
       rollSave: VagabondActorSheet.#onRollSave,
       rollAttack: VagabondActorSheet.#onRollAttack,
@@ -858,4 +859,24 @@ export default class VagabondActorSheet extends HandlebarsApplicationMixin(Actor
 
     await item.delete();
   }
+
+  /**
+   * Handle image editing via FilePicker.
+   * @param {PointerEvent} event
+   * @param {HTMLElement} target
+   */
+  static async #onEditImage(event, target) {
+    event.preventDefault();
+    const field = target.dataset.field || "img";
+    const current = foundry.utils.getProperty(this.document, field);
+
+    const fp = new FilePicker({
+      type: "image",
+      current,
+      callback: async (path) => {
+        await this.document.update({ [field]: path });
+      },
+    });
+    fp.render(true);
+  }
 }
diff --git a/styles/scss/sheets/_actor-sheet.scss b/styles/scss/sheets/_actor-sheet.scss
index 038c70a..bc74816 100644
--- a/styles/scss/sheets/_actor-sheet.scss
+++ b/styles/scss/sheets/_actor-sheet.scss
@@ -32,7 +32,7 @@
         transition: opacity $transition-fast;
 
         &:hover {
-          opacity: 0.85;
+          opacity: 0.8;
         }
       }
     }
@@ -2173,9 +2173,12 @@
         border: 2px solid var(--color-border);
         border-radius: $radius-md;
         cursor: pointer;
-        transition: border-color $transition-fast;
+        transition:
+          border-color $transition-fast,
+          opacity $transition-fast;
 
         &:hover {
+          opacity: 0.8;
           border-color: var(--color-accent-primary);
         }
       }
diff --git a/templates/actor/character-header.hbs b/templates/actor/character-header.hbs
index b096533..a204d87 100644
--- a/templates/actor/character-header.hbs
+++ b/templates/actor/character-header.hbs
@@ -3,7 +3,7 @@
 <header class="sheet-header">
   <div class="header-left">
     <img class="profile-img" src="{{actor.img}}" alt="{{actor.name}}"
-         data-edit="img" data-tooltip="VAGABOND.ChangePortrait" />
+         data-action="editImage" data-field="img" data-tooltip="VAGABOND.ChangePortrait" />
   </div>
 
   <div class="header-center">
diff --git a/templates/actor/npc-header.hbs b/templates/actor/npc-header.hbs
index a5e7a95..d791db2 100644
--- a/templates/actor/npc-header.hbs
+++ b/templates/actor/npc-header.hbs
@@ -3,7 +3,7 @@
 <header class="sheet-header npc-header">
   <div class="header-portrait">
     <img class="profile-img" src="{{actor.img}}" alt="{{actor.name}}"
-         data-edit="img" data-tooltip="VAGABOND.ChangePortrait" />
+         data-action="editImage" data-field="img" data-tooltip="VAGABOND.ChangePortrait" />
   </div>
 
   <div class="header-info">