Re-fetch player images if the imageUrl changes

This commit is contained in:
James Lyne 2022-02-06 13:04:04 +00:00
parent b75d1022b7
commit b144b817af
3 changed files with 7 additions and 1 deletions

View File

@ -55,6 +55,7 @@ export default defineComponent({
configurationHash = computed(() => store.state.configurationHash), configurationHash = computed(() => store.state.configurationHash),
chatBoxEnabled = computed(() => store.state.components.chatBox), chatBoxEnabled = computed(() => store.state.components.chatBox),
chatVisible = computed(() => store.state.ui.visibleElements.has('chat')), chatVisible = computed(() => store.state.ui.visibleElements.has('chat')),
playerImageUrl = computed(() => store.state.components.players.imageUrl),
loggedIn = computed(() => store.state.loggedIn), //Whether the user is currently logged in loggedIn = computed(() => store.state.loggedIn), //Whether the user is currently logged in
loginRequired = computed(() => store.state.loginRequired), //Whether logging is required to view the current server loginRequired = computed(() => store.state.loginRequired), //Whether logging is required to view the current server
@ -199,6 +200,9 @@ export default defineComponent({
store.commit(MutationTypes.HIDE_UI_MODAL, 'login'); store.commit(MutationTypes.HIDE_UI_MODAL, 'login');
} }
}); });
watch(playerImageUrl, () => {
clearHeadCache();
});
handleUrl(); handleUrl();
onResize(); onResize();

View File

@ -40,6 +40,7 @@ export default defineComponent({
image = ref(defaultImage), image = ref(defaultImage),
name = computed(() => typeof props.player === 'string' ? props.player : props.player.name), name = computed(() => typeof props.player === 'string' ? props.player : props.player.name),
imagesEnabled = computed(() => store.state.components.players.showImages), imagesEnabled = computed(() => store.state.components.players.showImages),
imageUrl = computed(() => store.state.components.players.imageUrl),
updatePlayerImage = async () => { updatePlayerImage = async () => {
image.value = defaultImage; image.value = defaultImage;
@ -54,6 +55,7 @@ export default defineComponent({
}; };
watch(name, () => updatePlayerImage()); watch(name, () => updatePlayerImage());
watch(imageUrl, () => updatePlayerImage());
onMounted(() => updatePlayerImage()); onMounted(() => updatePlayerImage());
return { return {

View File

@ -16,7 +16,7 @@
<template> <template>
<li :class="`message message--${message.type}`"> <li :class="`message message--${message.type}`">
<PlayerImage v-if="showFace" :player="message.playerAccount" width="16" height="16" class="message__face" /> <PlayerImage v-if="showFace && message.playerAccount" :player="message.playerAccount" width="16" height="16" class="message__face" />
<span v-if="messageChannel" class="message__channel" v-html="messageChannel"></span> <span v-if="messageChannel" class="message__channel" v-html="messageChannel"></span>
<span v-if="showSender" class="message__sender" v-html="message.playerName"></span> <span v-if="showSender" class="message__sender" v-html="message.playerName"></span>
<span class="message__content" v-html="messageContent"></span> <span class="message__content" v-html="messageContent"></span>