Added conditions to action resources

app/imports/api/engine/computation/buildComputation/linkTypeDependencies.js

@@ -80,6 +80,15 @@ function linkAction(dependencyGraph, prop, { propsById }) {
       key: `resources.attributesConsumed[${index}].quantity`,
     });
   });
+  // Link conditions
+  prop.resources.conditions?.forEach((con, index) => {
+    // Link the property to its condition calculation
+    dependOnCalc({
+      dependencyGraph,
+      prop,
+      key: `resources.conditions[${index}].condition`,
+    });
+  });
 }
 
 function linkAdjustment(dependencyGraph, prop) {

app/imports/api/engine/computation/computeComputation/computeByType/computeAction.js

@@ -8,13 +8,20 @@ export default function computeAction(computation, node) {
   }
   computeResources(computation, node);
   if (!prop.resources) return;
-  prop.resources.itemsConsumed.forEach(itemConsumed => {
+  prop.resources.conditions?.forEach(conObj => {
+    const condition = conObj.condition;
+    if (!condition) return;
+    if (condition.calculation && !condition.value) {
+      prop.insufficientResources = true;
+    }
+  });
+  prop.resources.itemsConsumed?.forEach(itemConsumed => {
     if (!itemConsumed.itemId) return;
     if (itemConsumed.available < itemConsumed.quantity?.value) {
       prop.insufficientResources = true;
     }
   });
-  prop.resources.attributesConsumed.forEach(attConsumed => {
+  prop.resources.attributesConsumed?.forEach(attConsumed => {
     if (!attConsumed.variableName) return;
     if (!(attConsumed.available >= attConsumed.quantity?.value)) {
       prop.insufficientResources = true;

app/imports/api/properties/Actions.js

@@ -77,6 +77,7 @@ let ActionSchema = createPropertySchema({
   'resources.itemsConsumed': {
     type: Array,
     defaultValue: [],
+    max: 32,
   },
   'resources.itemsConsumed.$': {
     type: Object,
@@ -104,6 +105,7 @@ let ActionSchema = createPropertySchema({
   'resources.attributesConsumed': {
     type: Array,
     defaultValue: [],
+    max: 32,
   },
   'resources.attributesConsumed.$': {
     type: Object,
@@ -124,6 +126,30 @@ let ActionSchema = createPropertySchema({
     type: 'fieldToCompute',
     optional: true,
   },
+  'resources.conditions': {
+    type: Array,
+    defaultValue: [],
+    max: 32,
+  },
+  'resources.conditions.$': {
+    type: Object,
+  },
+  'resources.conditions.$._id': {
+    type: String,
+    regEx: SimpleSchema.RegEx.Id,
+    autoValue() {
+      if (!this.isSet) return Random.id();
+    }
+  },
+  'resources.conditions.$.condition': {
+    type: 'fieldToCompute',
+    optional: true,
+  },
+  'resources.conditions.$.conditionNote': {
+    type: String,
+    optional: true,
+    max: STORAGE_LIMITS.calculation,
+  },
   // Prevent the property from showing up in the log
   silent: {
     type: Boolean,

app/imports/client/ui/properties/components/actions/ActionCard.vue

@@ -63,9 +63,14 @@
     </div>
     <div class="px-3 pb-3">
       <template
-        v-if="model.resources && model.resources.attributesConsumed.length ||
+        v-if="showResources"
-          model.resources.itemsConsumed.length"
       >
+        <action-condition-view
+          v-for="condition in model.resources.conditions"
+          :key="condition._id"
+          class="action-child"
+          :model="condition"
+        />
         <attribute-consumed-view
           v-for="attributeConsumed in model.resources.attributesConsumed"
           :key="attributeConsumed._id"
@@ -103,6 +108,7 @@
 import { getPropertyName } from '/imports/constants/PROPERTIES.js';
 import numberToSignedString from '../../../../../api/utility/numberToSignedString.js';
 import doAction from '/imports/api/engine/actions/doAction.js';
+import ActionConditionView from '/imports/client/ui/properties/components/actions/ActionConditionView.vue';
 import AttributeConsumedView from '/imports/client/ui/properties/components/actions/AttributeConsumedView.vue';
 import ItemConsumedView from '/imports/client/ui/properties/components/actions/ItemConsumedView.vue';
 import PropertyIcon from '/imports/client/ui/properties/shared/PropertyIcon.vue';
@@ -117,6 +123,7 @@ import { some } from 'lodash';
 
 export default {
   components: {
+    ActionConditionView,
     AttributeConsumedView,
     ItemConsumedView,
     MarkdownText,
@@ -149,6 +156,11 @@ export default {
     }
   },
   computed: {
+    showResources() {
+      if (this.model.resources?.attributesConsumed?.length
+        || this.model.resources?.itemsConsumed?.length) return true;
+      return some(this.model.resources?.conditions, con => con.condition && !con.condition.value);
+    },
     rollBonus() {
       if (!this.model.attackRoll) return;
       return numberToSignedString(this.model.attackRoll.value);

app/imports/client/ui/properties/components/actions/ActionConditionView.vue

@@ -0,0 +1,29 @@
+<template lang="html">
+  <div
+    v-if="insufficient"
+    class="layout align-center justify-start error--text"
+  >
+    <div
+      class="mr-2 text-no-wrap text-truncate"
+      style="min-width: 24px; text-align: center;"
+    >
+      {{ model.conditionNote || (model.condition && model.condition.calculation) || 'No condition specified' }}
+    </div>
+  </div>
+</template>
+
+<script lang="js">
+export default {
+  props: {
+    model: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  computed: {
+    insufficient(){
+      return !this.model.condition?.value;
+    },
+  },
+}
+</script>

app/imports/client/ui/properties/components/actions/AttributeConsumedView.vue

@@ -10,7 +10,7 @@
       {{ model.quantity && model.quantity.value }}
     </div>
     <div
-      v-if="(typeof model.quantity.value !== 'string')"
+      v-if="model.quantity && (typeof model.quantity.value !== 'string')"
       class="text-no-wrap text-truncate"
     >
       {{ model.statName || model.variableName }}

app/imports/client/ui/properties/forms/ActionConditionForm.vue

@@ -0,0 +1,36 @@
+<template lang="html">
+  <v-row dense>
+    <v-col
+      cols="12"
+      md="6"
+    >
+      <computed-field
+        label="Condition"
+        hint="This must be true for the action to be taken"
+        :model="model.condition"
+        :error-messages="errors.condition"
+        @change="({path, value, ack}) =>
+          $emit('change', {path: ['condition', ...path], value, ack})"
+      />
+    </v-col>
+    <v-col
+      cols="12"
+      md="6"
+    >
+      <text-field
+        label="Condition error text"
+        :value="model.conditionNote"
+        :error-messages="errors.conditionNote"
+        @change="(value, ack) => $emit('change', {path: ['conditionNote'], value, ack})"
+      />
+    </v-col>
+  </v-row>
+</template>
+
+<script lang="js">
+import propertyFormMixin from '/imports/client/ui/properties/forms/shared/propertyFormMixin.js';
+
+export default {
+  mixins: [propertyFormMixin],
+}
+</script>

app/imports/client/ui/properties/forms/ActionConditionsListForm.vue

@@ -0,0 +1,41 @@
+<template lang="html">
+  <div class="mt-4">
+    <v-slide-x-transition group>
+      <div
+        v-for="(condition, i) in model"
+        :key="condition._id || i"
+      >
+        <div class="layout align-center">
+          <div style="flex-grow: 1;">
+            <action-condition-form
+              :model="condition"
+              @change="({path, value, ack}) => change([i, ...path], value, ack)"
+            />
+          </div>
+          <v-btn
+            outlined
+            icon
+            large
+            class="ma-3"
+            style="margin-bottom: 30px !important;"
+            @click="$emit('pull', {path: [i]})"
+          >
+            <v-icon>mdi-delete</v-icon>
+          </v-btn>
+        </div>
+      </div>
+    </v-slide-x-transition>
+  </div>
+</template>
+
+<script lang="js">
+import ActionConditionForm from '/imports/client/ui/properties/forms/ActionConditionForm.vue';
+import propertyFormMixin from '/imports/client/ui/properties/forms/shared/propertyFormMixin.js';
+
+export default {
+  components: {
+    ActionConditionForm,
+  },
+  mixins: [propertyFormMixin],
+}
+</script>

app/imports/client/ui/properties/forms/ResourcesForm.vue

@@ -1,5 +1,17 @@
 <template lang="html">
   <div class="resources-form">
+    <div
+      v-if="model.conditions && model.conditions.length"
+      class="subheading"
+    >
+      Conditions
+    </div>
+    <action-conditions-list-form
+      :model="model.conditions"
+      @change="({path, value, ack}) => $emit('change', {path: ['conditions', ...path], value, ack})"
+      @push="({path, value, ack}) => $emit('push', {path: ['conditions', ...path], value, ack})"
+      @pull="({path, ack}) => $emit('pull', {path: ['conditions', ...path], ack})"
+    />
     <div
       v-if="model.attributesConsumed && model.attributesConsumed.length"
       class="subheading"
@@ -43,6 +55,9 @@
         </v-btn>
       </template>
       <v-list>
+        <v-list-item @click="addCondition">
+          <v-list-item-title>Add Condition</v-list-item-title>
+        </v-list-item>
         <v-list-item @click="addAttributesConsumed">
           <v-list-item-title>Add Resource</v-list-item-title>
         </v-list-item>
@@ -56,11 +71,13 @@
 
 <script lang="js">
 import AttributesConsumedListForm from '/imports/client/ui/properties/forms/AttributesConsumedListForm.vue';
+import ActionConditionsListForm from '/imports/client/ui/properties/forms/ActionConditionsListForm.vue';
 import ItemsConsumedListForm from '/imports/client/ui/properties/forms/ItemsConsumedListForm.vue';
 import propertyFormMixin from '/imports/client/ui/properties/forms/shared/propertyFormMixin.js';
 
 export default {
   components: {
+    ActionConditionsListForm,
     AttributesConsumedListForm,
     ItemsConsumedListForm,
   },
@@ -102,6 +119,14 @@ export default {
         ack: this.acknowledgeAddResult,
       });
     },
+    addCondition() {
+      this.addResourceLoading = true;
+      this.$emit('push', {
+        path: ['conditions'],
+        value: { _id: Random.id() },
+        ack: this.acknowledgeAddResult,
+      });
+    },
   },
 }
 </script>

app/imports/client/ui/properties/viewers/ActionViewer.vue

@@ -64,6 +64,19 @@
         name="Reset"
         :value="reset"
       />
+      <property-field
+        v-if="model.resources.conditions.length"
+        name="Conditions"
+      >
+        <div style="width: 100%;">
+          <action-condition-view
+            v-for="condition in model.resources.conditions"
+            :key="condition._id"
+            class="action-child"
+            :model="condition"
+          />
+        </div>
+      </property-field>
       <property-field
         v-if="model.resources.attributesConsumed.length"
         name="Attributes consumed"
@@ -107,6 +120,7 @@
 <script lang="js">
 import propertyViewerMixin from '/imports/client/ui/properties/viewers/shared/propertyViewerMixin.js';
 import doAction from '/imports/api/engine/actions/doAction.js';
+import ActionConditionView from '/imports/client/ui/properties/components/actions/ActionConditionView.vue';
 import AttributeConsumedView from '/imports/client/ui/properties/components/actions/AttributeConsumedView.vue';
 import ItemConsumedView from '/imports/client/ui/properties/components/actions/ItemConsumedView.vue';
 import PropertyIcon from '/imports/client/ui/properties/shared/PropertyIcon.vue';
@@ -116,6 +130,7 @@ import { snackbar } from '/imports/client/ui/components/snackbars/SnackbarQueue.
 
 export default {
   components: {
+    ActionConditionView,
     AttributeConsumedView,
     ItemConsumedView,
     PropertyIcon,