From acbcb6c9b297d50e721f4f626af374a2746c4fae Mon Sep 17 00:00:00 2001
From: Oliver-Akins <Oliver.akins1999@gmail.com>
Date: Sun, 24 Mar 2024 16:54:50 -0600
Subject: [PATCH] Genericizing some of the styling and adding the Aspect item
 details (closes #128)

---
 module/handlebars.mjs                         |  1 +
 .../actor/char-sheet/v2/pages/inventory.scss  | 37 +++----
 .../partials/inventory/items/aspect.v2.pc.hbs | 99 +++++++++++++++++++
 .../inventory/items/untyped.v2.pc.hbs         |  6 +-
 4 files changed, 117 insertions(+), 26 deletions(-)
 create mode 100644 templates/actors/char-sheet/v2/partials/inventory/items/aspect.v2.pc.hbs

diff --git a/module/handlebars.mjs b/module/handlebars.mjs
index d2ccd2a..ad671fe 100644
--- a/module/handlebars.mjs
+++ b/module/handlebars.mjs
@@ -28,6 +28,7 @@ export const partials = [
 	`actors/char-sheet/v2/partials/inventory/storage.v2.pc.hbs`,
 	`actors/char-sheet/v2/partials/inventory/items/material.v2.pc.hbs`,
 	`actors/char-sheet/v2/partials/inventory/items/untyped.v2.pc.hbs`,
+	`actors/char-sheet/v2/partials/inventory/items/aspect.v2.pc.hbs`,
 ];
 
 export const preAliasedPartials = {
diff --git a/styles/sheets/actor/char-sheet/v2/pages/inventory.scss b/styles/sheets/actor/char-sheet/v2/pages/inventory.scss
index ae65e1b..7e4ac16 100644
--- a/styles/sheets/actor/char-sheet/v2/pages/inventory.scss
+++ b/styles/sheets/actor/char-sheet/v2/pages/inventory.scss
@@ -53,7 +53,7 @@
 				gap: 8px;
 			}
 
-			&--untyped {
+			&--untyped, &--aspect {
 				display: flex;
 				gap: 8px;
 				flex-direction: column;
@@ -186,7 +186,7 @@
 		}
 	}
 
-	.untyped {
+	.untyped, .aspect {
 		@include material.elevate(1);
 		padding: 8px;
 		border-radius: 4px;
@@ -252,7 +252,7 @@
 			}
 		}
 
-		&__usage, &__tier {
+		&__field {
 			@include material.elevate(1);
 			color: var(--inventory-untyped-card-color);
 			padding: 8px;
@@ -260,17 +260,6 @@
 			align-items: center;
 			justify-content: space-between;
 			border-radius: 4px;
-		}
-
-		&__quantity--edit {
-			@include material.elevate(1);
-			display: flex;
-			flex-direction: row;
-			align-items: center;
-			justify-content: space-between;
-			padding: 0px 8px;
-			gap: 4px;
-			border-radius: 4px;
 
 			> :first-child {
 				text-overflow: ellipsis;
@@ -278,15 +267,17 @@
 				white-space: nowrap;
 			}
 
-			input {
-				@include material.elevate(2);
-				font-family: var(--input-font);
-				font-size: var(--inventory-untyped-quantity-font-size);
-				width: 50px;
-				text-align: center;
-				border-radius: 4px;
-				padding: 5px 7px;
-				color: inherit;
+			&.editable {
+				input[type="text"], input[type="number"] {
+					@include material.elevate(1);
+					font-family: var(--input-font);
+					font-size: var(--inventory-untyped-quantity-font-size);
+					width: 50px;
+					text-align: center;
+					border-radius: 4px;
+					padding: 5px 7px;
+					color: inherit;
+				}
 			}
 		}
 
diff --git a/templates/actors/char-sheet/v2/partials/inventory/items/aspect.v2.pc.hbs b/templates/actors/char-sheet/v2/partials/inventory/items/aspect.v2.pc.hbs
new file mode 100644
index 0000000..210e31b
--- /dev/null
+++ b/templates/actors/char-sheet/v2/partials/inventory/items/aspect.v2.pc.hbs
@@ -0,0 +1,99 @@
+<section class="aspect">
+	<div
+		class="aspect__header"
+		data-collapse-id="{{item.uuid}}"
+	>
+		<button
+			type="button"
+			class="equal-padding reduced-padding"
+			data-collapse-id="{{item.uuid}}"
+			tabindex="0"
+			aria-label="{{dd-i18n 'dotdungeon.sheet.actor.v2.toggle-item-information' item}}"
+		>
+			<div aria-hidden="true" class="icon icon--12">
+				{{#if (dd-set-has meta.expanded item.uuid)}}
+					{{{ icons.caret-down }}}
+				{{else}}
+					{{{ icons.caret-right }}}
+				{{/if}}
+			</div>
+		</button>
+		<h3 class="aspect__name">
+			{{item.name}}
+		</h3>
+	</div>
+	{{#if (dd-set-has meta.expanded item.uuid)}}
+		<hr>
+		<div class="aspect__content">
+			<div class="aspect__field editable">
+				<label for="{{meta.idp}}-{{item.uuid}}-used">
+					Used
+				</label>
+				<input
+					type="checkbox"
+					{{checked item.system.used}}
+					id="{{meta.idp}}-{{item.uuid}}-used"
+					value="{{item.system.used}}"
+					data-embedded-id="{{item.uuid}}"
+					data-embedded-update="system.used"
+					data-embedded-update-on="change"
+				>
+			</div>
+			<div class="aspect__field">
+				<span>Duration:</span>
+				<span>
+					{{dd-empty-state item.friendlyDuration}}
+				</span>
+			</div>
+			<div class="aspect__field">
+				<span>Tier:</span>
+				<span>{{dd-i18n (concat "dotdungeon.rarity." item.system.tier)}}</span>
+			</div>
+			<button
+				type="button"
+				aria-label="{{dd-i18n 'dotdungeon.common.send-to-chat'}}"
+				data-tooltip="{{dd-i18n 'dotdungeon.common.send-to-chat'}}"
+				data-tooltip-direction="RIGHT"
+				class="aspect__button--send-to-chat"
+			>
+				<div aria-hidden="true" class="icon icon--20">
+					{{{ icons.chat-bubble }}}
+				</div>
+			</button>
+			<p class="aspect__description">
+				{{#if item.system.description}}
+					{{item.system.description}}
+				{{else}}
+					<span class="placeholder">
+						This item hasn't been described yet...
+					</span>
+				{{/if}}
+			</p>
+			<button
+				type="button"
+				aria-label="{{dd-i18n 'dotdungeon.common.edit'}}"
+				data-tooltip="{{dd-i18n 'dotdungeon.common.edit'}}"
+				data-tooltip-direction="RIGHT"
+				class="aspect__button--edit"
+				data-embedded-edit="{{item.uuid}}"
+			>
+				<div aria-hidden="true" class="icon icon--20">
+					{{{ icons.edit }}}
+				</div>
+			</button>
+			<button
+				type="button"
+				aria-label="{{dd-i18n 'dotdungeon.common.delete'}}"
+				data-tooltip="{{dd-i18n 'dotdungeon.common.delete'}}"
+				data-tooltip-direction="RIGHT"
+				class="aspect__button--delete"
+				data-embedded-delete
+				data-embedded-id="{{item.uuid}}"
+			>
+				<div aria-hidden="true" class="icon icon--20">
+					{{{ icons.garbage-bin }}}
+				</div>
+			</button>
+		</div>
+	{{/if}}
+</section>
diff --git a/templates/actors/char-sheet/v2/partials/inventory/items/untyped.v2.pc.hbs b/templates/actors/char-sheet/v2/partials/inventory/items/untyped.v2.pc.hbs
index 25712e5..4a62455 100644
--- a/templates/actors/char-sheet/v2/partials/inventory/items/untyped.v2.pc.hbs
+++ b/templates/actors/char-sheet/v2/partials/inventory/items/untyped.v2.pc.hbs
@@ -28,7 +28,7 @@
 	{{#if (dd-set-has meta.expanded item.uuid)}}
 		<hr>
 		<div class="untyped__content">
-			<div class="untyped__quantity--edit">
+			<div class="untyped__field editable">
 				<label for="{{meta.idp}}-{{item.uuid}}-quantity">
 					Quantity
 				</label>
@@ -42,13 +42,13 @@
 					data-embedded-update-on="blur"
 				>
 			</div>
-			<div class="untyped__usage">
+			<div class="untyped__field">
 				<span>Usage Cost:</span>
 				<span>
 					{{dd-empty-state item.system.usage}}
 				</span>
 			</div>
-			<div class="untyped__tier">
+			<div class="untyped__field">
 				<span>Tier:</span>
 				<span>{{dd-i18n (concat "dotdungeon.rarity." item.system.tier)}}</span>
 			</div>