Show action tooltips when selected
This commit is contained in:
parent
7a81157bcc
commit
6e443ace0d
2 changed files with 11 additions and 4 deletions
|
@ -138,10 +138,10 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import themes from "data/themes";
|
import themes from "data/themes";
|
||||||
import type { BoardNode, GenericBoardNodeAction, GenericNodeType } from "features/boards/board";
|
import type { BoardNode, GenericBoardNodeAction, GenericNodeType } from "features/boards/board";
|
||||||
import { ProgressDisplay, getNodeProperty, Shape } from "features/boards/board";
|
import { ProgressDisplay, Shape, getNodeProperty } from "features/boards/board";
|
||||||
import { isVisible } from "features/feature";
|
import { isVisible } from "features/feature";
|
||||||
import settings from "game/settings";
|
import settings from "game/settings";
|
||||||
import { computed, ref, toRefs, unref, watch } from "vue";
|
import { computed, toRefs, unref, watch } from "vue";
|
||||||
import BoardNodeAction from "./BoardNodeAction.vue";
|
import BoardNodeAction from "./BoardNodeAction.vue";
|
||||||
|
|
||||||
const sqrtTwo = Math.sqrt(2);
|
const sqrtTwo = Math.sqrt(2);
|
||||||
|
@ -204,7 +204,14 @@ const position = computed(() => {
|
||||||
|
|
||||||
const shape = computed(() => getNodeProperty(props.nodeType.value.shape, unref(props.node)));
|
const shape = computed(() => getNodeProperty(props.nodeType.value.shape, unref(props.node)));
|
||||||
const title = computed(() => getNodeProperty(props.nodeType.value.title, unref(props.node)));
|
const title = computed(() => getNodeProperty(props.nodeType.value.title, unref(props.node)));
|
||||||
const label = computed(() => getNodeProperty(props.nodeType.value.label, unref(props.node)));
|
const label = computed(
|
||||||
|
() =>
|
||||||
|
(isSelected.value
|
||||||
|
? unref(props.selectedAction) &&
|
||||||
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
||||||
|
getNodeProperty(unref(props.selectedAction)!.tooltip, unref(props.node))
|
||||||
|
: null) ?? getNodeProperty(props.nodeType.value.label, unref(props.node))
|
||||||
|
);
|
||||||
const size = computed(() => getNodeProperty(props.nodeType.value.size, unref(props.node)));
|
const size = computed(() => getNodeProperty(props.nodeType.value.size, unref(props.node)));
|
||||||
const progress = computed(
|
const progress = computed(
|
||||||
() => getNodeProperty(props.nodeType.value.progress, unref(props.node)) ?? 0
|
() => getNodeProperty(props.nodeType.value.progress, unref(props.node)) ?? 0
|
||||||
|
|
|
@ -178,7 +178,7 @@ export interface BoardNodeActionOptions {
|
||||||
/** The fill color of the action. */
|
/** The fill color of the action. */
|
||||||
fillColor?: NodeComputable<string>;
|
fillColor?: NodeComputable<string>;
|
||||||
/** The tooltip text to display for the action. */
|
/** The tooltip text to display for the action. */
|
||||||
tooltip: NodeComputable<string>;
|
tooltip: NodeComputable<NodeLabel>;
|
||||||
/** An array of board node links associated with the action. They appear when the action is focused. */
|
/** An array of board node links associated with the action. They appear when the action is focused. */
|
||||||
links?: NodeComputable<BoardNodeLink[]>;
|
links?: NodeComputable<BoardNodeLink[]>;
|
||||||
/** A function that is called when the action is clicked. */
|
/** A function that is called when the action is clicked. */
|
||||||
|
|
Loading…
Reference in a new issue