vielle.dev
this repo has no description
make powers handle disabling buttons better
+12
-6
src/components/astral/Powers.astro
+12
-6
src/components/astral/Powers.astro
···
33
import {
34
isPowerId,
35
parentPowers,
36
type powerId,
37
powers,
38
} from "../../consts/astral";
···
70
this.#internals.states.add("selected");
71
button && (button.disabled = false);
72
73
-
// if any selected powers rely on it
74
if (
75
value.powers.filter((x) =>
76
parentPowers[x].includes(this.power ?? powers.INVALID),
77
-
).length > 1
78
) {
79
this.#internals.states.add("dependency");
80
button && (button.disabled = true);
···
104
const button = this.shadowRoot?.querySelector("dialog button");
105
if (!(button instanceof HTMLButtonElement))
106
throw "`dialog button` could not be selected";
107
-
button.addEventListener("click", (ev) => {
108
if (
109
// this.power is in some way invalid; drop the event
110
!this.power ||
···
114
return;
115
// the power is selected; deselect it
116
else if (Powers.get().powers.includes(this.power)) {
117
-
console.log("deselect");
118
Powers.setKey(
119
"powers",
120
Powers.get().powers.filter((x) => x !== this.power),
···
125
// the power is not selected and its parent is unlocked
126
else if (
127
Powers.get().powers.includes(parentPowers[this.power].at(-2) ?? "")
128
-
)
129
Powers.setKey("powers", [...Powers.get().powers, this.power]);
130
});
131
}
132
···
172
"Locked: This power cannot be added to the power list",
173
"No parent: The parent power for this power has not been selected",
174
"No points: You do not have enough points to unlock this power",
175
-
"Dependency: Another power relies on this power being selected",
176
].join("\n")}
177
>
178
<span data-val="unselect">Unselect</span>
···
33
import {
34
isPowerId,
35
parentPowers,
36
+
powerData,
37
type powerId,
38
powers,
39
} from "../../consts/astral";
···
71
this.#internals.states.add("selected");
72
button && (button.disabled = false);
73
74
+
// if any selected powers rely on it OR if its force select
75
if (
76
value.powers.filter((x) =>
77
parentPowers[x].includes(this.power ?? powers.INVALID),
78
+
).length > 1 ||
79
+
powerData[this.power].forceSelect
80
) {
81
this.#internals.states.add("dependency");
82
button && (button.disabled = true);
···
106
const button = this.shadowRoot?.querySelector("dialog button");
107
if (!(button instanceof HTMLButtonElement))
108
throw "`dialog button` could not be selected";
109
+
110
+
button.addEventListener("click", () => {
111
if (
112
// this.power is in some way invalid; drop the event
113
!this.power ||
···
117
return;
118
// the power is selected; deselect it
119
else if (Powers.get().powers.includes(this.power)) {
120
+
button.disabled = true;
121
+
122
Powers.setKey(
123
"powers",
124
Powers.get().powers.filter((x) => x !== this.power),
···
129
// the power is not selected and its parent is unlocked
130
else if (
131
Powers.get().powers.includes(parentPowers[this.power].at(-2) ?? "")
132
+
) {
133
+
button.disabled = true;
134
Powers.setKey("powers", [...Powers.get().powers, this.power]);
135
+
}
136
});
137
}
138
···
178
"Locked: This power cannot be added to the power list",
179
"No parent: The parent power for this power has not been selected",
180
"No points: You do not have enough points to unlock this power",
181
+
"Dependency: Another power relies on this power being selected, or it must be selected",
182
].join("\n")}
183
>
184
<span data-val="unselect">Unselect</span>