From 7efe153b0bc23e596d5019b9fb3e3e32b6cfeccd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9as=20Livet?= Date: Tue, 19 Dec 2017 10:45:49 +0100 Subject: Enh #106 : Add an autoPlayVideo user attribute (#159) Warning : I was not able to run the tests on my machine. It uses a different approach to handle databse connexion and didn't find where to configure it... - create a migration file to add a boolean column in user table - add autoPlayVideo attribute everywhere it is needed (both on client and server side) - add tests - add a way to configure this attribute in account-settings - use the attribute in video-watch component to actually autoplay or not the video --- .../account-details/account-details.component.html | 6 ++++++ .../account-settings/account-details/account-details.component.ts | 7 +++++-- .../app/account/account-settings/account-settings.component.html | 2 +- client/src/app/core/auth/auth-user.model.ts | 8 ++++++-- client/src/app/core/auth/auth.service.ts | 4 ++++ client/src/app/shared/users/user.model.ts | 6 ++++++ client/src/app/videos/+video-watch/video-watch.component.ts | 4 ++-- 7 files changed, 30 insertions(+), 7 deletions(-) (limited to 'client') diff --git a/client/src/app/account/account-settings/account-details/account-details.component.html b/client/src/app/account/account-settings/account-details/account-details.component.html index bc18b39b4..593b87e29 100644 --- a/client/src/app/account/account-settings/account-details/account-details.component.html +++ b/client/src/app/account/account-settings/account-details/account-details.component.html @@ -9,6 +9,12 @@
{{ formErrors['displayNSFW'] }}
+
+ + diff --git a/client/src/app/account/account-settings/account-details/account-details.component.ts b/client/src/app/account/account-settings/account-details/account-details.component.ts index d835c53e5..b8c19d8d6 100644 --- a/client/src/app/account/account-settings/account-details/account-details.component.ts +++ b/client/src/app/account/account-settings/account-details/account-details.component.ts @@ -31,7 +31,8 @@ export class AccountDetailsComponent extends FormReactive implements OnInit { buildForm () { this.form = this.formBuilder.group({ - displayNSFW: [ this.user.displayNSFW ] + displayNSFW: [ this.user.displayNSFW ], + autoPlayVideo: [ this.user.autoPlayVideo ] }) this.form.valueChanges.subscribe(data => this.onValueChanged(data)) @@ -43,8 +44,10 @@ export class AccountDetailsComponent extends FormReactive implements OnInit { updateDetails () { const displayNSFW = this.form.value['displayNSFW'] + const autoPlayVideo = this.form.value['autoPlayVideo'] const details: UserUpdateMe = { - displayNSFW + displayNSFW, + autoPlayVideo } this.error = null diff --git a/client/src/app/account/account-settings/account-settings.component.html b/client/src/app/account/account-settings/account-settings.component.html index c0a74cc47..f14eadd49 100644 --- a/client/src/app/account/account-settings/account-settings.component.html +++ b/client/src/app/account/account-settings/account-settings.component.html @@ -11,5 +11,5 @@
Account settings
-
Filtering
+
Videos
diff --git a/client/src/app/core/auth/auth-user.model.ts b/client/src/app/core/auth/auth-user.model.ts index 7b6c8816f..9ad275392 100644 --- a/client/src/app/core/auth/auth-user.model.ts +++ b/client/src/app/core/auth/auth-user.model.ts @@ -69,7 +69,8 @@ export class AuthUser extends User { ROLE: 'role', EMAIL: 'email', USERNAME: 'username', - DISPLAY_NSFW: 'display_nsfw' + DISPLAY_NSFW: 'display_nsfw', + AUTO_PLAY_VIDEO: 'auto_play_video' } tokens: Tokens @@ -83,7 +84,8 @@ export class AuthUser extends User { username: localStorage.getItem(this.KEYS.USERNAME), email: localStorage.getItem(this.KEYS.EMAIL), role: parseInt(localStorage.getItem(this.KEYS.ROLE), 10) as UserRole, - displayNSFW: localStorage.getItem(this.KEYS.DISPLAY_NSFW) === 'true' + displayNSFW: localStorage.getItem(this.KEYS.DISPLAY_NSFW) === 'true', + autoPlayVideo: localStorage.getItem(this.KEYS.AUTO_PLAY_VIDEO) === 'true' }, Tokens.load() ) @@ -97,6 +99,7 @@ export class AuthUser extends User { localStorage.removeItem(this.KEYS.ID) localStorage.removeItem(this.KEYS.ROLE) localStorage.removeItem(this.KEYS.DISPLAY_NSFW) + localStorage.removeItem(this.KEYS.AUTO_PLAY_VIDEO) localStorage.removeItem(this.KEYS.EMAIL) Tokens.flush() } @@ -133,6 +136,7 @@ export class AuthUser extends User { localStorage.setItem(AuthUser.KEYS.EMAIL, this.email) localStorage.setItem(AuthUser.KEYS.ROLE, this.role.toString()) localStorage.setItem(AuthUser.KEYS.DISPLAY_NSFW, JSON.stringify(this.displayNSFW)) + localStorage.setItem(AuthUser.KEYS.AUTO_PLAY_VIDEO, JSON.stringify(this.autoPlayVideo)) this.tokens.save() } } diff --git a/client/src/app/core/auth/auth.service.ts b/client/src/app/core/auth/auth.service.ts index e2b8b6ba5..37264a8ad 100644 --- a/client/src/app/core/auth/auth.service.ts +++ b/client/src/app/core/auth/auth.service.ts @@ -33,6 +33,7 @@ interface UserLoginWithUserInformation extends UserLogin { id: number role: UserRole displayNSFW: boolean + autoPlayVideo: boolean email: string videoQuota: number account: Account @@ -191,6 +192,7 @@ export class AuthService { .subscribe( res => { this.user.displayNSFW = res.displayNSFW + this.user.autoPlayVideo = res.autoPlayVideo this.user.role = res.role this.user.videoChannels = res.videoChannels this.user.account = res.account @@ -212,6 +214,7 @@ export class AuthService { id: res.id, role: res.role, displayNSFW: res.displayNSFW, + autoPlayVideo: res.autoPlayVideo, email: res.email, videoQuota: res.videoQuota, account: res.account, @@ -230,6 +233,7 @@ export class AuthService { role: obj.role, email: obj.email, displayNSFW: obj.displayNSFW, + autoPlayVideo: obj.autoPlayVideo, videoQuota: obj.videoQuota, videoChannels: obj.videoChannels, account: obj.account diff --git a/client/src/app/shared/users/user.model.ts b/client/src/app/shared/users/user.model.ts index b4d13f37c..7a962ae3e 100644 --- a/client/src/app/shared/users/user.model.ts +++ b/client/src/app/shared/users/user.model.ts @@ -8,6 +8,7 @@ export type UserConstructorHash = { role: UserRole, videoQuota?: number, displayNSFW?: boolean, + autoPlayVideo?: boolean, createdAt?: Date, account?: Account, videoChannels?: VideoChannel[] @@ -18,6 +19,7 @@ export class User implements UserServerModel { email: string role: UserRole displayNSFW: boolean + autoPlayVideo: boolean videoQuota: number account: Account videoChannels: VideoChannel[] @@ -42,6 +44,10 @@ export class User implements UserServerModel { this.displayNSFW = hash.displayNSFW } + if (hash.autoPlayVideo !== undefined) { + this.autoPlayVideo = hash.autoPlayVideo + } + if (hash.createdAt !== undefined) { this.createdAt = hash.createdAt } diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts index 5e4823c9c..e35b02f3f 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.ts +++ b/client/src/app/videos/+video-watch/video-watch.component.ts @@ -290,12 +290,12 @@ export class VideoWatchComponent implements OnInit, OnDestroy { const videojsOptions = { controls: true, - autoplay: true, + autoplay: this.user.autoPlayVideo, plugins: { peertube: { videoFiles: this.video.files, playerElement: this.playerElement, - autoplay: true, + autoplay: this.user.autoPlayVideo, peerTubeLink: false } } -- cgit v1.2.3