diff options
author | Joas Schilling <coding@schilljs.com> | 2022-01-19 14:21:38 +0300 |
---|---|---|
committer | Joas Schilling <coding@schilljs.com> | 2022-03-22 16:10:15 +0300 |
commit | 9094628f3235218b8e8f3ce1b9954573db494154 (patch) | |
tree | 7240d4ee673a2cf5e91b4a59da4e63f957a96eaa /src | |
parent | 9b6104cb7d7b164c91bdc1ac1d3b5f68f293e3fa (diff) |
Don't use the avatar for the callview background, to save O(n^2) requests
Signed-off-by: Joas Schilling <coding@schilljs.com>
Diffstat (limited to 'src')
-rw-r--r-- | src/components/CallView/shared/VideoBackground.vue | 95 |
1 files changed, 0 insertions, 95 deletions
diff --git a/src/components/CallView/shared/VideoBackground.vue b/src/components/CallView/shared/VideoBackground.vue index a7c52cc2b..23d313549 100644 --- a/src/components/CallView/shared/VideoBackground.vue +++ b/src/components/CallView/shared/VideoBackground.vue @@ -29,33 +29,7 @@ </template> <script> -import { average } from 'color.js' -import axios from '@nextcloud/axios' import usernameToColor from '@nextcloud/vue/dist/Functions/usernameToColor' -import { generateUrl } from '@nextcloud/router' -import { getBuilder } from '@nextcloud/browser-storage' - -const browserStorage = getBuilder('nextcloud').persist().build() - -// note: this info is shared with the Avatar component -/** - * @param {string} userId ID of the user - */ -function getUserHasAvatar(userId) { - const flag = browserStorage.getItem('user-has-avatar.' + userId) - if (typeof flag === 'string') { - return Boolean(flag) - } - return null -} - -/** - * @param {string} userId ID of the user - * @param {string} flag The boolean flag as string - */ -function setUserHasAvatar(userId, flag) { - browserStorage.setItem('user-has-avatar.' + userId, flag) -} export default { name: 'VideoBackground', @@ -71,25 +45,8 @@ export default { }, }, - data() { - return { - hasPicture: false, - } - }, - computed: { - backgroundImageAverageColor() { - if (!this.backgroundImageUrl) { - return '' - } - - return this.$store.getters.getCachedBackgroundImageAverageColor(this.backgroundImageUrl) - }, backgroundColor() { - if (this.hasPicture) { - return this.backgroundImageAverageColor - } - // If the prop is empty. We're not checking for the default value // because the user's displayName might be '?' if (!this.displayName) { @@ -99,58 +56,6 @@ export default { return `rgb(${color.r}, ${color.g}, ${color.b})` } }, - backgroundImageUrl() { - if (!this.user) { - return null - } - - return generateUrl(`avatar/${this.user}/64`) - }, - }, - - watch: { - backgroundImageUrl: { - immediate: true, - handler() { - if (!this.backgroundImageUrl) { - return - } - - if (this.backgroundImageAverageColor) { - // Already calculated, no need to do it again. - return - } - - average(this.backgroundImageUrl, { format: 'hex' }).then(color => { - this.$store.dispatch('setCachedBackgroundImageAverageColor', { - videoBackgroundId: this.backgroundImageUrl, - backgroundImageAverageColor: color, - }) - }) - }, - }, - }, - - async beforeMount() { - if (!this.user) { - return - } - - // check if hasAvatar info is already known - const userHasAvatar = getUserHasAvatar(this.user) - if (typeof userHasAvatar === 'boolean') { - this.hasPicture = userHasAvatar - return - } - - try { - await axios.get(generateUrl(`avatar/${this.user}/64`)) - - this.hasPicture = true - setUserHasAvatar(this.user, true) - } catch (exception) { - console.debug(exception) - } }, } </script> |