Using formApp updateObject()

add actorId option
minor html fix

system/scripts/dice/dice-picker-dialog.js

@@ -4,7 +4,7 @@
  */
 import { RollL5r5e } from "./roll.js";
 
-export class DicePickerDialog extends Application {
+export class DicePickerDialog extends FormApplication {
     /**
      * Current Actor
      */
@@ -58,24 +58,39 @@ export class DicePickerDialog extends Application {
      *
      * ex: new game.l5r5e.DicePickerDialog({skillId: 'aesthetics', ringId: 'fire', actor: game.user.character}).render();
      *
-     * @param options actor, ringId, skillId, difficulty, difficultyHidden
+     * Options :
+     *   actor             A instance of actor (game.user.character, canvas.tokens.controlled[0].actor, ...)
+     *   actorId           string (AbYgKrNwWeAxa9jT)
+     *   ringId            string (fire)
+     *   skillId           string (design)
+     *   difficulty        number (0-9)
+     *   difficultyHidden  boolean
+     *
+     * @param options actor, actorId, ringId, skillId, difficulty, difficultyHidden
      */
     constructor(options = null) {
         super(options);
 
         // Try to get Actor from: options, first selected token or player's selected character
-        [options?.actor, canvas.tokens.controlled[0]?.actor, game.user.character].forEach((actor) => {
+        [
+            options?.actor,
+            game.actors.get(options?.actorId),
+            canvas.tokens.controlled[0]?.actor,
+            game.user.character,
+        ].forEach((actor) => {
             if (!this._actor) {
                 this.actor = actor;
             }
         });
 
-        // Ring ?
+        // Ring
         if (options?.ringId) {
             this.ringId = options.ringId;
         }
 
-        // Skill ?
+        // TODO SkillCategory ?
+
+        // Skill
         if (options?.skillId) {
             this.skillId = options.skillId;
         }
@@ -290,15 +305,27 @@ export class DicePickerDialog extends Application {
             $("#skill_value").val(this._skillData.value);
         });
 
-        // ****************** ROLL ******************
+        // ****************** INIT ******************
-        // Roll button
+        // Select current actor's stance
-        html.find('button[name="roll"]').on("click", async (event) => {
+        html.find(`.approach_${this._actor ? this._actor.data.data.stance : "void"}`)
-            event.preventDefault();
+            .first()
-            event.stopPropagation();
+            .trigger("click");
 
-            const approach = $(html.find(".ring-selection.ring-selected > input")[0]).data("ringid") || null;
+        // Set skill point
-            const ring = html.find("#ring_value")[0].value || null;
+        html.find("#skill_value").val(this._skillData.value);
-            const skill = html.find("#skill_value")[0].value || null;
+    }
+
+    /**
+     * This method is called upon form submission after form data is validated
+     * @param event    The initial triggering submission event
+     * @param formData The object of validated form data with which to update the object
+     * @returns        A Promise which resolves once the update operation has completed
+     * @override
+     */
+    async _updateObject(event, formData) {
+        const approach = $(".ring-selection.ring-selected > input").data("ringid") || null;
+        const ring = formData.ring || null;
+        const skill = formData.skill || null;
 
         if (!approach || !skill || !ring || (skill < 1 && ring < 1)) {
             return false;
@@ -318,14 +345,13 @@ export class DicePickerDialog extends Application {
             // this._actor.data.data.stance = approach;
 
             // If Void point is used, minus the actor
-                if ($("#use_void_point").attr("checked")) {
+            if (formData.use_void_point) {
-                    this._actor.data.data.void_points.current = Math.max(
+                this._actor.data.data.void_points.current = Math.max(this._actor.data.data.void_points.current - 1, 0);
-                        this._actor.data.data.void_points.current - 1,
-                        0
-                    );
             }
 
             // If hidden add void 1pt
+            // this._difficulty.isHidden = !!formData.diff_hidden;
+            // this._difficulty.difficulty = formData.diff;
             if (this._difficulty.isHidden) {
                 this._actor.data.data.void_points.current = Math.min(
                     this._actor.data.data.void_points.current + 1,
@@ -345,17 +371,7 @@ export class DicePickerDialog extends Application {
 
         await roll.roll();
         await roll.toMessage();
-            await this.close();
+        return this.close();
-        });
-
-        // ****************** INIT ******************
-        // Select current actor's stance
-        html.find(`.approach_${this._actor ? this._actor.data.data.stance : "void"}`)
-            .first()
-            .trigger("click");
-
-        // Set skill point
-        html.find("#skill_value").val(this._skillData.value);
     }
 
     /**

system/templates/dice/dice-picker-dialog.html

@@ -149,7 +149,7 @@
             </td>
             <td>
                 {{#if canUseVoidPoint}}
-                    <input type="checkbox" id="use_void_point" name="diff_hidden" value="1">
+                    <input type="checkbox" id="use_void_point" name="use_void_point" value="1">
                     <label for="use_void_point">
                         {{localize 'l5r5e.dicepicker.use_void_point_label'}}
                     </label>
@@ -162,6 +162,6 @@
     </table>
 
     <div class="form-group">
-        <button name="roll">{{localize 'l5r5e.dicepicker.roll_label'}} <i class='fas fa-arrow-circle-right'></i></button>
+        <button name="roll" type="submit">{{localize 'l5r5e.dicepicker.roll_label'}} <i class='fas fa-arrow-circle-right'></i></button>
     </div>
 </form>