Expose various 3D settings in config/theme sheets.

mcglincy · Dec 17, 2021 · 100d58b · 100d58b
1 parent 638ba90
commit 100d58b
Show file tree

Hide file tree

Showing 11 changed files with 196 additions and 16 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,7 @@
+# 0.14.2
+
+- Show various 3D settings on Config and Theme sheets.
+
 # 0.14.1
 
 - Fix "Save to Scene Background" offset and padding bugs.

diff --git a/assets/textures/arena-gate-texture.webp → assets/textures/3d_arena-gate-texture.webp b/assets/textures/arena-gate-texture.webp → assets/textures/3d_arena-gate-texture.webp
diff --git a/lang/en.json b/lang/en.json
@@ -59,6 +59,10 @@
   "DD.ThemeNamePlaceholder": "Enter a theme name",
   "DD.ThemePainterTheme": "Theme to Paint",
   "DD.ThemeSheetTitle": "Theme Config",
+  "DD.ThreeDDoorTexture": "3D Door Texture",
+  "DD.ThreeDDoorTextureTint": "3D Door Texture Tint",
+  "DD.ThreeDWallTexture": "3D Wall Texture",
+  "DD.ThreeDWallTextureTint": "3D Wall Texture Tint",
   "DD.WallColor": "Wall Color",
   "DD.WallTexture": "Wall Texture",
   "DD.WallTextureTint": "Wall Texture Tint",

diff --git a/modules/dungeondraw-bundle.min.js b/modules/dungeondraw-bundle.min.js
diff --git a/modules/dungeondraw-bundle.min.js.map b/modules/dungeondraw-bundle.min.js.map
diff --git a/src/configsheet.js b/src/configsheet.js
@@ -25,7 +25,7 @@ export class ConfigSheet extends FormApplication {
       classes: ["sheet"],
       template: "modules/dungeon-draw/templates/config-sheet.html",
       width: 480,
-      height: 970,
+      height: 1100,
       tabs: [
         { navSelector: ".tabs", contentSelector: "form", initial: "position" },
       ],

diff --git a/src/themes.js b/src/themes.js
@@ -23,6 +23,11 @@ export const defaultConfig = () => {
     secretDoorSColor: "#ffffff",
     secretDoorStyleGM: "secret",
     secretDoorStylePlayer: "wall",
+    threeDDoorTexture:
+      "modules/dungeon-draw/assets/textures/3d_arena-gate-texture.webp",
+    threeDDoorTextureTint: "",
+    threeDWallTexture: "",
+    threeDWallTextureTint: "",
     wallColor: "#000000",
     wallTexture: "",
     wallTextureTint: "",

diff --git a/src/themesheet.js b/src/themesheet.js
@@ -19,7 +19,7 @@ export class ThemeSheet extends FormApplication {
       classes: ["sheet"],
       template: "modules/dungeon-draw/templates/theme-sheet.html",
       width: 480,
-      height: 880,
+      height: 1020,
       tabs: [
         { navSelector: ".tabs", contentSelector: "form", initial: "position" },
       ],

diff --git a/src/wallmaker.js b/src/wallmaker.js
@@ -127,8 +127,16 @@ const wallData = (config, x1, y1, x2, y2) => {
     data.flags["levels-3d-preview"] = {
       joinWall: true,
       wallDepth: config.wallThickness,
-      wallTexture: config.wallTexture,
-      wallTint: config.wallTexture ? config.wallTextureTint : config.wallColor,
+      wallSidesTexture: config.wallTexture,
+      wallSidesTint: config.wallTexture
+        ? config.wallTextureTint
+        : config.wallColor,
+      wallTexture: config.threeDWallTexture ?? config.wallTexture,
+      wallTint: config.threeDWallTexture
+        ? config.threeDWallTextureTint
+        : config.wallTexture
+        ? config.wallTextureTint
+        : config.wallColor,
     };
   }
   return data;
@@ -140,15 +148,8 @@ const doorData = (config, x1, y1, x2, y2) => {
   // Maybe set Canvas3D flags
   if (Settings.threeDCanvasEnabled()) {
     data.flags["levels-3d-preview"]["joinWall"] = false;
-    // top and sides of door look like surrounding walls
-    data.flags["levels-3d-preview"]["wallSidesTexture"] = config.wallTexture;
-    data.flags["levels-3d-preview"]["wallSidesTint"] = config.wallTextureTint;
-    // actual door texture in a 2d door
-    data.flags["levels-3d-preview"]["wallTexture"] =
-      "modules/dungeon-draw/assets/textures/arena-gate-texture.webp";
-    // TODO: what do we want to do with wallTint?
-    // data.flags["levels-3d-preview"]["wallTint"] = config.doorFillColor;
-    delete data.flags["levels-3d-preview"]["wallTint"];
+    data.flags["levels-3d-preview"]["wallTexture"] = config.threeDDoorTexture;
+    data.flags["levels-3d-preview"]["wallTint"] = config.threeDDoorTextureTint;
   }
   return data;
 };

diff --git a/templates/config-sheet.html b/templates/config-sheet.html
@@ -424,6 +424,89 @@
       </div>
     </div>
     <hr />
+    <div class="form-group">
+      <label>{{localize "DD.ThreeDDoorTexture"}}</label>
+      <div class="form-fields">
+        <button
+          type="button"
+          class="file-picker"
+          data-type="imagevideo"
+          data-target="threeDDoorTexture"
+          title="Browse Files"
+          tabindex="-1"
+        >
+          <i class="fas fa-file-import fa-fw"></i>
+        </button>
+        <input
+          class="image"
+          type="text"
+          name="threeDDoorTexture"
+          value="{{config.threeDDoorTexture}}"
+          data-dtype="String"
+          placeholder="File Path"
+        />
+      </div>
+    </div>
+    <div class="form-group">
+      <label>{{localize "DD.ThreeDDoorTextureTint"}}</label>
+      <div class="form-fields">
+        <input
+          type="text"
+          class="color"
+          name="threeDDoorTextureTint"
+          value="{{config.threeDDoorTextureTint}}"
+          data-dtype="String"
+        />
+        <input
+          type="color"
+          value="{{config.threeDDoorTextureTint}}"
+          data-edit="threeDDoorTextureTint"
+          data-dtype="String"
+        />
+      </div>
+    </div>
+    <div class="form-group">
+      <label>{{localize "DD.ThreeDWallTexture"}}</label>
+      <div class="form-fields">
+        <button
+          type="button"
+          class="file-picker"
+          data-type="imagevideo"
+          data-target="threeDWallTexture"
+          title="Browse Files"
+          tabindex="-1"
+        >
+          <i class="fas fa-file-import fa-fw"></i>
+        </button>
+        <input
+          class="image"
+          type="text"
+          name="threeDWallTexture"
+          value="{{config.threeDWallTexture}}"
+          data-dtype="String"
+          placeholder="File Path"
+        />
+      </div>
+    </div>
+    <div class="form-group">
+      <label>{{localize "DD.ThreeDWallTextureTint"}}</label>
+      <div class="form-fields">
+        <input
+          type="text"
+          class="color"
+          name="threeDWallTextureTint"
+          value="{{config.threeDWallTextureTint}}"
+          data-dtype="String"
+        />
+        <input
+          type="color"
+          value="{{config.threeDWallTextureTint}}"
+          data-edit="threeDWallTextureTint"
+          data-dtype="String"
+        />
+      </div>
+    </div>
+    <hr />
     <div style="display: flex">
       <button type="button" name="resetDefault" value="1">
         <i class="fas fa-sync"></i> {{localize "DD.ResetToDefaults"}}

diff --git a/templates/theme-sheet.html b/templates/theme-sheet.html
@@ -370,6 +370,89 @@
         />
       </div>
     </div>
+    <hr />
+    <div class="form-group">
+      <label>{{localize "DD.ThreeDDoorTexture"}}</label>
+      <div class="form-fields">
+        <button
+          type="button"
+          class="file-picker"
+          data-type="imagevideo"
+          data-target="threeDDoorTexture"
+          title="Browse Files"
+          tabindex="-1"
+        >
+          <i class="fas fa-file-import fa-fw"></i>
+        </button>
+        <input
+          class="image"
+          type="text"
+          name="threeDDoorTexture"
+          value="{{config.threeDDoorTexture}}"
+          data-dtype="String"
+          placeholder="File Path"
+        />
+      </div>
+    </div>
+    <div class="form-group">
+      <label>{{localize "DD.ThreeDDoorTextureTint"}}</label>
+      <div class="form-fields">
+        <input
+          type="text"
+          class="color"
+          name="threeDDoorTextureTint"
+          value="{{config.threeDDoorTextureTint}}"
+          data-dtype="String"
+        />
+        <input
+          type="color"
+          value="{{config.threeDDoorTextureTint}}"
+          data-edit="threeDDoorTextureTint"
+          data-dtype="String"
+        />
+      </div>
+    </div>
+    <div class="form-group">
+      <label>{{localize "DD.ThreeDWallTexture"}}</label>
+      <div class="form-fields">
+        <button
+          type="button"
+          class="file-picker"
+          data-type="imagevideo"
+          data-target="threeDWallTexture"
+          title="Browse Files"
+          tabindex="-1"
+        >
+          <i class="fas fa-file-import fa-fw"></i>
+        </button>
+        <input
+          class="image"
+          type="text"
+          name="threeDWallTexture"
+          value="{{config.threeDWallTexture}}"
+          data-dtype="String"
+          placeholder="File Path"
+        />
+      </div>
+    </div>
+    <div class="form-group">
+      <label>{{localize "DD.ThreeDWallTextureTint"}}</label>
+      <div class="form-fields">
+        <input
+          type="text"
+          class="color"
+          name="threeDWallTextureTint"
+          value="{{config.threeDWallTextureTint}}"
+          data-dtype="String"
+        />
+        <input
+          type="color"
+          value="{{config.threeDWallTextureTint}}"
+          data-edit="threeDWallTextureTint"
+          data-dtype="String"
+        />
+      </div>
+    </div>
     <br />
     <div style="display: flex">
       <button type="submit" name="submit" value="1">