diff options
author | kontrollanten <6680299+kontrollanten@users.noreply.github.com> | 2022-02-28 08:34:43 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-02-28 08:34:43 +0100 |
commit | d0800f7661f13fabe7bb6f4aa0ea50764f106405 (patch) | |
tree | d43e6b0b6f4a5a32e03487e6464edbcaf288be2a /client/src/app/shared/shared-main/video-channel | |
parent | 5cad2ca9db9b9d138f8a33058d10b94a9fd50c69 (diff) | |
download | PeerTube-d0800f7661f13fabe7bb6f4aa0ea50764f106405.tar.gz PeerTube-d0800f7661f13fabe7bb6f4aa0ea50764f106405.tar.zst PeerTube-d0800f7661f13fabe7bb6f4aa0ea50764f106405.zip |
Implement avatar miniatures (#4639)
* client: remove unused file
* refactor(client/my-actor-avatar): size from input
Read size from component input instead of scss, to make it possible to
use smaller avatar images when implemented.
* implement avatar miniatures
close #4560
* fix(test): max file size
* fix(search-index): normalize res acc to avatarMini
* refactor avatars to an array
* client/search: resize channel avatar to 120
* refactor(client/videos): remove unused function
* client(actor-avatar): set default size
* fix tests and avatars full result
When findOne is used only an array containting one avatar is returned.
* update migration version and version notations
* server/search: harmonize normalizing
* Cleanup avatar miniature PR
Co-authored-by: Chocobozzz <me@florianbigard.com>
Diffstat (limited to 'client/src/app/shared/shared-main/video-channel')
-rw-r--r-- | client/src/app/shared/shared-main/video-channel/video-channel.model.ts | 42 | ||||
-rw-r--r-- | client/src/app/shared/shared-main/video-channel/video-channel.service.ts | 2 |
2 files changed, 25 insertions, 19 deletions
diff --git a/client/src/app/shared/shared-main/video-channel/video-channel.model.ts b/client/src/app/shared/shared-main/video-channel/video-channel.model.ts index ac2679b42..e22b0cfd0 100644 --- a/client/src/app/shared/shared-main/video-channel/video-channel.model.ts +++ b/client/src/app/shared/shared-main/video-channel/video-channel.model.ts | |||
@@ -12,7 +12,11 @@ export class VideoChannel extends Actor implements ServerVideoChannel { | |||
12 | nameWithHost: string | 12 | nameWithHost: string |
13 | nameWithHostForced: string | 13 | nameWithHostForced: string |
14 | 14 | ||
15 | banner: ActorImage | 15 | // TODO: remove, deprecated in 4.2 |
16 | banner: never | ||
17 | |||
18 | banners: ActorImage[] | ||
19 | |||
16 | bannerUrl: string | 20 | bannerUrl: string |
17 | 21 | ||
18 | updatedAt: Date | string | 22 | updatedAt: Date | string |
@@ -24,23 +28,25 @@ export class VideoChannel extends Actor implements ServerVideoChannel { | |||
24 | 28 | ||
25 | viewsPerDay?: ViewsPerDate[] | 29 | viewsPerDay?: ViewsPerDate[] |
26 | 30 | ||
27 | static GET_ACTOR_AVATAR_URL (actor: { avatar?: { url?: string, path: string } }) { | 31 | static GET_ACTOR_AVATAR_URL (actor: { avatars: { width: number, url?: string, path: string }[] }, size: number) { |
28 | return Actor.GET_ACTOR_AVATAR_URL(actor) | 32 | return Actor.GET_ACTOR_AVATAR_URL(actor, size) |
29 | } | 33 | } |
30 | 34 | ||
31 | static GET_ACTOR_BANNER_URL (channel: ServerVideoChannel) { | 35 | static GET_ACTOR_BANNER_URL (channel: ServerVideoChannel) { |
32 | if (channel?.banner?.url) return channel.banner.url | 36 | if (!channel) return '' |
33 | |||
34 | if (channel?.banner) { | ||
35 | const absoluteAPIUrl = getAbsoluteAPIUrl() | ||
36 | 37 | ||
37 | return absoluteAPIUrl + channel.banner.path | 38 | const banner = channel.banners[0] |
38 | } | 39 | if (!banner) return '' |
39 | 40 | ||
40 | return '' | 41 | if (banner.url) return banner.url |
42 | return getAbsoluteAPIUrl() + banner.path | ||
41 | } | 43 | } |
42 | 44 | ||
43 | static GET_DEFAULT_AVATAR_URL () { | 45 | static GET_DEFAULT_AVATAR_URL (size: number) { |
46 | if (size <= 48) { | ||
47 | return `${window.location.origin}/client/assets/images/default-avatar-video-channel-48x48.png` | ||
48 | } | ||
49 | |||
44 | return `${window.location.origin}/client/assets/images/default-avatar-video-channel.png` | 50 | return `${window.location.origin}/client/assets/images/default-avatar-video-channel.png` |
45 | } | 51 | } |
46 | 52 | ||
@@ -51,7 +57,7 @@ export class VideoChannel extends Actor implements ServerVideoChannel { | |||
51 | this.description = hash.description | 57 | this.description = hash.description |
52 | this.support = hash.support | 58 | this.support = hash.support |
53 | 59 | ||
54 | this.banner = hash.banner | 60 | this.banners = hash.banners |
55 | 61 | ||
56 | this.isLocal = hash.isLocal | 62 | this.isLocal = hash.isLocal |
57 | 63 | ||
@@ -74,24 +80,24 @@ export class VideoChannel extends Actor implements ServerVideoChannel { | |||
74 | this.updateComputedAttributes() | 80 | this.updateComputedAttributes() |
75 | } | 81 | } |
76 | 82 | ||
77 | updateAvatar (newAvatar: ActorImage) { | 83 | updateAvatar (newAvatars: ActorImage[]) { |
78 | this.avatar = newAvatar | 84 | this.avatars = newAvatars |
79 | 85 | ||
80 | this.updateComputedAttributes() | 86 | this.updateComputedAttributes() |
81 | } | 87 | } |
82 | 88 | ||
83 | resetAvatar () { | 89 | resetAvatar () { |
84 | this.updateAvatar(null) | 90 | this.updateAvatar([]) |
85 | } | 91 | } |
86 | 92 | ||
87 | updateBanner (newBanner: ActorImage) { | 93 | updateBanner (newBanners: ActorImage[]) { |
88 | this.banner = newBanner | 94 | this.banners = newBanners |
89 | 95 | ||
90 | this.updateComputedAttributes() | 96 | this.updateComputedAttributes() |
91 | } | 97 | } |
92 | 98 | ||
93 | resetBanner () { | 99 | resetBanner () { |
94 | this.updateBanner(null) | 100 | this.updateBanner([]) |
95 | } | 101 | } |
96 | 102 | ||
97 | updateComputedAttributes () { | 103 | updateComputedAttributes () { |
diff --git a/client/src/app/shared/shared-main/video-channel/video-channel.service.ts b/client/src/app/shared/shared-main/video-channel/video-channel.service.ts index f37f13c51..480d250fb 100644 --- a/client/src/app/shared/shared-main/video-channel/video-channel.service.ts +++ b/client/src/app/shared/shared-main/video-channel/video-channel.service.ts | |||
@@ -80,7 +80,7 @@ export class VideoChannelService { | |||
80 | changeVideoChannelImage (videoChannelName: string, avatarForm: FormData, type: 'avatar' | 'banner') { | 80 | changeVideoChannelImage (videoChannelName: string, avatarForm: FormData, type: 'avatar' | 'banner') { |
81 | const url = VideoChannelService.BASE_VIDEO_CHANNEL_URL + videoChannelName + '/' + type + '/pick' | 81 | const url = VideoChannelService.BASE_VIDEO_CHANNEL_URL + videoChannelName + '/' + type + '/pick' |
82 | 82 | ||
83 | return this.authHttp.post<{ avatar?: ActorImage, banner?: ActorImage }>(url, avatarForm) | 83 | return this.authHttp.post<{ avatars?: ActorImage[], banners?: ActorImage[] }>(url, avatarForm) |
84 | .pipe(catchError(err => this.restExtractor.handleError(err))) | 84 | .pipe(catchError(err => this.restExtractor.handleError(err))) |
85 | } | 85 | } |
86 | 86 | ||