Merge pull request #525 from ben/asset-conditions-hint

Asset conditions hint for actor conditions

CHANGELOG.md

@@ -4,6 +4,7 @@
 
 - Update the asset pop-out sheet to present half-edit (which more closely matches the cards) and full-edit experiences ([#524](https://github.com/ben/foundry-ironsworn/pull/524))
 - Add conditions to assets (also [#524](https://github.com/ben/foundry-ironsworn/pull/524))
+- Include asset conditions in the PC-condition tooltips ([#525](https://github.com/ben/foundry-ironsworn/pull/525))
 
 ## 1.18.12
 

src/module/helpers/globalConditions.ts

@@ -1,5 +1,6 @@
 import { IronswornActor } from '../actor/actor'
 import { IronswornItem } from '../item/item'
+import { AssetDataProperties } from '../item/itemtypes'
 
 interface ActorsAndAssets {
   actors: IronswornActor[]
@@ -18,7 +19,14 @@ export function actorsOrAssetsWithConditionEnabled(
     }
 
     for (const item of actor.items.filter((x) => x.type === 'asset')) {
-      // TODO: check asset conditions when they start to exist
+      const assetData = item.data as AssetDataProperties
+      if (
+        assetData.data.conditions.find(
+          (c) => c.name.toLowerCase() === condition.toLowerCase() && c.ticked
+        )
+      ) {
+        ret.assets.push(item)
+      }
     }
   }
 

src/module/vue/components/asset/asset-conditions.vue

@@ -0,0 +1,62 @@
+<template>
+  <div :class="$style.assetconditions" v-if="asset.data.conditions?.length > 0">
+    <label
+      v-for="(condition, i) in asset.data.conditions"
+      :key="condition.name"
+      :class="$style.condition"
+    >
+      <input
+        type="checkbox"
+        :checked="condition.ticked"
+        @change="toggleCondition(i)"
+      />
+      {{ condition.name }}
+    </label>
+  </div>
+</template>
+
+<style lang="less" module>
+.assetconditions {
+  display: flex;
+  flex-grow: 0;
+  flex-direction: column;
+  justify-content: space-around;
+  margin: 5px;
+  height: 100%;
+}
+.condition {
+  font-size: x-small;
+  white-space: nowrap;
+  line-height: 12px;
+  flex-basis: 12px;
+  margin: 1px 0;
+
+  input[type='checkbox'] {
+    width: 12px;
+    height: 12px;
+    flex: 0 0 12px;
+    margin: 0 3px;
+    vertical-align: bottom;
+  }
+}
+</style>
+
+<script lang="ts" setup>
+import { inject } from 'vue'
+import { $ItemKey } from '../../provisions'
+
+const props = defineProps<{ asset: any }>()
+
+const $item = inject($ItemKey)
+
+async function toggleCondition(idx: number) {
+  const { conditions } = props.asset.data
+  conditions[idx].ticked = !conditions[idx].ticked
+  await $item?.update({ data: { conditions } })
+
+  CONFIG.IRONSWORN.emitter.emit('globalConditionChanged', {
+    name: conditions[idx].name.toLowerCase(),
+    enabled: conditions[idx].ticked,
+  })
+}
+</script>

src/module/vue/components/asset/asset-overview.vue

@@ -99,52 +99,12 @@
         />
 
         <!-- CONDITIONS -->
-        <div class="asset-conditions" v-if="item.data.conditions?.length > 0">
-          <label
-            v-for="(condition, i) in item.data.conditions"
-            :key="condition.name"
-            class="condition"
-          >
-            <input
-              type="checkbox"
-              :checked="condition.ticked"
-              @change="toggleCondition(i)"
-            />
-            {{ condition.name }}
-          </label>
-        </div>
+        <AssetConditions :asset="item" />
       </div>
     </section>
   </article>
 </template>
 
-<style lang="less">
-.asset-conditions {
-  display: flex;
-  flex-grow: 0;
-  flex-direction: column;
-  justify-content: space-around;
-  margin: 5px;
-  height: 100%;
-
-  .condition {
-    font-size: x-small;
-    white-space: nowrap;
-    line-height: 12px;
-    flex-basis: 12px;
-    margin: 1px 0;
-
-    input[type='checkbox'] {
-      width: 12px;
-      height: 12px;
-      flex: 0 0 12px;
-      margin: 0 3px;
-      vertical-align: bottom;
-    }
-  }
-}
-</style>
-
 <style lang="less" module>
 .ironsworn__asset {
   margin: 10px 0;
@@ -165,6 +125,7 @@ import WithRollListeners from '../with-rolllisteners.vue'
 import Clock from '../clock.vue'
 import ConditionMeterSlider from '../resource-meter/condition-meter.vue'
 import AssetExclusiveoption from './asset-exclusiveoption.vue'
+import AssetConditions from './asset-conditions.vue'
 
 const $item = inject($ItemKey)
 const item = inject(ItemKey) as ComputedRef

src/module/vue/components/asset/asset.vue

@@ -93,23 +93,7 @@
             labelPosition="left"
             :read-only="false"
           />
-          <div
-            class="asset-conditions"
-            v-if="asset.data.conditions?.length > 0"
-          >
-            <label
-              v-for="(condition, i) in asset.data.conditions"
-              :key="condition.name"
-              class="condition"
-            >
-              <input
-                type="checkbox"
-                :checked="condition.ticked"
-                @change="toggleCondition(i)"
-              />
-              {{ condition.name }}
-            </label>
-          </div>
+          <AssetConditions :asset="asset" />
         </div>
 
         <section
@@ -322,6 +306,7 @@ import { $ActorKey, $ItemKey, ActorKey } from '../../provisions'
 import { defaultActor } from '../../../helpers/actors'
 import CollapseTransition from '../transition/collapse-transition.vue'
 import ConditionMeterSlider from '../resource-meter/condition-meter.vue'
+import AssetConditions from './asset-conditions.vue'
 
 const props = defineProps<{ asset: any }>()
 const actor = inject(ActorKey) as Ref

src/module/vue/components/conditions/condition-checkbox.vue

@@ -23,6 +23,7 @@
 import { capitalize, inject, nextTick, reactive, Ref } from 'vue'
 import { actorsOrAssetsWithConditionEnabled } from '../../../helpers/globalConditions'
 import { IronswornSettings } from '../../../helpers/settings'
+import { AssetDataProperties } from '../../../item/itemtypes'
 import { $ActorKey, ActorKey } from '../../provisions'
 
 const actor = inject(ActorKey) as Ref
@@ -75,7 +76,7 @@ async function input(ev: Event) {
 
 // We can't watch this directly, we just have to trust that a broadcast will happen
 // when it changes
-CONFIG.IRONSWORN.emitter.on('globalConditionChanged', ({ name, enabled }) => {
+CONFIG.IRONSWORN.emitter.on('globalConditionChanged', ({ name }) => {
   if (name === props.name) {
     refreshGlobalHint()
   }
@@ -84,9 +85,20 @@ CONFIG.IRONSWORN.emitter.on('globalConditionChanged', ({ name, enabled }) => {
 const i18nCondition = game.i18n.localize(`IRONSWORN.${capitalize(props.name)}`)
 function refreshGlobalHint() {
   const { actors, assets } = actorsOrAssetsWithConditionEnabled(props.name)
+  console.log({ actors, assets })
   const names = [
     ...actors.map((x) => x.name),
-    ...assets.map((x) => x.name), // TODO: get name field if it exists
+    ...assets.map((x) => {
+      const assetData = x.data as AssetDataProperties
+      const nameField = assetData.data.fields.find((x) => {
+        const downcase = x.name.toLowerCase()
+        if (downcase === game.i18n.localize('IRONSWORN.Name').toLowerCase())
+          return true
+        if (downcase === 'name') return true
+        return false
+      })
+      return nameField?.value || x.name
+    }),
   ].filter((x) => x !== actor.value.name)
 
   if (names.length == 0) {