8 files changed, 42 insertions, 51 deletions

diff --git a/client/src/app/shared/misc/help.component.html b/client/src/app/shared/misc/help.component.html
index e37d93b62..3da5701a0 100644
--- a/client/src/app/shared/misc/help.component.html
+++ b/client/src/app/shared/misc/help.component.html
@@ -13,6 +13,9 @@
 </ng-template>
 
 <span
-  class="help-tooltip-button" containerClass="help-tooltip" title="Click to get help"
-  #tooltipDirective="bs-tooltip" [tooltip]="tooltipTemplate" triggers="click"
+  class="help-tooltip-button"
+  title="Get help"
+  [popover]="tooltipTemplate"
+  [placement]="tooltipPlacement"
+  [outsideClick]="true"
 ></span>
diff --git a/client/src/app/shared/misc/help.component.scss b/client/src/app/shared/misc/help.component.scss
index b8bf3a7a5..0df8b86fa 100644
--- a/client/src/app/shared/misc/help.component.scss
+++ b/client/src/app/shared/misc/help.component.scss
@@ -12,20 +12,16 @@
 }
 
 /deep/ {
-  .help-tooltip {
-    opacity: 1 !important;
+  .popover-body {
+    text-align: left;
+    padding: 10px;
+    max-width: 300px;
 
-    .tooltip-inner {
-      text-align: left;
-      padding: 10px;
-      max-width: 300px;
-
-      font-size: 13px;
-      font-family: $main-fonts;
-      background-color: #fff;
-      color: #000;
-      box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
-    }
+    font-size: 13px;
+    font-family: $main-fonts;
+    background-color: #fff;
+    color: #000;
+    box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
 
     ul {
       padding-left: 20px;
diff --git a/client/src/app/shared/misc/help.component.ts b/client/src/app/shared/misc/help.component.ts
index 89dd1dae5..0373a63de 100644
--- a/client/src/app/shared/misc/help.component.ts
+++ b/client/src/app/shared/misc/help.component.ts
@@ -1,6 +1,5 @@
-import { Component, ElementRef, HostListener, Input, OnInit, ViewChild, OnChanges } from '@angular/core'
+import { Component, Input, OnChanges, OnInit } from '@angular/core'
 import { MarkdownService } from '@app/videos/shared'
-import { TooltipDirective } from 'ngx-bootstrap/tooltip'
 
 @Component({
   selector: 'my-help',
@@ -9,16 +8,14 @@ import { TooltipDirective } from 'ngx-bootstrap/tooltip'
 })
 
 export class HelpComponent implements OnInit, OnChanges {
-  @ViewChild('tooltipDirective') tooltipDirective: TooltipDirective
   @Input() preHtml = ''
   @Input() postHtml = ''
   @Input() customHtml = ''
   @Input() helpType: 'custom' | 'markdownText' | 'markdownEnhanced' = 'custom'
+  @Input() tooltipPlacement = 'right'
 
   mainHtml = ''
 
-  constructor (private elementRef: ElementRef) { }
-
   ngOnInit () {
     this.init()
   }
@@ -27,15 +24,6 @@ export class HelpComponent implements OnInit, OnChanges {
     this.init()
   }
 
-  @HostListener('document:click', ['$event.target'])
-  public onClick (targetElement) {
-    const clickedInside = this.elementRef.nativeElement.contains(targetElement)
-
-    if (this.tooltipDirective.isOpen && !clickedInside) {
-      this.tooltipDirective.hide()
-    }
-  }
-
   private init () {
     if (this.helpType === 'custom') {
       this.mainHtml = this.customHtml
diff --git a/client/src/app/shared/users/user.model.ts b/client/src/app/shared/users/user.model.ts
index 4a94b032d..2bdc48a1d 100644
--- a/client/src/app/shared/users/user.model.ts
+++ b/client/src/app/shared/users/user.model.ts
@@ -1,5 +1,6 @@
 import { hasUserRight, User as UserServerModel, UserRight, UserRole, VideoChannel } from '../../../../../shared'
 import { Account } from '../account/account.model'
+import { NSFWPolicyType } from '../../../../../shared/models/videos/nsfw-policy.type'
 
 export type UserConstructorHash = {
   id: number,
@@ -7,7 +8,7 @@ export type UserConstructorHash = {
   email: string,
   role: UserRole,
   videoQuota?: number,
-  displayNSFW?: boolean,
+  nsfwPolicy?: NSFWPolicyType,
   autoPlayVideo?: boolean,
   createdAt?: Date,
   account?: Account,
@@ -18,7 +19,7 @@ export class User implements UserServerModel {
   username: string
   email: string
   role: UserRole
-  displayNSFW: boolean
+  nsfwPolicy: NSFWPolicyType
   autoPlayVideo: boolean
   videoQuota: number
   account: Account
@@ -40,8 +41,8 @@ export class User implements UserServerModel {
       this.videoQuota = hash.videoQuota
     }
 
-    if (hash.displayNSFW !== undefined) {
-      this.displayNSFW = hash.displayNSFW
+    if (hash.nsfwPolicy !== undefined) {
+      this.nsfwPolicy = hash.nsfwPolicy
     }
 
     if (hash.autoPlayVideo !== undefined) {
diff --git a/client/src/app/shared/video/video-details.model.ts b/client/src/app/shared/video/video-details.model.ts
index a1f7207a2..5397aa37f 100644
--- a/client/src/app/shared/video/video-details.model.ts
+++ b/client/src/app/shared/video/video-details.model.ts
@@ -1,17 +1,9 @@
-import {
-  UserRight,
-  VideoChannel,
-  VideoDetails as VideoDetailsServerModel,
-  VideoFile,
-  VideoPrivacy
-} from '../../../../../shared'
+import { UserRight, VideoChannel, VideoDetails as VideoDetailsServerModel, VideoFile } from '../../../../../shared'
 import { Account } from '../../../../../shared/models/actors'
-import { VideoConstant } from '../../../../../shared/models/videos/video.model'
 import { AuthUser } from '../../core'
 import { Video } from '../../shared/video/video.model'
 
 export class VideoDetails extends Video implements VideoDetailsServerModel {
-  privacy: VideoConstant<VideoPrivacy>
   descriptionPath: string
   support: string
   channel: VideoChannel
@@ -26,7 +18,6 @@ export class VideoDetails extends Video implements VideoDetailsServerModel {
   constructor (hash: VideoDetailsServerModel) {
     super(hash)
 
-    this.privacy = hash.privacy
     this.descriptionPath = hash.descriptionPath
     this.files = hash.files
     this.channel = hash.channel
diff --git a/client/src/app/shared/video/video-miniature.component.html b/client/src/app/shared/video/video-miniature.component.html
index f28e9b8d9..233432142 100644
--- a/client/src/app/shared/video/video-miniature.component.html
+++ b/client/src/app/shared/video/video-miniature.component.html
@@ -1,11 +1,11 @@
 <div class="video-miniature">
-  <my-video-thumbnail [video]="video" [nsfw]="isVideoNSFWForThisUser()"></my-video-thumbnail>
+  <my-video-thumbnail [video]="video" [nsfw]="isVideoBlur()"></my-video-thumbnail>
 
   <div class="video-miniature-information">
     <span class="video-miniature-name">
       <a
         class="video-miniature-name"
-        [routerLink]="['/videos/watch', video.uuid]" [attr.title]="video.name" [ngClass]="{ 'blur-filter': isVideoNSFWForThisUser() }"
+        [routerLink]="['/videos/watch', video.uuid]" [attr.title]="video.name" [ngClass]="{ 'blur-filter': isVideoBlur() }"
       >
           {{ video.name }}
       </a>
diff --git a/client/src/app/shared/video/video-miniature.component.ts b/client/src/app/shared/video/video-miniature.component.ts
index 4d79a74bb..d3f6dc1f6 100644
--- a/client/src/app/shared/video/video-miniature.component.ts
+++ b/client/src/app/shared/video/video-miniature.component.ts
@@ -1,6 +1,7 @@
 import { Component, Input } from '@angular/core'
 import { User } from '../users'
 import { Video } from './video.model'
+import { ServerService } from '@app/core'
 
 @Component({
   selector: 'my-video-miniature',
@@ -11,7 +12,9 @@ export class VideoMiniatureComponent {
   @Input() user: User
   @Input() video: Video
 
-  isVideoNSFWForThisUser () {
-    return this.video.isVideoNSFWForUser(this.user)
+  constructor (private serverService: ServerService) { }
+
+  isVideoBlur () {
+    return this.video.isVideoNSFWForUser(this.user, this.serverService.getConfig())
   }
 }
diff --git a/client/src/app/shared/video/video.model.ts b/client/src/app/shared/video/video.model.ts
index 0c02cbcb9..e25c172e0 100644
--- a/client/src/app/shared/video/video.model.ts
+++ b/client/src/app/shared/video/video.model.ts
@@ -1,9 +1,10 @@
 import { Account } from '@app/shared/account/account.model'
 import { User } from '../'
-import { Video as VideoServerModel } from '../../../../../shared'
+import { Video as VideoServerModel, VideoPrivacy } from '../../../../../shared'
 import { Avatar } from '../../../../../shared/models/avatars/avatar.model'
 import { VideoConstant } from '../../../../../shared/models/videos/video.model'
 import { getAbsoluteAPIUrl } from '../misc/utils'
+import { ServerConfig } from '../../../../../shared/models'
 
 export class Video implements VideoServerModel {
   by: string
@@ -13,6 +14,7 @@ export class Video implements VideoServerModel {
   category: VideoConstant<number>
   licence: VideoConstant<number>
   language: VideoConstant<number>
+  privacy: VideoConstant<VideoPrivacy>
   description: string
   duration: number
   durationLabel: string
@@ -61,6 +63,7 @@ export class Video implements VideoServerModel {
     this.category = hash.category
     this.licence = hash.licence
     this.language = hash.language
+    this.privacy = hash.privacy
     this.description = hash.description
     this.duration = hash.duration
     this.durationLabel = Video.createDurationString(hash.duration)
@@ -83,8 +86,14 @@ export class Video implements VideoServerModel {
     this.by = Account.CREATE_BY_STRING(hash.account.name, hash.account.host)
   }
 
-  isVideoNSFWForUser (user: User) {
-    // If the video is NSFW and the user is not logged in, or the user does not want to display NSFW videos...
-    return (this.nsfw && (!user || user.displayNSFW === false))
+  isVideoNSFWForUser (user: User, serverConfig: ServerConfig) {
+    // Video is not NSFW, skip
+    if (this.nsfw === false) return false
+
+    // Return user setting if logged in
+    if (user) return user.nsfwPolicy !== 'display'
+
+    // Return default instance config
+    return serverConfig.instance.defaultNSFWPolicy !== 'display'
   }
 }