Add star to indicate forge/relic status

This commit is contained in:
thepaperpilot 2023-05-18 17:51:05 -05:00
parent 62b68cab6b
commit 14315932f7
3 changed files with 26 additions and 5 deletions

View file

@ -286,7 +286,10 @@ export const resource = {
1 1
) )
}), }),
draggable: true draggable: true,
showStar: node => (node.state as unknown as ResourceState).type in main.toolNodes.value,
fillStar: node =>
`${(node.state as unknown as ResourceState).type}Relic` in main.toolNodes.value
} as NodeTypeOptions; } as NodeTypeOptions;
export const passive = { export const passive = {

View file

@ -58,6 +58,14 @@
" "
:stroke="progressColor" :stroke="progressColor"
/> />
<path
d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"
v-if="showStar"
stroke="var(--bought)"
:stroke-width="4"
:fill="fillStar ? 'var(--bought)' : 'none'"
:transform="`translate(${-size / 4}, ${-size - 10}), scale(0.5)`"
/>
</g> </g>
<g v-else-if="shape === Shape.Diamond" transform="rotate(45, 0, 0)"> <g v-else-if="shape === Shape.Diamond" transform="rotate(45, 0, 0)">
<rect <rect
@ -220,7 +228,6 @@ 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 subtitle = computed(() => getNodeProperty(props.nodeType.value.subtitle, unref(props.node)));
const otherSubtitle = computed(() => const otherSubtitle = computed(() =>
getNodeProperty(props.nodeType.value.otherSubtitle, unref(props.node)) getNodeProperty(props.nodeType.value.otherSubtitle, unref(props.node))
); );
@ -286,6 +293,10 @@ function mouseUp(e: MouseEvent | TouchEvent) {
e.stopPropagation(); e.stopPropagation();
} }
} }
const subtitle = computed(() => getNodeProperty(props.nodeType.value.subtitle, unref(props.node)));
const showStar = computed(() => getNodeProperty(props.nodeType.value.showStar, unref(props.node)));
const fillStar = computed(() => getNodeProperty(props.nodeType.value.fillStar, unref(props.node)));
</script> </script>
<style scoped> <style scoped>

View file

@ -92,8 +92,6 @@ export interface NodeTypeOptions {
title: NodeComputable<string>; title: NodeComputable<string>;
/** The subtitle to display for the node. */ /** The subtitle to display for the node. */
subtitle?: NodeComputable<string>; subtitle?: NodeComputable<string>;
/** The other subtitle to display for the node. */
otherSubtitle?: NodeComputable<string>;
/** An optional label for the node. */ /** An optional label for the node. */
label?: NodeComputable<NodeLabel | null>; label?: NodeComputable<NodeLabel | null>;
/** The size of the node - diameter for circles, width and height for squares. */ /** The size of the node - diameter for circles, width and height for squares. */
@ -130,6 +128,11 @@ export interface NodeTypeOptions {
onDrop?: (node: BoardNode, otherNode: BoardNode) => void; onDrop?: (node: BoardNode, otherNode: BoardNode) => void;
/** A function that is called for each node of this type every tick. */ /** A function that is called for each node of this type every tick. */
update?: (node: BoardNode, diff: number) => void; update?: (node: BoardNode, diff: number) => void;
// Custom properties
otherSubtitle?: NodeComputable<string>;
showStar?: NodeComputable<boolean>;
fillStar?: NodeComputable<boolean>;
} }
/** /**
@ -427,7 +430,6 @@ export function createBoard<T extends BoardOptions>(
processComputable(nodeType as NodeTypeOptions, "title"); processComputable(nodeType as NodeTypeOptions, "title");
processComputable(nodeType as NodeTypeOptions, "subtitle"); processComputable(nodeType as NodeTypeOptions, "subtitle");
processComputable(nodeType as NodeTypeOptions, "otherSubtitle");
processComputable(nodeType as NodeTypeOptions, "label"); processComputable(nodeType as NodeTypeOptions, "label");
processComputable(nodeType as NodeTypeOptions, "size"); processComputable(nodeType as NodeTypeOptions, "size");
setDefault(nodeType, "size", 50); setDefault(nodeType, "size", 50);
@ -449,6 +451,11 @@ export function createBoard<T extends BoardOptions>(
processComputable(nodeType as NodeTypeOptions, "titleColor"); processComputable(nodeType as NodeTypeOptions, "titleColor");
processComputable(nodeType as NodeTypeOptions, "actionDistance"); processComputable(nodeType as NodeTypeOptions, "actionDistance");
setDefault(nodeType, "actionDistance", Math.PI / 6); setDefault(nodeType, "actionDistance", Math.PI / 6);
processComputable(nodeType as NodeTypeOptions, "otherSubtitle");
processComputable(nodeType as NodeTypeOptions, "showStar");
processComputable(nodeType as NodeTypeOptions, "fillStar");
nodeType.nodes = computed(() => nodeType.nodes = computed(() =>
unref(processedBoard.state).nodes.filter(node => node.type === type) unref(processedBoard.state).nodes.filter(node => node.type === type)
); );