thepaperpilot/chromatic-lattice
1
0
Fork 0
Code Issues Pull requests Releases Activity Actions

Make challenges display requirements

Browse source
This commit is contained in:
thepaperpilot 2023-04-03 08:19:58 -05:00
parent 61bc53f954
commit 44a5b336d6
3 changed files with 14 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/features/challenges/Challenge.vue
View file

@ -38,6 +38,7 @@ import type { GenericChallenge } from "features/challenges/challenge";
import type { StyleValue } from "features/feature";
import { isHidden, isVisible, jsx, Visibility } from "features/feature";
import { getHighNotifyStyle, getNotifyStyle } from "game/notifications";
import { displayRequirements, Requirements } from "game/requirements";
import { coerceComponent, isCoercableComponent, processedPropType, unwrapRef } from "util/vue";
import type { Component, PropType, UnwrapRef } from "vue";
import { computed, defineComponent, shallowRef, toRefs, unref, watchEffect } from "vue";
@ -61,6 +62,7 @@ export default defineComponent({
Object,
Function
),
requirements: processedPropType<Requirements>(Object, Array),
visibility: {
type: processedPropType<Visibility | boolean>(Number, Boolean),
required: true
@ -90,7 +92,7 @@ export default defineComponent({
Node
},
setup(props) {
const { active, maxed, canComplete, display } = toRefs(props);
const { active, maxed, canComplete, display, requirements } = toRefs(props);
const buttonText = computed(() => {
if (active.value) {
@ -128,7 +130,7 @@ export default defineComponent({
}
const Title = coerceComponent(currDisplay.title || "", "h3");
const Description = coerceComponent(currDisplay.description, "div");
const Goal = coerceComponent(currDisplay.goal || "");
const Goal = coerceComponent(currDisplay.goal != null ? currDisplay.goal : jsx(() => displayRequirements(unwrapRef(requirements) ?? [])), "h3");
const Reward = coerceComponent(currDisplay.reward || "");
const EffectDisplay = coerceComponent(currDisplay.effectDisplay || "");
comp.value = coerceComponent(
@ -140,12 +142,10 @@ export default defineComponent({
</div>
) : null}
<Description />
{currDisplay.goal != null ? (
<div>
<br />
Goal: <Goal />
</div>
) : null}
{currDisplay.reward != null ? (
<div>
<br />

8
src/features/challenges/challenge.tsx
View file

@ -69,7 +69,7 @@ export interface ChallengeOptions {
title?: CoercableComponent;
/** The main text that appears in the display. */
description: CoercableComponent;
/** A description of the current goal for this challenge. */
/** A description of the current goal for this challenge. If unspecified then the requirements will be displayed automatically based on {@link requirements}. */
goal?: CoercableComponent;
/** A description of what will change upon completing this challenge. */
reward?: CoercableComponent;
@ -271,7 +271,8 @@ export function createChallenge<T extends ChallengeOptions>(
canStart,
mark,
id,
toggle
toggle,
requirements
} = this;
return {
active,
@ -285,7 +286,8 @@ export function createChallenge<T extends ChallengeOptions>(
canStart,
mark,
id,
toggle
toggle,
requirements
};
};

2
src/features/repeatable.tsx
View file

@ -42,7 +42,7 @@ export type RepeatableDisplay =
title?: CoercableComponent;
/** The main text that appears in the display. */
description?: CoercableComponent;
/** A description of the current effect of this repeatable, bsed off its amount. */
/** A description of the current effect of this repeatable, based off its amount. */
effectDisplay?: CoercableComponent;
/** Whether or not to show the current amount of this repeatable at the bottom of the display. */
showAmount?: boolean;