Add inline effect icons for status effects (#214)

module/documents/items/spell/spell-data-model.mjs

@@ -127,10 +127,6 @@ export class SpellDataModel extends foundry.abstract.TypeDataModel {
 			impdamage: new EmbeddedDataField(ImprovisedDamageDataModel, {}),
 			isBehavior: new SchemaField({ value: new BooleanField() }),
 			weight: new SchemaField({ value: new NumberField({ initial: 1, min: 1, integer: true, nullable: false }) }),
-			// Replaced by cost, targeting
-			//mpCost: new SchemaField({ value: new StringField() }),
-			//maxTargets: new SchemaField({ value: new NumberField({ initial: 0, integer: true, nullable: false }) }),
-			//target: new SchemaField({ value: new StringField() }),
 			duration: new SchemaField({ value: new StringField() }),
 			isOffensive: new SchemaField({ value: new BooleanField() }),
 			opportunity: new StringField(),

module/helpers/inline-effects.mjs

@@ -29,8 +29,9 @@ function createEffectAnchor(effect) {
 	anchor.draggable = true;
 	anchor.dataset.effect = InlineHelper.toBase64(effect);
 	anchor.classList.add('inline', INLINE_EFFECT_CLASS, 'disable-how-to');
+	anchor.setAttribute('data-tooltip', `${game.i18n.localize('FU.ChatApplySelected')} (${effect.name})`);
 	const icon = document.createElement('i');
-	icon.classList.add('fun', 'fu-aura');
+	icon.classList.add('fue', 'fu-effect-placeholder');
 	anchor.append(icon);
 	anchor.append(effect.name);
 	return anchor;
@@ -51,10 +52,13 @@ function createStatusAnchor(effectValue, status) {
 	anchor.draggable = true;
 	anchor.dataset.status = effectValue;
 	anchor.classList.add('inline', INLINE_EFFECT_CLASS, 'disable-how-to');
+	const localizedName = game.i18n.localize(status.name);
+	anchor.setAttribute('data-tooltip', `${game.i18n.localize('FU.ChatApplySelected')} (${localizedName})`);
 	const icon = document.createElement('i');
-	icon.classList.add('fun', 'fu-aura');
+	const statusClass = `fu-${effectValue}`;
+	icon.classList.add('fue', statusClass);
 	anchor.append(icon);
-	anchor.append(game.i18n.localize(status.name));
+	anchor.append(localizedName);
 	return anchor;
 }
 

styles/scss/utils/_icons.scss

@@ -10,6 +10,104 @@ $ful-offensive: url('/systems/projectfu/styles/static/icons/ful-offensive.svg');
 $ful-martial: url('/systems/projectfu/styles/static/icons/ful-martial.svg');
 $fu-zenit: url('/systems/projectfu/styles/static/compendium/ui/coins_5.png');
 
+$fu-shaken: url('/systems/projectfu/styles/static/statuses/Shaken.webp');
+$fu-dazed: url('/systems/projectfu/styles/static/statuses/Dazed.webp');
+$fu-slow: url('/systems/projectfu/styles/static/statuses/Slow.webp');
+$fu-weak: url('/systems/projectfu/styles/static/statuses/Weak.webp');
+$fu-enraged: url('/systems/projectfu/styles/static/statuses/Enraged.webp');
+$fu-poisoned: url('/systems/projectfu/styles/static/statuses/Poisoned.webp');
+
+$fu-flying: url('/systems/projectfu/styles/static/statuses/Flying.webp');
+$fu-guard: url('/systems/projectfu/styles/static/statuses/Guard.webp');
+$fu-cover: url('/systems/projectfu/styles/static/statuses/Cover.webp');
+$fu-aura: url('/systems/projectfu/styles/static/statuses/Aura.webp');
+$fu-barrier: url('/systems/projectfu/styles/static/statuses/Barrier.webp');
+
+$fu-ins-up: url('/systems/projectfu/styles/static/statuses/InsUp.webp');
+$fu-ins-down: url('/systems/projectfu/styles/static/statuses/InsDown.webp');
+$fu-dex-up: url('/systems/projectfu/styles/static/statuses/DexUp.webp');
+$fu-dex-down: url('/systems/projectfu/styles/static/statuses/DexDown.webp');
+$fu-mig-up: url('/systems/projectfu/styles/static/statuses/MigUp.webp');
+$fu-mig-down: url('/systems/projectfu/styles/static/statuses/MigDown.webp');
+$fu-wlp-up: url('/systems/projectfu/styles/static/statuses/WlpUp.webp');
+$fu-wlp-down: url('/systems/projectfu/styles/static/statuses/WlpDown.webp');
+
+.fu-shaken {
+	background-image: $fu-shaken;
+}
+
+.fu-dazed {
+	background-image: $fu-dazed;
+}
+
+.fu-weak {
+	background-image: $fu-weak;
+}
+
+.fu-slow {
+	background-image: $fu-slow;
+}
+
+.fu-enraged {
+	background-image: $fu-enraged;
+}
+
+.fu-poisoned {
+	background-image: $fu-poisoned;
+}
+
+.fu-guard {
+	background-image: $fu-guard;
+}
+
+.fu-flying {
+	background-image: $fu-flying;
+}
+
+.fu-cover {
+	background-image: $fu-cover;
+}
+
+.fu-aura {
+	background-image: $fu-aura;
+}
+
+.fu-barrier {
+	background-image: $fu-barrier;
+}
+
+.fu-wlp-up {
+	background-image: $fu-wlp-up;
+}
+
+.fu-wlp-down {
+	background-image: $fu-wlp-down;
+}
+
+.fu-dex-up {
+	background-image: $fu-dex-up;
+}
+
+.fu-dex-down {
+	background-image: $fu-dex-down;
+}
+
+.fu-mig-up {
+	background-image: $fu-mig-up;
+}
+
+.fu-mig-down {
+	background-image: $fu-mig-down;
+}
+
+.fu-ins-up {
+	background-image: $fu-ins-up;
+}
+
+.fu-ins-down {
+	background-image: $fu-ins-down;
+}
+
 .fu-zenit {
 	background-image: $fu-zenit;
 }
@@ -30,7 +128,7 @@ $fu-zenit: url('/systems/projectfu/styles/static/compendium/ui/coins_5.png');
 	background-image: $ful-martial;
 }
 
-.fu-aura {
+.fu-effect-placeholder {
 	background-image: url('/icons/svg/aura.svg');
 }
 
@@ -82,6 +180,15 @@ $fu-zenit: url('/systems/projectfu/styles/static/compendium/ui/coins_5.png');
 	display: inline-block;
 }
 
+/* Webp Icons */
+.fue {
+	width: 20px;
+	height: 20px;
+	margin-right: 4px;
+	background-size: cover;
+	display: inline-block;
+}
+
 .ful-sl-star {
 	background-image: $ful-sl-star;
 }