From d3217560a611b94f888ecf3de93b428a7521d4de Mon Sep 17 00:00:00 2001 From: Rigel Kent Date: Fri, 28 Feb 2020 13:52:21 +0100 Subject: Add visitor settings, rework logged-in dropdown (#2514) * Add visitor settings, rework logged-in dropdown * Make user dropdown P2P switch functional * Fix lint * Fix unnecessary notification when user logs out * Simplify visitor settings code and remove unnecessary icons * Catch parsing errors and reindent menu styles --- client/src/app/shared/users/user.model.ts | 29 ++++++++++- client/src/app/shared/users/user.service.ts | 77 ++++++++++++++++++++++++----- 2 files changed, 92 insertions(+), 14 deletions(-) (limited to 'client/src/app/shared/users') diff --git a/client/src/app/shared/users/user.model.ts b/client/src/app/shared/users/user.model.ts index 7707d7dda..a37cae749 100644 --- a/client/src/app/shared/users/user.model.ts +++ b/client/src/app/shared/users/user.model.ts @@ -1,10 +1,32 @@ -import { hasUserRight, User as UserServerModel, UserNotificationSetting, UserRight, UserRole, VideoChannel } from '../../../../../shared' +import { + hasUserRight, + User as UserServerModel, + UserNotificationSetting, + UserRight, + UserRole +} from '../../../../../shared/models/users' +import { VideoChannel } from '../../../../../shared/models/videos' import { NSFWPolicyType } from '../../../../../shared/models/videos/nsfw-policy.type' import { Account } from '@app/shared/account/account.model' import { Avatar } from '../../../../../shared/models/avatars/avatar.model' import { UserAdminFlag } from '@shared/models/users/user-flag.model' export class User implements UserServerModel { + static KEYS = { + ID: 'id', + ROLE: 'role', + EMAIL: 'email', + VIDEOS_HISTORY_ENABLED: 'videos-history-enabled', + USERNAME: 'username', + NSFW_POLICY: 'nsfw_policy', + WEBTORRENT_ENABLED: 'peertube-videojs-' + 'webtorrent_enabled', + AUTO_PLAY_VIDEO: 'auto_play_video', + SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO: 'auto_play_next_video', + AUTO_PLAY_VIDEO_PLAYLIST: 'auto_play_video_playlist', + THEME: 'last_active_theme', + VIDEO_LANGUAGES: 'video_languages' + } + id: number username: string email: string @@ -60,8 +82,11 @@ export class User implements UserServerModel { this.nsfwPolicy = hash.nsfwPolicy this.webTorrentEnabled = hash.webTorrentEnabled - this.videosHistoryEnabled = hash.videosHistoryEnabled this.autoPlayVideo = hash.autoPlayVideo + this.autoPlayNextVideo = hash.autoPlayNextVideo + this.autoPlayNextVideoPlaylist = hash.autoPlayNextVideoPlaylist + this.videosHistoryEnabled = hash.videosHistoryEnabled + this.videoLanguages = hash.videoLanguages this.theme = hash.theme diff --git a/client/src/app/shared/users/user.service.ts b/client/src/app/shared/users/user.service.ts index e24d91df3..a79343646 100644 --- a/client/src/app/shared/users/user.service.ts +++ b/client/src/app/shared/users/user.service.ts @@ -1,8 +1,8 @@ -import { from, Observable, of } from 'rxjs' -import { catchError, concatMap, map, share, shareReplay, tap, toArray } from 'rxjs/operators' +import { from, Observable } from 'rxjs' +import { catchError, concatMap, map, shareReplay, toArray } from 'rxjs/operators' import { HttpClient, HttpParams } from '@angular/common/http' import { Injectable } from '@angular/core' -import { ResultList, User, UserCreate, UserRole, UserUpdate, UserUpdateMe, UserVideoQuota } from '../../../../../shared' +import { ResultList, User as UserServerModel, UserCreate, UserRole, UserUpdate, UserUpdateMe, UserVideoQuota } from '../../../../../shared' import { environment } from '../../../environments/environment' import { RestExtractor, RestPagination, RestService } from '../rest' import { Avatar } from '../../../../../shared/models/avatars/avatar.model' @@ -10,6 +10,10 @@ import { SortMeta } from 'primeng/api' import { BytesPipe } from 'ngx-pipes' import { I18n } from '@ngx-translate/i18n-polyfill' import { UserRegister } from '@shared/models/users/user-register.model' +import { User } from './user.model' +import { NSFWPolicyType } from '@shared/models/videos/nsfw-policy.type' +import { has } from 'lodash-es' +import { LocalStorageService, SessionStorageService } from '../misc/storage.service' @Injectable() export class UserService { @@ -17,12 +21,14 @@ export class UserService { private bytesPipe = new BytesPipe() - private userCache: { [ id: number ]: Observable } = {} + private userCache: { [ id: number ]: Observable } = {} constructor ( private authHttp: HttpClient, private restExtractor: RestExtractor, private restService: RestService, + private localStorageService: LocalStorageService, + private sessionStorageService: SessionStorageService, private i18n: I18n ) { } @@ -64,6 +70,30 @@ export class UserService { ) } + updateMyAnonymousProfile (profile: UserUpdateMe) { + const supportedKeys = { + // local storage keys + nsfwPolicy: (val: NSFWPolicyType) => this.localStorageService.setItem(User.KEYS.NSFW_POLICY, val), + webTorrentEnabled: (val: boolean) => this.localStorageService.setItem(User.KEYS.WEBTORRENT_ENABLED, String(val)), + autoPlayVideo: (val: boolean) => this.localStorageService.setItem(User.KEYS.AUTO_PLAY_VIDEO, String(val)), + autoPlayNextVideoPlaylist: (val: boolean) => this.localStorageService.setItem(User.KEYS.AUTO_PLAY_VIDEO_PLAYLIST, String(val)), + theme: (val: string) => this.localStorageService.setItem(User.KEYS.THEME, val), + videoLanguages: (val: string[]) => this.localStorageService.setItem(User.KEYS.VIDEO_LANGUAGES, JSON.stringify(val)), + + // session storage keys + autoPlayNextVideo: (val: boolean) => + this.sessionStorageService.setItem(User.KEYS.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO, String(val)) + } + + for (const key of Object.keys(profile)) { + try { + if (has(supportedKeys, key)) supportedKeys[key](profile[key]) + } catch (err) { + console.error(`Cannot set item ${key} in localStorage. Likely due to a value impossible to stringify.`, err) + } + } + } + deleteMe () { const url = UserService.BASE_USERS_URL + 'me' @@ -187,7 +217,7 @@ export class UserService { ) } - updateUsers (users: User[], userUpdate: UserUpdate) { + updateUsers (users: UserServerModel[], userUpdate: UserUpdate) { return from(users) .pipe( concatMap(u => this.authHttp.put(UserService.BASE_USERS_URL + u.id, userUpdate)), @@ -205,17 +235,40 @@ export class UserService { } getUser (userId: number) { - return this.authHttp.get(UserService.BASE_USERS_URL + userId) + return this.authHttp.get(UserService.BASE_USERS_URL + userId) .pipe(catchError(err => this.restExtractor.handleError(err))) } - getUsers (pagination: RestPagination, sort: SortMeta, search?: string): Observable> { + getAnonymousUser () { + let videoLanguages + try { + videoLanguages = JSON.parse(this.localStorageService.getItem(User.KEYS.VIDEO_LANGUAGES)) + } catch (err) { + videoLanguages = null + console.error('Cannot parse desired video languages from localStorage.', err) + } + + return new User({ + // local storage keys + nsfwPolicy: this.localStorageService.getItem(User.KEYS.NSFW_POLICY) as NSFWPolicyType, + webTorrentEnabled: this.localStorageService.getItem(User.KEYS.WEBTORRENT_ENABLED) !== 'false', + autoPlayVideo: this.localStorageService.getItem(User.KEYS.AUTO_PLAY_VIDEO) === 'true', + autoPlayNextVideoPlaylist: this.localStorageService.getItem(User.KEYS.AUTO_PLAY_VIDEO_PLAYLIST) === 'true', + theme: this.localStorageService.getItem(User.KEYS.THEME) || 'default', + videoLanguages, + + // session storage keys + autoPlayNextVideo: this.sessionStorageService.getItem(User.KEYS.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO) === 'true' + }) + } + + getUsers (pagination: RestPagination, sort: SortMeta, search?: string): Observable> { let params = new HttpParams() params = this.restService.addRestGetParams(params, pagination, sort) if (search) params = params.append('search', search) - return this.authHttp.get>(UserService.BASE_USERS_URL, { params }) + return this.authHttp.get>(UserService.BASE_USERS_URL, { params }) .pipe( map(res => this.restExtractor.convertResultListDateToHuman(res)), map(res => this.restExtractor.applyToResultListData(res, this.formatUser.bind(this))), @@ -223,7 +276,7 @@ export class UserService { ) } - removeUser (usersArg: User | User[]) { + removeUser (usersArg: UserServerModel | UserServerModel[]) { const users = Array.isArray(usersArg) ? usersArg : [ usersArg ] return from(users) @@ -234,7 +287,7 @@ export class UserService { ) } - banUsers (usersArg: User | User[], reason?: string) { + banUsers (usersArg: UserServerModel | UserServerModel[], reason?: string) { const body = reason ? { reason } : {} const users = Array.isArray(usersArg) ? usersArg : [ usersArg ] @@ -246,7 +299,7 @@ export class UserService { ) } - unbanUsers (usersArg: User | User[]) { + unbanUsers (usersArg: UserServerModel | UserServerModel[]) { const users = Array.isArray(usersArg) ? usersArg : [ usersArg ] return from(users) @@ -257,7 +310,7 @@ export class UserService { ) } - private formatUser (user: User) { + private formatUser (user: UserServerModel) { let videoQuota if (user.videoQuota === -1) { videoQuota = this.i18n('Unlimited') -- cgit v1.2.3