diff --git a/src/dashboard/example/components/ScoreboardPanel.vue b/src/dashboard/example/components/ScoreboardPanel.vue
index a526328..d8b61c9 100644
--- a/src/dashboard/example/components/ScoreboardPanel.vue
+++ b/src/dashboard/example/components/ScoreboardPanel.vue
@@ -135,6 +135,38 @@ const rightCanSave = computed(
&& !playerExistsByGamertag(scoreboardStore.scoreboard.rightNameOverride),
);
+const leftTeamChanged = computed(() => {
+ const player = leftSelectedPlayer.value;
+ if (!player) {
+ return false;
+ }
+ return player.team !== scoreboardStore.scoreboard.leftTeamOverride;
+});
+
+const rightTeamChanged = computed(() => {
+ const player = rightSelectedPlayer.value;
+ if (!player) {
+ return false;
+ }
+ return player.team !== scoreboardStore.scoreboard.rightTeamOverride;
+});
+
+const leftCountryChanged = computed(() => {
+ const player = leftSelectedPlayer.value;
+ if (!player) {
+ return false;
+ }
+ return player.country !== scoreboardStore.scoreboard.leftCountryOverride;
+});
+
+const rightCountryChanged = computed(() => {
+ const player = rightSelectedPlayer.value;
+ if (!player) {
+ return false;
+ }
+ return player.country !== scoreboardStore.scoreboard.rightCountryOverride;
+});
+
const leftPendingGamertag = computed(() => {
const override = scoreboardStore.scoreboard.leftNameOverride.trim();
if (override) {
@@ -151,26 +183,33 @@ const rightPendingGamertag = computed(() => {
return rightSelectedPlayer.value?.gamertag ?? '';
});
-const leftHasSelectedPlayerChanges = computed(() => {
+const leftNameChanged = computed(() => {
const player = leftSelectedPlayer.value;
if (!player) {
return false;
}
- return player.gamertag !== leftPendingGamertag.value
- || player.team !== scoreboardStore.scoreboard.leftTeamOverride
- || player.country !== scoreboardStore.scoreboard.leftCountryOverride;
+ return player.gamertag !== leftPendingGamertag.value;
});
-const rightHasSelectedPlayerChanges = computed(() => {
+const rightNameChanged = computed(() => {
const player = rightSelectedPlayer.value;
if (!player) {
return false;
}
- return player.gamertag !== rightPendingGamertag.value
- || player.team !== scoreboardStore.scoreboard.rightTeamOverride
- || player.country !== scoreboardStore.scoreboard.rightCountryOverride;
+ return player.gamertag !== rightPendingGamertag.value;
});
+const leftCanSaveNameChange = computed(
+ () => leftNameChanged.value && !playerExistsByGamertag(leftPendingGamertag.value),
+);
+
+const rightCanSaveNameChange = computed(
+ () => rightNameChanged.value && !playerExistsByGamertag(rightPendingGamertag.value),
+);
+
+const leftShowsNameSave = computed(() => leftCanSave.value || leftCanSaveNameChange.value);
+const rightShowsNameSave = computed(() => rightCanSave.value || rightCanSaveNameChange.value);
+
const startLeftCustomPlayer = () => {
const wasCustom = scoreboardStore.scoreboard.leftPlayerId === CUSTOM_LEFT_PLAYER_ID;
scoreboardStore.scoreboard.leftPlayerId = CUSTOM_LEFT_PLAYER_ID;
@@ -372,7 +411,39 @@ const saveRightPlayer = () => {
rightInput.value = gamertag;
};
-const saveLeftSelectedPlayerChanges = () => {
+const saveLeftNameChange = () => {
+ const playerId = scoreboardStore.scoreboard.leftPlayerId;
+ const player = playersStore.players[playerId];
+ if (!player) {
+ return;
+ }
+ if (!leftCanSaveNameChange.value) {
+ return;
+ }
+ playersStore.upsertPlayer(playerId, {
+ ...player,
+ gamertag: leftPendingGamertag.value,
+ });
+ scoreboardStore.scoreboard.leftNameOverride = '';
+};
+
+const saveRightNameChange = () => {
+ const playerId = scoreboardStore.scoreboard.rightPlayerId;
+ const player = playersStore.players[playerId];
+ if (!player) {
+ return;
+ }
+ if (!rightCanSaveNameChange.value) {
+ return;
+ }
+ playersStore.upsertPlayer(playerId, {
+ ...player,
+ gamertag: rightPendingGamertag.value,
+ });
+ scoreboardStore.scoreboard.rightNameOverride = '';
+};
+
+const saveLeftTeamChange = () => {
const playerId = scoreboardStore.scoreboard.leftPlayerId;
const player = playersStore.players[playerId];
if (!player) {
@@ -380,14 +451,11 @@ const saveLeftSelectedPlayerChanges = () => {
}
playersStore.upsertPlayer(playerId, {
...player,
- gamertag: leftPendingGamertag.value,
team: scoreboardStore.scoreboard.leftTeamOverride,
- country: scoreboardStore.scoreboard.leftCountryOverride,
});
- scoreboardStore.scoreboard.leftNameOverride = '';
};
-const saveRightSelectedPlayerChanges = () => {
+const saveRightTeamChange = () => {
const playerId = scoreboardStore.scoreboard.rightPlayerId;
const player = playersStore.players[playerId];
if (!player) {
@@ -395,11 +463,48 @@ const saveRightSelectedPlayerChanges = () => {
}
playersStore.upsertPlayer(playerId, {
...player,
- gamertag: rightPendingGamertag.value,
team: scoreboardStore.scoreboard.rightTeamOverride,
+ });
+};
+
+const saveLeftCountryChange = () => {
+ const playerId = scoreboardStore.scoreboard.leftPlayerId;
+ const player = playersStore.players[playerId];
+ if (!player) {
+ return;
+ }
+ playersStore.upsertPlayer(playerId, {
+ ...player,
+ country: scoreboardStore.scoreboard.leftCountryOverride,
+ });
+};
+
+const saveRightCountryChange = () => {
+ const playerId = scoreboardStore.scoreboard.rightPlayerId;
+ const player = playersStore.players[playerId];
+ if (!player) {
+ return;
+ }
+ playersStore.upsertPlayer(playerId, {
+ ...player,
country: scoreboardStore.scoreboard.rightCountryOverride,
});
- scoreboardStore.scoreboard.rightNameOverride = '';
+};
+
+const onLeftNameSave = () => {
+ if (leftCanSave.value) {
+ saveLeftPlayer();
+ return;
+ }
+ saveLeftNameChange();
+};
+
+const onRightNameSave = () => {
+ if (rightCanSave.value) {
+ saveRightPlayer();
+ return;
+ }
+ saveRightNameChange();
};
@@ -504,14 +609,38 @@ watchEffect(() => {
@focus="onLeftFocus"
@blur="onLeftBlur"
@update:model-value="onLeftSelect"
- />
+ >
+
+
+
+
+ >
+
+
+
+
{
outlined
class="q-mt-sm"
@filter="onLeftCountryFilter"
- />
-
-
+ >
+
+
+
+
{
@focus="onRightFocus"
@blur="onRightBlur"
@update:model-value="onRightSelect"
- />
+ >
+
+
+
+
+ >
+
+
+
+
{
outlined
class="q-mt-sm"
@filter="onRightCountryFilter"
- />
-
-
+ >
+
+
+
+