diff --git a/src/data/nodeTypes.tsx b/src/data/nodeTypes.tsx index 2c4ddc1..ecd615e 100644 --- a/src/data/nodeTypes.tsx +++ b/src/data/nodeTypes.tsx @@ -54,7 +54,6 @@ import { import { GenericPlane, createPlane } from "./planes"; import { main } from "./projEntry"; import { exponentialFormat } from "util/bignum"; -import { ModalData } from "./help"; export const mine = { shape: Shape.Diamond, @@ -265,12 +264,10 @@ const romanNumerals = [ export const resource = { shape: Shape.Circle, size: 50, - title: node => - camelToTitle((node.state as unknown as ResourceState).type) + - " (" + - romanNumerals[resourceNames.indexOf((node.state as unknown as ResourceState).type)] + - ")", + title: node => camelToTitle((node.state as unknown as ResourceState).type), subtitle: node => formatWhole((node.state as unknown as ResourceState).amount), + otherSubtitle: node => + romanNumerals[resourceNames.indexOf((node.state as unknown as ResourceState).type)], progress: node => getResourceLevelProgress((node.state as unknown as ResourceState).type), // Make clicking resources a no-op so they can't be selected // eslint-disable-next-line @typescript-eslint/no-empty-function @@ -665,7 +662,7 @@ export const influence = { : Shape.Circle, size: 50, title: node => influences[(node.state as unknown as InfluenceState).type].display, - subtitle: node => { + otherSubtitle: node => { const cost = influences[(node.state as unknown as InfluenceState).type].cost; if (Decimal.lt(cost, 1e3)) { return `${formatWhole(cost)}x cost`; diff --git a/src/features/boards/BoardNode.vue b/src/features/boards/BoardNode.vue index 710f1fb..629e1e8 100644 --- a/src/features/boards/BoardNode.vue +++ b/src/features/boards/BoardNode.vue @@ -111,10 +111,19 @@ /> - {{ title }} - {{ + {{ + title + }} + {{ subtitle }} + {{ otherSubtitle }} @@ -212,6 +221,9 @@ const position = computed(() => { const shape = computed(() => getNodeProperty(props.nodeType.value.shape, unref(props.node))); const title = computed(() => getNodeProperty(props.nodeType.value.title, unref(props.node))); const subtitle = computed(() => getNodeProperty(props.nodeType.value.subtitle, unref(props.node))); +const otherSubtitle = computed(() => + getNodeProperty(props.nodeType.value.otherSubtitle, unref(props.node)) +); const label = computed( () => (props.isSelected.value diff --git a/src/features/boards/board.ts b/src/features/boards/board.ts index 0dc8394..129f862 100644 --- a/src/features/boards/board.ts +++ b/src/features/boards/board.ts @@ -92,6 +92,8 @@ export interface NodeTypeOptions { title: NodeComputable; /** The subtitle to display for the node. */ subtitle?: NodeComputable; + /** The other subtitle to display for the node. */ + otherSubtitle?: NodeComputable; /** An optional label for the node. */ label?: NodeComputable; /** The size of the node - diameter for circles, width and height for squares. */ @@ -144,6 +146,7 @@ export type NodeType = Replace< { title: GetComputableType; subtitle: GetComputableType; + otherSubtitle: GetComputableType; label: GetComputableType; size: GetComputableTypeWithDefault; style: GetComputableType; @@ -424,6 +427,7 @@ export function createBoard( processComputable(nodeType as NodeTypeOptions, "title"); processComputable(nodeType as NodeTypeOptions, "subtitle"); + processComputable(nodeType as NodeTypeOptions, "otherSubtitle"); processComputable(nodeType as NodeTypeOptions, "label"); processComputable(nodeType as NodeTypeOptions, "size"); setDefault(nodeType, "size", 50);