aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2019-04-05 10:52:27 +0200
committerChocobozzz <me@florianbigard.com>2019-04-05 10:53:09 +0200
commit3a0fb65c61f80b510bce979a45d59d17948745e8 (patch)
treec1be0b2158a008fea826835c8d2fd4e8d648bae9 /client/src/app/videos
parent693263e936763a851e3c8c020e3739def8bd4eca (diff)
downloadPeerTube-3a0fb65c61f80b510bce979a45d59d17948745e8.tar.gz
PeerTube-3a0fb65c61f80b510bce979a45d59d17948745e8.tar.zst
PeerTube-3a0fb65c61f80b510bce979a45d59d17948745e8.zip
Add video miniature dropdown
Diffstat (limited to 'client/src/app/videos')
-rw-r--r--client/src/app/videos/+video-watch/modal/video-blacklist.component.html38
-rw-r--r--client/src/app/videos/+video-watch/modal/video-blacklist.component.scss6
-rw-r--r--client/src/app/videos/+video-watch/modal/video-blacklist.component.ts69
-rw-r--r--client/src/app/videos/+video-watch/modal/video-download.component.html52
-rw-r--r--client/src/app/videos/+video-watch/modal/video-download.component.scss25
-rw-r--r--client/src/app/videos/+video-watch/modal/video-download.component.ts68
-rw-r--r--client/src/app/videos/+video-watch/modal/video-report.component.html36
-rw-r--r--client/src/app/videos/+video-watch/modal/video-report.component.scss10
-rw-r--r--client/src/app/videos/+video-watch/modal/video-report.component.ts80
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.html37
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.scss12
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.ts75
-rw-r--r--client/src/app/videos/+video-watch/video-watch.module.ts8
-rw-r--r--client/src/app/videos/video-list/video-overview.component.html6
14 files changed, 12 insertions, 510 deletions
diff --git a/client/src/app/videos/+video-watch/modal/video-blacklist.component.html b/client/src/app/videos/+video-watch/modal/video-blacklist.component.html
deleted file mode 100644
index 1a87bdcd4..000000000
--- a/client/src/app/videos/+video-watch/modal/video-blacklist.component.html
+++ /dev/null
@@ -1,38 +0,0 @@
1<ng-template #modal>
2 <div class="modal-header">
3 <h4 i18n class="modal-title">Blacklist video</h4>
4 <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
5 </div>
6
7 <div class="modal-body">
8
9 <form novalidate [formGroup]="form" (ngSubmit)="blacklist()">
10 <div class="form-group">
11 <textarea i18n-placeholder placeholder="Reason..." formControlName="reason" [ngClass]="{ 'input-error': formErrors['reason'] }">
12 </textarea>
13 <div *ngIf="formErrors.reason" class="form-error">
14 {{ formErrors.reason }}
15 </div>
16 </div>
17
18 <div class="form-group" *ngIf="video.isLocal">
19 <my-peertube-checkbox
20 inputName="unfederate" formControlName="unfederate"
21 i18n-labelText labelText="Unfederate the video (ask for its deletion from the remote instances)"
22 ></my-peertube-checkbox>
23 </div>
24
25 <div class="form-group inputs">
26 <span i18n class="action-button action-button-cancel" (click)="hide()">
27 Cancel
28 </span>
29
30 <input
31 type="submit" i18n-value value="Submit" class="action-button-submit"
32 [disabled]="!form.valid"
33 >
34 </div>
35 </form>
36
37 </div>
38</ng-template>
diff --git a/client/src/app/videos/+video-watch/modal/video-blacklist.component.scss b/client/src/app/videos/+video-watch/modal/video-blacklist.component.scss
deleted file mode 100644
index afcdb9a16..000000000
--- a/client/src/app/videos/+video-watch/modal/video-blacklist.component.scss
+++ /dev/null
@@ -1,6 +0,0 @@
1@import 'variables';
2@import 'mixins';
3
4textarea {
5 @include peertube-textarea(100%, 100px);
6}
diff --git a/client/src/app/videos/+video-watch/modal/video-blacklist.component.ts b/client/src/app/videos/+video-watch/modal/video-blacklist.component.ts
deleted file mode 100644
index 50a7cadd1..000000000
--- a/client/src/app/videos/+video-watch/modal/video-blacklist.component.ts
+++ /dev/null
@@ -1,69 +0,0 @@
1import { Component, Input, OnInit, ViewChild } from '@angular/core'
2import { Notifier, RedirectService } from '@app/core'
3import { FormReactive, VideoBlacklistService, VideoBlacklistValidatorsService } from '../../../shared/index'
4import { VideoDetails } from '../../../shared/video/video-details.model'
5import { I18n } from '@ngx-translate/i18n-polyfill'
6import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
7import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
8import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
9
10@Component({
11 selector: 'my-video-blacklist',
12 templateUrl: './video-blacklist.component.html',
13 styleUrls: [ './video-blacklist.component.scss' ]
14})
15export class VideoBlacklistComponent extends FormReactive implements OnInit {
16 @Input() video: VideoDetails = null
17
18 @ViewChild('modal') modal: NgbModal
19
20 error: string = null
21
22 private openedModal: NgbModalRef
23
24 constructor (
25 protected formValidatorService: FormValidatorService,
26 private modalService: NgbModal,
27 private videoBlacklistValidatorsService: VideoBlacklistValidatorsService,
28 private videoBlacklistService: VideoBlacklistService,
29 private notifier: Notifier,
30 private redirectService: RedirectService,
31 private i18n: I18n
32 ) {
33 super()
34 }
35
36 ngOnInit () {
37 const defaultValues = { unfederate: 'true' }
38
39 this.buildForm({
40 reason: this.videoBlacklistValidatorsService.VIDEO_BLACKLIST_REASON,
41 unfederate: null
42 }, defaultValues)
43 }
44
45 show () {
46 this.openedModal = this.modalService.open(this.modal, { keyboard: false })
47 }
48
49 hide () {
50 this.openedModal.close()
51 this.openedModal = null
52 }
53
54 blacklist () {
55 const reason = this.form.value[ 'reason' ] || undefined
56 const unfederate = this.video.isLocal ? this.form.value[ 'unfederate' ] : undefined
57
58 this.videoBlacklistService.blacklistVideo(this.video.id, reason, unfederate)
59 .subscribe(
60 () => {
61 this.notifier.success(this.i18n('Video blacklisted.'))
62 this.hide()
63 this.redirectService.redirectToHomepage()
64 },
65
66 err => this.notifier.error(err.message)
67 )
68 }
69}
diff --git a/client/src/app/videos/+video-watch/modal/video-download.component.html b/client/src/app/videos/+video-watch/modal/video-download.component.html
deleted file mode 100644
index 2bb5d6d37..000000000
--- a/client/src/app/videos/+video-watch/modal/video-download.component.html
+++ /dev/null
@@ -1,52 +0,0 @@
1<ng-template #modal let-hide="close">
2 <div class="modal-header">
3 <h4 i18n class="modal-title">Download video</h4>
4 <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
5 </div>
6
7 <div class="modal-body">
8 <div class="form-group">
9 <div class="input-group input-group-sm">
10 <div class="input-group-prepend peertube-select-container">
11 <select [(ngModel)]="resolutionId">
12 <option *ngFor="let file of video.files" [value]="file.resolution.id">{{ file.resolution.label }}</option>
13 </select>
14 </div>
15 <input #urlInput (click)="urlInput.select()" type="text" class="form-control input-sm readonly" readonly [value]="getLink()" />
16 <div class="input-group-append">
17 <button [ngxClipboard]="urlInput" (click)="activateCopiedMessage()" type="button" class="btn btn-outline-secondary">
18 <span class="glyphicon glyphicon-copy"></span>
19 </button>
20 </div>
21 </div>
22 </div>
23
24 <div class="download-type">
25 <div class="peertube-radio-container">
26 <input type="radio" name="download" id="download-direct" [(ngModel)]="downloadType" value="direct">
27 <label i18n for="download-direct">Direct download</label>
28 </div>
29
30 <div class="peertube-radio-container">
31 <input type="radio" name="download" id="download-torrent" [(ngModel)]="downloadType" value="torrent">
32 <label i18n for="download-torrent">Torrent (.torrent file)</label>
33 </div>
34
35 <div class="peertube-radio-container">
36 <input type="radio" name="download" id="download-magnet" [(ngModel)]="downloadType" value="magnet">
37 <label i18n for="download-magnet">Torrent (magnet link)</label>
38 </div>
39 </div>
40 </div>
41
42 <div class="modal-footer inputs">
43 <span i18n class="action-button action-button-cancel" (click)="hide()">
44 Cancel
45 </span>
46
47 <input
48 type="submit" i18n-value value="Download" class="action-button-submit"
49 (click)="download()"
50 >
51 </div>
52</ng-template>
diff --git a/client/src/app/videos/+video-watch/modal/video-download.component.scss b/client/src/app/videos/+video-watch/modal/video-download.component.scss
deleted file mode 100644
index 3e826c3b6..000000000
--- a/client/src/app/videos/+video-watch/modal/video-download.component.scss
+++ /dev/null
@@ -1,25 +0,0 @@
1@import 'variables';
2@import 'mixins';
3
4.peertube-select-container {
5 @include peertube-select-container(100px);
6
7 border-top-right-radius: 0;
8 border-bottom-right-radius: 0;
9 border-right: none;
10
11 select {
12 height: inherit;
13 }
14}
15
16.download-type {
17 margin-top: 30px;
18
19 .peertube-radio-container {
20 @include peertube-radio-container;
21
22 display: inline-block;
23 margin-right: 30px;
24 }
25}
diff --git a/client/src/app/videos/+video-watch/modal/video-download.component.ts b/client/src/app/videos/+video-watch/modal/video-download.component.ts
deleted file mode 100644
index 834385771..000000000
--- a/client/src/app/videos/+video-watch/modal/video-download.component.ts
+++ /dev/null
@@ -1,68 +0,0 @@
1import { Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core'
2import { VideoDetails } from '../../../shared/video/video-details.model'
3import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
4import { I18n } from '@ngx-translate/i18n-polyfill'
5import { Notifier } from '@app/core'
6
7@Component({
8 selector: 'my-video-download',
9 templateUrl: './video-download.component.html',
10 styleUrls: [ './video-download.component.scss' ]
11})
12export class VideoDownloadComponent implements OnInit {
13 @Input() video: VideoDetails = null
14
15 @ViewChild('modal') modal: ElementRef
16
17 downloadType: 'direct' | 'torrent' | 'magnet' = 'torrent'
18 resolutionId: number | string = -1
19
20 constructor (
21 private notifier: Notifier,
22 private modalService: NgbModal,
23 private i18n: I18n
24 ) { }
25
26 ngOnInit () {
27 this.resolutionId = this.video.files[0].resolution.id
28 }
29
30 show () {
31 this.modalService.open(this.modal)
32 }
33
34 download () {
35 window.location.assign(this.getLink())
36 }
37
38 getLink () {
39 // HTML select send us a string, so convert it to a number
40 this.resolutionId = parseInt(this.resolutionId.toString(), 10)
41
42 const file = this.video.files.find(f => f.resolution.id === this.resolutionId)
43 if (!file) {
44 console.error('Could not find file with resolution %d.', this.resolutionId)
45 return
46 }
47
48 const link = (() => {
49 switch (this.downloadType) {
50 case 'direct': {
51 return file.fileDownloadUrl
52 }
53 case 'torrent': {
54 return file.torrentDownloadUrl
55 }
56 case 'magnet': {
57 return file.magnetUri
58 }
59 }
60 })()
61
62 return link
63 }
64
65 activateCopiedMessage () {
66 this.notifier.success(this.i18n('Copied'))
67 }
68}
diff --git a/client/src/app/videos/+video-watch/modal/video-report.component.html b/client/src/app/videos/+video-watch/modal/video-report.component.html
deleted file mode 100644
index b9434da26..000000000
--- a/client/src/app/videos/+video-watch/modal/video-report.component.html
+++ /dev/null
@@ -1,36 +0,0 @@
1<ng-template #modal>
2 <div class="modal-header">
3 <h4 i18n class="modal-title">Report video</h4>
4 <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
5 </div>
6
7 <div class="modal-body">
8
9 <div i18n class="information">
10 Your report will be sent to moderators of {{ currentHost }}.
11 <ng-container *ngIf="isRemoteVideo()"> It will be forwarded to origin instance {{ originHost }} too.</ng-container>
12 </div>
13
14 <form novalidate [formGroup]="form" (ngSubmit)="report()">
15 <div class="form-group">
16 <textarea i18n-placeholder placeholder="Reason..." formControlName="reason" [ngClass]="{ 'input-error': formErrors['reason'] }">
17 </textarea>
18 <div *ngIf="formErrors.reason" class="form-error">
19 {{ formErrors.reason }}
20 </div>
21 </div>
22
23 <div class="form-group inputs">
24 <span i18n class="action-button action-button-cancel" (click)="hide()">
25 Cancel
26 </span>
27
28 <input
29 type="submit" i18n-value value="Submit" class="action-button-submit"
30 [disabled]="!form.valid"
31 >
32 </div>
33 </form>
34
35 </div>
36</ng-template>
diff --git a/client/src/app/videos/+video-watch/modal/video-report.component.scss b/client/src/app/videos/+video-watch/modal/video-report.component.scss
deleted file mode 100644
index 4713660a2..000000000
--- a/client/src/app/videos/+video-watch/modal/video-report.component.scss
+++ /dev/null
@@ -1,10 +0,0 @@
1@import 'variables';
2@import 'mixins';
3
4.information {
5 margin-bottom: 20px;
6}
7
8textarea {
9 @include peertube-textarea(100%, 100px);
10}
diff --git a/client/src/app/videos/+video-watch/modal/video-report.component.ts b/client/src/app/videos/+video-watch/modal/video-report.component.ts
deleted file mode 100644
index 911f3b447..000000000
--- a/client/src/app/videos/+video-watch/modal/video-report.component.ts
+++ /dev/null
@@ -1,80 +0,0 @@
1import { Component, Input, OnInit, ViewChild } from '@angular/core'
2import { Notifier } from '@app/core'
3import { FormReactive, VideoAbuseService } from '../../../shared/index'
4import { VideoDetails } from '../../../shared/video/video-details.model'
5import { I18n } from '@ngx-translate/i18n-polyfill'
6import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
7import { VideoAbuseValidatorsService } from '@app/shared/forms/form-validators/video-abuse-validators.service'
8import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
9import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
10
11@Component({
12 selector: 'my-video-report',
13 templateUrl: './video-report.component.html',
14 styleUrls: [ './video-report.component.scss' ]
15})
16export class VideoReportComponent extends FormReactive implements OnInit {
17 @Input() video: VideoDetails = null
18
19 @ViewChild('modal') modal: NgbModal
20
21 error: string = null
22
23 private openedModal: NgbModalRef
24
25 constructor (
26 protected formValidatorService: FormValidatorService,
27 private modalService: NgbModal,
28 private videoAbuseValidatorsService: VideoAbuseValidatorsService,
29 private videoAbuseService: VideoAbuseService,
30 private notifier: Notifier,
31 private i18n: I18n
32 ) {
33 super()
34 }
35
36 get currentHost () {
37 return window.location.host
38 }
39
40 get originHost () {
41 if (this.isRemoteVideo()) {
42 return this.video.account.host
43 }
44
45 return ''
46 }
47
48 ngOnInit () {
49 this.buildForm({
50 reason: this.videoAbuseValidatorsService.VIDEO_ABUSE_REASON
51 })
52 }
53
54 show () {
55 this.openedModal = this.modalService.open(this.modal, { keyboard: false })
56 }
57
58 hide () {
59 this.openedModal.close()
60 this.openedModal = null
61 }
62
63 report () {
64 const reason = this.form.value['reason']
65
66 this.videoAbuseService.reportVideo(this.video.id, reason)
67 .subscribe(
68 () => {
69 this.notifier.success(this.i18n('Video reported.'))
70 this.hide()
71 },
72
73 err => this.notifier.error(err.message)
74 )
75 }
76
77 isRemoteVideo () {
78 return !this.video.isLocal
79 }
80}
diff --git a/client/src/app/videos/+video-watch/video-watch.component.html b/client/src/app/videos/+video-watch/video-watch.component.html
index ad1d04b70..7755a729a 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.html
+++ b/client/src/app/videos/+video-watch/video-watch.component.html
@@ -120,37 +120,9 @@
120 </div> 120 </div>
121 </div> 121 </div>
122 122
123 <div class="action-dropdown" ngbDropdown placement="top" role="button"> 123 <my-video-actions-dropdown
124 <div class="action-button" ngbDropdownToggle role="button"> 124 placement="top" buttonDirection="horizontal" [buttonStyled]="true" [video]="video" (videoRemoved)="onVideoRemoved()"
125 <my-global-icon class="more-icon" iconName="more-horizontal"></my-global-icon> 125 ></my-video-actions-dropdown>
126 </div>
127
128 <div ngbDropdownMenu>
129 <a *ngIf="isVideoDownloadable()" class="dropdown-item" i18n-title title="Download the video" href="#" (click)="showDownloadModal($event)">
130 <my-global-icon iconName="download"></my-global-icon> <ng-container i18n>Download</ng-container>
131 </a>
132
133 <a *ngIf="isUserLoggedIn()" class="dropdown-item" i18n-title title="Report this video" href="#" (click)="showReportModal($event)">
134 <my-global-icon iconName="alert"></my-global-icon> <ng-container i18n>Report</ng-container>
135 </a>
136
137 <a *ngIf="isVideoUpdatable()" class="dropdown-item" i18n-title title="Update this video" href="#" [routerLink]="[ '/videos/update', video.uuid ]">
138 <my-global-icon iconName="edit"></my-global-icon> <ng-container i18n>Update</ng-container>
139 </a>
140
141 <a *ngIf="isVideoBlacklistable()" class="dropdown-item" i18n-title title="Blacklist this video" href="#" (click)="showBlacklistModal($event)">
142 <my-global-icon iconName="no"></my-global-icon> <ng-container i18n>Blacklist</ng-container>
143 </a>
144
145 <a *ngIf="isVideoUnblacklistable()" class="dropdown-item" i18n-title title="Unblacklist this video" href="#" (click)="unblacklistVideo($event)">
146 <my-global-icon iconName="undo"></my-global-icon> <ng-container i18n>Unblacklist</ng-container>
147 </a>
148
149 <a *ngIf="isVideoRemovable()" class="dropdown-item" i18n-title title="Delete this video" href="#" (click)="removeVideo($event)">
150 <my-global-icon iconName="delete"></my-global-icon> <ng-container i18n>Delete</ng-container>
151 </a>
152 </div>
153 </div>
154 </div> 126 </div>
155 127
156 <div 128 <div
@@ -270,7 +242,4 @@
270<ng-template [ngIf]="video !== null"> 242<ng-template [ngIf]="video !== null">
271 <my-video-support #videoSupportModal [video]="video"></my-video-support> 243 <my-video-support #videoSupportModal [video]="video"></my-video-support>
272 <my-video-share #videoShareModal [video]="video"></my-video-share> 244 <my-video-share #videoShareModal [video]="video"></my-video-share>
273 <my-video-download #videoDownloadModal [video]="video"></my-video-download>
274 <my-video-report #videoReportModal [video]="video"></my-video-report>
275 <my-video-blacklist #videoBlacklistModal [video]="video"></my-video-blacklist>
276</ng-template> 245</ng-template>
diff --git a/client/src/app/videos/+video-watch/video-watch.component.scss b/client/src/app/videos/+video-watch/video-watch.component.scss
index 2874847cd..c1eaf9b2b 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.scss
+++ b/client/src/app/videos/+video-watch/video-watch.component.scss
@@ -257,7 +257,9 @@ $player-factor: 1.7; // 16/9
257 display: flex; 257 display: flex;
258 align-items: center; 258 align-items: center;
259 259
260 .action-button:not(:first-child), .action-dropdown { 260 .action-button:not(:first-child),
261 .action-dropdown,
262 my-video-actions-dropdown {
261 margin-left: 10px; 263 margin-left: 10px;
262 } 264 }
263 265
@@ -304,14 +306,6 @@ $player-factor: 1.7; // 16/9
304 margin-left: 3px; 306 margin-left: 3px;
305 } 307 }
306 } 308 }
307
308 .action-dropdown {
309 display: inline-block;
310
311 .dropdown-menu .dropdown-item {
312 @include dropdown-with-icon-item;
313 }
314 }
315 } 309 }
316 310
317 .video-info-likes-dislikes-bar { 311 .video-info-likes-dislikes-bar {
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 cedbbf985..53673d9d9 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/videos/+video-watch/video-watch.component.ts
@@ -13,10 +13,7 @@ import { AuthService, ConfirmService } from '../../core'
13import { RestExtractor, VideoBlacklistService } from '../../shared' 13import { RestExtractor, VideoBlacklistService } from '../../shared'
14import { VideoDetails } from '../../shared/video/video-details.model' 14import { VideoDetails } from '../../shared/video/video-details.model'
15import { VideoService } from '../../shared/video/video.service' 15import { VideoService } from '../../shared/video/video.service'
16import { VideoDownloadComponent } from './modal/video-download.component'
17import { VideoReportComponent } from './modal/video-report.component'
18import { VideoShareComponent } from './modal/video-share.component' 16import { VideoShareComponent } from './modal/video-share.component'
19import { VideoBlacklistComponent } from './modal/video-blacklist.component'
20import { SubscribeButtonComponent } from '@app/shared/user-subscription/subscribe-button.component' 17import { SubscribeButtonComponent } from '@app/shared/user-subscription/subscribe-button.component'
21import { I18n } from '@ngx-translate/i18n-polyfill' 18import { I18n } from '@ngx-translate/i18n-polyfill'
22import { environment } from '../../../environments/environment' 19import { environment } from '../../../environments/environment'
@@ -32,6 +29,7 @@ import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model'
32import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service' 29import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
33import { ComponentPagination } from '@app/shared/rest/component-pagination.model' 30import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
34import { Video } from '@app/shared/video/video.model' 31import { Video } from '@app/shared/video/video.model'
32import { VideoActionsDisplayType } from '@app/shared/video/video-actions-dropdown.component'
35 33
36@Component({ 34@Component({
37 selector: 'my-video-watch', 35 selector: 'my-video-watch',
@@ -41,11 +39,8 @@ import { Video } from '@app/shared/video/video.model'
41export class VideoWatchComponent implements OnInit, OnDestroy { 39export class VideoWatchComponent implements OnInit, OnDestroy {
42 private static LOCAL_STORAGE_PRIVACY_CONCERN_KEY = 'video-watch-privacy-concern' 40 private static LOCAL_STORAGE_PRIVACY_CONCERN_KEY = 'video-watch-privacy-concern'
43 41
44 @ViewChild('videoDownloadModal') videoDownloadModal: VideoDownloadComponent
45 @ViewChild('videoShareModal') videoShareModal: VideoShareComponent 42 @ViewChild('videoShareModal') videoShareModal: VideoShareComponent
46 @ViewChild('videoReportModal') videoReportModal: VideoReportComponent
47 @ViewChild('videoSupportModal') videoSupportModal: VideoSupportComponent 43 @ViewChild('videoSupportModal') videoSupportModal: VideoSupportComponent
48 @ViewChild('videoBlacklistModal') videoBlacklistModal: VideoBlacklistComponent
49 @ViewChild('subscribeButton') subscribeButton: SubscribeButtonComponent 44 @ViewChild('subscribeButton') subscribeButton: SubscribeButtonComponent
50 45
51 player: any 46 player: any
@@ -212,11 +207,6 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
212 ) 207 )
213 } 208 }
214 209
215 showReportModal (event: Event) {
216 event.preventDefault()
217 this.videoReportModal.show()
218 }
219
220 showSupportModal () { 210 showSupportModal () {
221 this.videoSupportModal.show() 211 this.videoSupportModal.show()
222 } 212 }
@@ -225,54 +215,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
225 this.videoShareModal.show(this.currentTime) 215 this.videoShareModal.show(this.currentTime)
226 } 216 }
227 217
228 showDownloadModal (event: Event) {
229 event.preventDefault()
230 this.videoDownloadModal.show()
231 }
232
233 showBlacklistModal (event: Event) {
234 event.preventDefault()
235 this.videoBlacklistModal.show()
236 }
237
238 async unblacklistVideo (event: Event) {
239 event.preventDefault()
240
241 const confirmMessage = this.i18n(
242 'Do you really want to remove this video from the blacklist? It will be available again in the videos list.'
243 )
244
245 const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblacklist'))
246 if (res === false) return
247
248 this.videoBlacklistService.removeVideoFromBlacklist(this.video.id).subscribe(
249 () => {
250 this.notifier.success(this.i18n('Video {{name}} removed from the blacklist.', { name: this.video.name }))
251
252 this.video.blacklisted = false
253 this.video.blacklistedReason = null
254 },
255
256 err => this.notifier.error(err.message)
257 )
258 }
259
260 isUserLoggedIn () { 218 isUserLoggedIn () {
261 return this.authService.isLoggedIn() 219 return this.authService.isLoggedIn()
262 } 220 }
263 221
264 isVideoUpdatable () {
265 return this.video.isUpdatableBy(this.authService.getUser())
266 }
267
268 isVideoBlacklistable () {
269 return this.video.isBlackistableBy(this.user)
270 }
271
272 isVideoUnblacklistable () {
273 return this.video.isUnblacklistableBy(this.user)
274 }
275
276 getVideoTags () { 222 getVideoTags () {
277 if (!this.video || Array.isArray(this.video.tags) === false) return [] 223 if (!this.video || Array.isArray(this.video.tags) === false) return []
278 224
@@ -283,23 +229,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
283 return this.video.isRemovableBy(this.authService.getUser()) 229 return this.video.isRemovableBy(this.authService.getUser())
284 } 230 }
285 231
286 async removeVideo (event: Event) { 232 onVideoRemoved () {
287 event.preventDefault() 233 this.redirectService.redirectToHomepage()
288
289 const res = await this.confirmService.confirm(this.i18n('Do you really want to delete this video?'), this.i18n('Delete'))
290 if (res === false) return
291
292 this.videoService.removeVideo(this.video.id)
293 .subscribe(
294 () => {
295 this.notifier.success(this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name }))
296
297 // Go back to the video-list.
298 this.redirectService.redirectToHomepage()
299 },
300
301 error => this.notifier.error(error.message)
302 )
303 } 234 }
304 235
305 acceptedPrivacyConcern () { 236 acceptedPrivacyConcern () {
diff --git a/client/src/app/videos/+video-watch/video-watch.module.ts b/client/src/app/videos/+video-watch/video-watch.module.ts
index 2f448db78..983350f52 100644
--- a/client/src/app/videos/+video-watch/video-watch.module.ts
+++ b/client/src/app/videos/+video-watch/video-watch.module.ts
@@ -1,26 +1,21 @@
1import { NgModule } from '@angular/core' 1import { NgModule } from '@angular/core'
2import { VideoSupportComponent } from '@app/videos/+video-watch/modal/video-support.component' 2import { VideoSupportComponent } from '@app/videos/+video-watch/modal/video-support.component'
3import { ClipboardModule } from 'ngx-clipboard'
4import { SharedModule } from '../../shared' 3import { SharedModule } from '../../shared'
5import { VideoCommentAddComponent } from './comment/video-comment-add.component' 4import { VideoCommentAddComponent } from './comment/video-comment-add.component'
6import { VideoCommentComponent } from './comment/video-comment.component' 5import { VideoCommentComponent } from './comment/video-comment.component'
7import { VideoCommentService } from './comment/video-comment.service' 6import { VideoCommentService } from './comment/video-comment.service'
8import { VideoCommentsComponent } from './comment/video-comments.component' 7import { VideoCommentsComponent } from './comment/video-comments.component'
9import { VideoDownloadComponent } from './modal/video-download.component'
10import { VideoReportComponent } from './modal/video-report.component'
11import { VideoShareComponent } from './modal/video-share.component' 8import { VideoShareComponent } from './modal/video-share.component'
12import { VideoWatchRoutingModule } from './video-watch-routing.module' 9import { VideoWatchRoutingModule } from './video-watch-routing.module'
13import { VideoWatchComponent } from './video-watch.component' 10import { VideoWatchComponent } from './video-watch.component'
14import { NgxQRCodeModule } from 'ngx-qrcode2' 11import { NgxQRCodeModule } from 'ngx-qrcode2'
15import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap' 12import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap'
16import { VideoBlacklistComponent } from '@app/videos/+video-watch/modal/video-blacklist.component'
17import { RecommendationsModule } from '@app/videos/recommendations/recommendations.module' 13import { RecommendationsModule } from '@app/videos/recommendations/recommendations.module'
18 14
19@NgModule({ 15@NgModule({
20 imports: [ 16 imports: [
21 VideoWatchRoutingModule, 17 VideoWatchRoutingModule,
22 SharedModule, 18 SharedModule,
23 ClipboardModule,
24 NgbTooltipModule, 19 NgbTooltipModule,
25 NgxQRCodeModule, 20 NgxQRCodeModule,
26 RecommendationsModule 21 RecommendationsModule
@@ -29,10 +24,7 @@ import { RecommendationsModule } from '@app/videos/recommendations/recommendatio
29 declarations: [ 24 declarations: [
30 VideoWatchComponent, 25 VideoWatchComponent,
31 26
32 VideoDownloadComponent,
33 VideoShareComponent, 27 VideoShareComponent,
34 VideoReportComponent,
35 VideoBlacklistComponent,
36 VideoSupportComponent, 28 VideoSupportComponent,
37 VideoCommentsComponent, 29 VideoCommentsComponent,
38 VideoCommentAddComponent, 30 VideoCommentAddComponent,
diff --git a/client/src/app/videos/video-list/video-overview.component.html b/client/src/app/videos/video-list/video-overview.component.html
index cb26592e3..b644dd798 100644
--- a/client/src/app/videos/video-list/video-overview.component.html
+++ b/client/src/app/videos/video-list/video-overview.component.html
@@ -7,7 +7,7 @@
7 <a routerLink="/search" [queryParams]="{ categoryOneOf: [ object.category.id ] }">{{ object.category.label }}</a> 7 <a routerLink="/search" [queryParams]="{ categoryOneOf: [ object.category.id ] }">{{ object.category.label }}</a>
8 </div> 8 </div>
9 9
10 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user"></my-video-miniature> 10 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user" [displayVideoActions]="false"></my-video-miniature>
11 </div> 11 </div>
12 12
13 <div class="section" *ngFor="let object of overview.tags"> 13 <div class="section" *ngFor="let object of overview.tags">
@@ -15,7 +15,7 @@
15 <a routerLink="/search" [queryParams]="{ tagsOneOf: [ object.tag ] }">#{{ object.tag }}</a> 15 <a routerLink="/search" [queryParams]="{ tagsOneOf: [ object.tag ] }">#{{ object.tag }}</a>
16 </div> 16 </div>
17 17
18 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user"></my-video-miniature> 18 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user" [displayVideoActions]="false"></my-video-miniature>
19 </div> 19 </div>
20 20
21 <div class="section channel" *ngFor="let object of overview.channels"> 21 <div class="section channel" *ngFor="let object of overview.channels">
@@ -27,7 +27,7 @@
27 </a> 27 </a>
28 </div> 28 </div>
29 29
30 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user"></my-video-miniature> 30 <my-video-miniature *ngFor="let video of object.videos" [video]="video" [user]="user" [displayVideoActions]="false"></my-video-miniature>
31 </div> 31 </div>
32 32
33</div> 33</div>