diff options
author | Chocobozzz <me@florianbigard.com> | 2018-08-13 16:57:13 +0200 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2018-08-14 09:27:18 +0200 |
commit | 26b7305a232e547709f433a6edf700bf495935d8 (patch) | |
tree | b5676090c61df72f864735bcc881d5ee256cffbd /client | |
parent | efc9e8450a8bbeeef9cd18e3ad6037abc0f815c3 (diff) | |
download | PeerTube-26b7305a232e547709f433a6edf700bf495935d8.tar.gz PeerTube-26b7305a232e547709f433a6edf700bf495935d8.tar.zst PeerTube-26b7305a232e547709f433a6edf700bf495935d8.zip |
Add blacklist reason field
Diffstat (limited to 'client')
17 files changed, 211 insertions, 48 deletions
diff --git a/client/src/app/+admin/video-abuses/video-abuse-list/video-abuse-list.component.html b/client/src/app/+admin/video-abuses/video-abuse-list/video-abuse-list.component.html index 08501d872..aa0e18c70 100644 --- a/client/src/app/+admin/video-abuses/video-abuse-list/video-abuse-list.component.html +++ b/client/src/app/+admin/video-abuses/video-abuse-list/video-abuse-list.component.html | |||
@@ -9,7 +9,7 @@ | |||
9 | <ng-template pTemplate="header"> | 9 | <ng-template pTemplate="header"> |
10 | <tr> | 10 | <tr> |
11 | <th style="width: 40px"></th> | 11 | <th style="width: 40px"></th> |
12 | <th i18n style="width: 80px;">State</th> | 12 | <th i18n pSortableColumn="state" style="width: 80px;">State <p-sortIcon field="state"></p-sortIcon></th> |
13 | <th i18n>Reason</th> | 13 | <th i18n>Reason</th> |
14 | <th i18n>Reporter</th> | 14 | <th i18n>Reporter</th> |
15 | <th i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th> | 15 | <th i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th> |
diff --git a/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.html b/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.html index 04f0e3b5c..78989dc58 100644 --- a/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.html +++ b/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.html | |||
@@ -4,30 +4,43 @@ | |||
4 | 4 | ||
5 | <p-table | 5 | <p-table |
6 | [value]="blacklist" [lazy]="true" [paginator]="true" [totalRecords]="totalRecords" [rows]="rowsPerPage" | 6 | [value]="blacklist" [lazy]="true" [paginator]="true" [totalRecords]="totalRecords" [rows]="rowsPerPage" |
7 | [sortField]="sort.field" [sortOrder]="sort.order" (onLazyLoad)="loadLazy($event)" | 7 | [sortField]="sort.field" [sortOrder]="sort.order" (onLazyLoad)="loadLazy($event)" dataKey="id" |
8 | > | 8 | > |
9 | <ng-template pTemplate="header"> | 9 | <ng-template pTemplate="header"> |
10 | <tr> | 10 | <tr> |
11 | <th i18n pSortableColumn="name">Name <p-sortIcon field="name"></p-sortIcon></th> | 11 | <th style="width: 40px"></th> |
12 | <th i18n>Description</th> | 12 | <th i18n pSortableColumn="name">Video name <p-sortIcon field="name"></p-sortIcon></th> |
13 | <th i18n pSortableColumn="views">Views <p-sortIcon field="views"></p-sortIcon></th> | ||
14 | <th i18n>NSFW</th> | 13 | <th i18n>NSFW</th> |
15 | <th i18n>UUID</th> | 14 | <th i18n>UUID</th> |
16 | <th i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th> | 15 | <th i18n pSortableColumn="createdAt">Date <p-sortIcon field="createdAt"></p-sortIcon></th> |
17 | <th></th> | 16 | <th style="width: 50px;"></th> |
18 | </tr> | 17 | </tr> |
19 | </ng-template> | 18 | </ng-template> |
20 | 19 | ||
21 | <ng-template pTemplate="body" let-videoBlacklist> | 20 | <ng-template pTemplate="body" let-videoBlacklist let-expanded="expanded"> |
22 | <tr> | 21 | <tr> |
23 | <td>{{ videoBlacklist.name }}</td> | 22 | <td> |
24 | <td>{{ videoBlacklist.description }}</td> | 23 | <span *ngIf="videoBlacklist.reason" class="expander" [pRowToggler]="videoBlacklist"> |
25 | <td>{{ videoBlacklist.views }}</td> | 24 | <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i> |
26 | <td>{{ videoBlacklist.nsfw }}</td> | 25 | </span> |
27 | <td>{{ videoBlacklist.uuid }}</td> | 26 | </td> |
27 | |||
28 | <td>{{ videoBlacklist.video.name }}</td> | ||
29 | <td>{{ videoBlacklist.video.nsfw }}</td> | ||
30 | <td>{{ videoBlacklist.video.uuid }}</td> | ||
28 | <td>{{ videoBlacklist.createdAt }}</td> | 31 | <td>{{ videoBlacklist.createdAt }}</td> |
32 | |||
29 | <td class="action-cell"> | 33 | <td class="action-cell"> |
30 | <my-delete-button i18n-label label="Unblacklist" (click)="removeVideoFromBlacklist(videoBlacklist)"></my-delete-button> | 34 | <my-action-dropdown i18n-label label="Actions" [actions]="videoBlacklistActions" [entry]="videoBlacklist"></my-action-dropdown> |
35 | </td> | ||
36 | </tr> | ||
37 | </ng-template> | ||
38 | |||
39 | <ng-template pTemplate="rowexpansion" let-videoBlacklist> | ||
40 | <tr class="blacklist-reason"> | ||
41 | <td colspan="6"> | ||
42 | <span i18n class="blacklist-reason-label">Blacklist reason:</span> | ||
43 | {{ videoBlacklist.reason }} | ||
31 | </td> | 44 | </td> |
32 | </tr> | 45 | </tr> |
33 | </ng-template> | 46 | </ng-template> |
diff --git a/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.scss b/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.scss new file mode 100644 index 000000000..5265536ca --- /dev/null +++ b/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.scss | |||
@@ -0,0 +1,6 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | .blacklist-reason-label { | ||
5 | font-weight: $font-semibold; | ||
6 | } \ No newline at end of file | ||
diff --git a/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.ts b/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.ts index 143ec8406..00b0ac57e 100644 --- a/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.ts +++ b/client/src/app/+admin/video-blacklist/video-blacklist-list/video-blacklist-list.component.ts | |||
@@ -5,11 +5,12 @@ import { ConfirmService } from '../../../core' | |||
5 | import { RestPagination, RestTable, VideoBlacklistService } from '../../../shared' | 5 | import { RestPagination, RestTable, VideoBlacklistService } from '../../../shared' |
6 | import { BlacklistedVideo } from '../../../../../../shared' | 6 | import { BlacklistedVideo } from '../../../../../../shared' |
7 | import { I18n } from '@ngx-translate/i18n-polyfill' | 7 | import { I18n } from '@ngx-translate/i18n-polyfill' |
8 | import { DropdownAction } from '@app/shared/buttons/action-dropdown.component' | ||
8 | 9 | ||
9 | @Component({ | 10 | @Component({ |
10 | selector: 'my-video-blacklist-list', | 11 | selector: 'my-video-blacklist-list', |
11 | templateUrl: './video-blacklist-list.component.html', | 12 | templateUrl: './video-blacklist-list.component.html', |
12 | styleUrls: [] | 13 | styleUrls: [ './video-blacklist-list.component.scss' ] |
13 | }) | 14 | }) |
14 | export class VideoBlacklistListComponent extends RestTable implements OnInit { | 15 | export class VideoBlacklistListComponent extends RestTable implements OnInit { |
15 | blacklist: BlacklistedVideo[] = [] | 16 | blacklist: BlacklistedVideo[] = [] |
@@ -18,6 +19,8 @@ export class VideoBlacklistListComponent extends RestTable implements OnInit { | |||
18 | sort: SortMeta = { field: 'createdAt', order: 1 } | 19 | sort: SortMeta = { field: 'createdAt', order: 1 } |
19 | pagination: RestPagination = { count: this.rowsPerPage, start: 0 } | 20 | pagination: RestPagination = { count: this.rowsPerPage, start: 0 } |
20 | 21 | ||
22 | videoBlacklistActions: DropdownAction<BlacklistedVideo>[] = [] | ||
23 | |||
21 | constructor ( | 24 | constructor ( |
22 | private notificationsService: NotificationsService, | 25 | private notificationsService: NotificationsService, |
23 | private confirmService: ConfirmService, | 26 | private confirmService: ConfirmService, |
@@ -25,6 +28,13 @@ export class VideoBlacklistListComponent extends RestTable implements OnInit { | |||
25 | private i18n: I18n | 28 | private i18n: I18n |
26 | ) { | 29 | ) { |
27 | super() | 30 | super() |
31 | |||
32 | this.videoBlacklistActions = [ | ||
33 | { | ||
34 | label: this.i18n('Unblacklist'), | ||
35 | handler: videoBlacklist => this.removeVideoFromBlacklist(videoBlacklist) | ||
36 | } | ||
37 | ] | ||
28 | } | 38 | } |
29 | 39 | ||
30 | ngOnInit () { | 40 | ngOnInit () { |
@@ -33,17 +43,17 @@ export class VideoBlacklistListComponent extends RestTable implements OnInit { | |||
33 | 43 | ||
34 | async removeVideoFromBlacklist (entry: BlacklistedVideo) { | 44 | async removeVideoFromBlacklist (entry: BlacklistedVideo) { |
35 | const confirmMessage = this.i18n( | 45 | const confirmMessage = this.i18n( |
36 | 'Do you really want to remove this video from the blacklist ? It will be available again in the videos list.' | 46 | 'Do you really want to remove this video from the blacklist? It will be available again in the videos list.' |
37 | ) | 47 | ) |
38 | 48 | ||
39 | const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblacklist')) | 49 | const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblacklist')) |
40 | if (res === false) return | 50 | if (res === false) return |
41 | 51 | ||
42 | this.videoBlacklistService.removeVideoFromBlacklist(entry.videoId).subscribe( | 52 | this.videoBlacklistService.removeVideoFromBlacklist(entry.video.id).subscribe( |
43 | () => { | 53 | () => { |
44 | this.notificationsService.success( | 54 | this.notificationsService.success( |
45 | this.i18n('Success'), | 55 | this.i18n('Success'), |
46 | this.i18n('Video {{name}} removed from the blacklist.', { name: entry.name }) | 56 | this.i18n('Video {{name}} removed from the blacklist.', { name: entry.video.name }) |
47 | ) | 57 | ) |
48 | this.loadData() | 58 | this.loadData() |
49 | }, | 59 | }, |
diff --git a/client/src/app/shared/forms/form-validators/index.ts b/client/src/app/shared/forms/form-validators/index.ts index 60d735ef7..9bc7615ca 100644 --- a/client/src/app/shared/forms/form-validators/index.ts +++ b/client/src/app/shared/forms/form-validators/index.ts | |||
@@ -5,6 +5,7 @@ export * from './login-validators.service' | |||
5 | export * from './reset-password-validators.service' | 5 | export * from './reset-password-validators.service' |
6 | export * from './user-validators.service' | 6 | export * from './user-validators.service' |
7 | export * from './video-abuse-validators.service' | 7 | export * from './video-abuse-validators.service' |
8 | export * from './video-blacklist-validators.service' | ||
8 | export * from './video-channel-validators.service' | 9 | export * from './video-channel-validators.service' |
9 | export * from './video-comment-validators.service' | 10 | export * from './video-comment-validators.service' |
10 | export * from './video-validators.service' | 11 | export * from './video-validators.service' |
diff --git a/client/src/app/shared/forms/form-validators/video-blacklist-validators.service.ts b/client/src/app/shared/forms/form-validators/video-blacklist-validators.service.ts new file mode 100644 index 000000000..07d1f264a --- /dev/null +++ b/client/src/app/shared/forms/form-validators/video-blacklist-validators.service.ts | |||
@@ -0,0 +1,19 @@ | |||
1 | import { I18n } from '@ngx-translate/i18n-polyfill' | ||
2 | import { Validators } from '@angular/forms' | ||
3 | import { Injectable } from '@angular/core' | ||
4 | import { BuildFormValidator } from '@app/shared' | ||
5 | |||
6 | @Injectable() | ||
7 | export class VideoBlacklistValidatorsService { | ||
8 | readonly VIDEO_BLACKLIST_REASON: BuildFormValidator | ||
9 | |||
10 | constructor (private i18n: I18n) { | ||
11 | this.VIDEO_BLACKLIST_REASON = { | ||
12 | VALIDATORS: [ Validators.minLength(2), Validators.maxLength(300) ], | ||
13 | MESSAGES: { | ||
14 | 'minlength': this.i18n('Blacklist reason must be at least 2 characters long.'), | ||
15 | 'maxlength': this.i18n('Blacklist reason cannot be more than 300 characters long.') | ||
16 | } | ||
17 | } | ||
18 | } | ||
19 | } | ||
diff --git a/client/src/app/shared/shared.module.ts b/client/src/app/shared/shared.module.ts index ea7f2c887..722415a06 100644 --- a/client/src/app/shared/shared.module.ts +++ b/client/src/app/shared/shared.module.ts | |||
@@ -36,7 +36,7 @@ import { | |||
36 | ReactiveFileComponent, | 36 | ReactiveFileComponent, |
37 | ResetPasswordValidatorsService, | 37 | ResetPasswordValidatorsService, |
38 | UserValidatorsService, | 38 | UserValidatorsService, |
39 | VideoAbuseValidatorsService, | 39 | VideoAbuseValidatorsService, VideoBlacklistValidatorsService, |
40 | VideoChannelValidatorsService, | 40 | VideoChannelValidatorsService, |
41 | VideoCommentValidatorsService, | 41 | VideoCommentValidatorsService, |
42 | VideoValidatorsService | 42 | VideoValidatorsService |
@@ -133,6 +133,7 @@ import { NgbDropdownModule, NgbModalModule, NgbPopoverModule, NgbTabsetModule, N | |||
133 | MarkdownService, | 133 | MarkdownService, |
134 | VideoChannelService, | 134 | VideoChannelService, |
135 | VideoCaptionService, | 135 | VideoCaptionService, |
136 | VideoImportService, | ||
136 | 137 | ||
137 | FormValidatorService, | 138 | FormValidatorService, |
138 | CustomConfigValidatorsService, | 139 | CustomConfigValidatorsService, |
@@ -144,7 +145,7 @@ import { NgbDropdownModule, NgbModalModule, NgbPopoverModule, NgbTabsetModule, N | |||
144 | VideoCommentValidatorsService, | 145 | VideoCommentValidatorsService, |
145 | VideoValidatorsService, | 146 | VideoValidatorsService, |
146 | VideoCaptionsValidatorsService, | 147 | VideoCaptionsValidatorsService, |
147 | VideoImportService, | 148 | VideoBlacklistValidatorsService, |
148 | 149 | ||
149 | I18nPrimengCalendarService, | 150 | I18nPrimengCalendarService, |
150 | ScreenService, | 151 | ScreenService, |
diff --git a/client/src/app/shared/video-blacklist/video-blacklist.service.ts b/client/src/app/shared/video-blacklist/video-blacklist.service.ts index 040d82c9a..a014260b1 100644 --- a/client/src/app/shared/video-blacklist/video-blacklist.service.ts +++ b/client/src/app/shared/video-blacklist/video-blacklist.service.ts | |||
@@ -36,8 +36,10 @@ export class VideoBlacklistService { | |||
36 | ) | 36 | ) |
37 | } | 37 | } |
38 | 38 | ||
39 | blacklistVideo (videoId: number) { | 39 | blacklistVideo (videoId: number, reason?: string) { |
40 | return this.authHttp.post(VideoBlacklistService.BASE_VIDEOS_URL + videoId + '/blacklist', {}) | 40 | const body = reason ? { reason } : {} |
41 | |||
42 | return this.authHttp.post(VideoBlacklistService.BASE_VIDEOS_URL + videoId + '/blacklist', body) | ||
41 | .pipe( | 43 | .pipe( |
42 | map(this.restExtractor.extractDataBool), | 44 | map(this.restExtractor.extractDataBool), |
43 | catchError(res => this.restExtractor.handleError(res)) | 45 | catchError(res => this.restExtractor.handleError(res)) |
diff --git a/client/src/app/shared/video/video-details.model.ts b/client/src/app/shared/video/video-details.model.ts index e500ad6fc..bdcc0bbba 100644 --- a/client/src/app/shared/video/video-details.model.ts +++ b/client/src/app/shared/video/video-details.model.ts | |||
@@ -44,7 +44,7 @@ export class VideoDetails extends Video implements VideoDetailsServerModel { | |||
44 | } | 44 | } |
45 | 45 | ||
46 | isBlackistableBy (user: AuthUser) { | 46 | isBlackistableBy (user: AuthUser) { |
47 | return user && user.hasRight(UserRight.MANAGE_VIDEO_BLACKLIST) === true && this.isLocal === false | 47 | return user && user.hasRight(UserRight.MANAGE_VIDEO_BLACKLIST) === true |
48 | } | 48 | } |
49 | 49 | ||
50 | isUpdatableBy (user: AuthUser) { | 50 | isUpdatableBy (user: AuthUser) { |
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 new file mode 100644 index 000000000..c436501b4 --- /dev/null +++ b/client/src/app/videos/+video-watch/modal/video-blacklist.component.html | |||
@@ -0,0 +1,31 @@ | |||
1 | <ng-template #modal> | ||
2 | <div class="modal-header"> | ||
3 | <h4 i18n class="modal-title">Blacklist video</h4> | ||
4 | <span class="close" aria-label="Close" role="button" (click)="hide()"></span> | ||
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 inputs"> | ||
19 | <span i18n class="action-button action-button-cancel" (click)="hide()"> | ||
20 | Cancel | ||
21 | </span> | ||
22 | |||
23 | <input | ||
24 | type="submit" i18n-value value="Submit" class="action-button-submit" | ||
25 | [disabled]="!form.valid" | ||
26 | > | ||
27 | </div> | ||
28 | </form> | ||
29 | |||
30 | </div> | ||
31 | </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 new file mode 100644 index 000000000..afcdb9a16 --- /dev/null +++ b/client/src/app/videos/+video-watch/modal/video-blacklist.component.scss | |||
@@ -0,0 +1,6 @@ | |||
1 | @import 'variables'; | ||
2 | @import 'mixins'; | ||
3 | |||
4 | textarea { | ||
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 new file mode 100644 index 000000000..2c123ebed --- /dev/null +++ b/client/src/app/videos/+video-watch/modal/video-blacklist.component.ts | |||
@@ -0,0 +1,66 @@ | |||
1 | import { Component, Input, OnInit, ViewChild } from '@angular/core' | ||
2 | import { NotificationsService } from 'angular2-notifications' | ||
3 | import { FormReactive, VideoBlacklistService, VideoBlacklistValidatorsService } from '../../../shared/index' | ||
4 | import { VideoDetails } from '../../../shared/video/video-details.model' | ||
5 | import { I18n } from '@ngx-translate/i18n-polyfill' | ||
6 | import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' | ||
7 | import { NgbModal } from '@ng-bootstrap/ng-bootstrap' | ||
8 | import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' | ||
9 | import { RedirectService } from '@app/core' | ||
10 | |||
11 | @Component({ | ||
12 | selector: 'my-video-blacklist', | ||
13 | templateUrl: './video-blacklist.component.html', | ||
14 | styleUrls: [ './video-blacklist.component.scss' ] | ||
15 | }) | ||
16 | export class VideoBlacklistComponent 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 videoBlacklistValidatorsService: VideoBlacklistValidatorsService, | ||
29 | private videoBlacklistService: VideoBlacklistService, | ||
30 | private notificationsService: NotificationsService, | ||
31 | private redirectService: RedirectService, | ||
32 | private i18n: I18n | ||
33 | ) { | ||
34 | super() | ||
35 | } | ||
36 | |||
37 | ngOnInit () { | ||
38 | this.buildForm({ | ||
39 | reason: this.videoBlacklistValidatorsService.VIDEO_BLACKLIST_REASON | ||
40 | }) | ||
41 | } | ||
42 | |||
43 | show () { | ||
44 | this.openedModal = this.modalService.open(this.modal, { keyboard: false }) | ||
45 | } | ||
46 | |||
47 | hide () { | ||
48 | this.openedModal.close() | ||
49 | this.openedModal = null | ||
50 | } | ||
51 | |||
52 | blacklist () { | ||
53 | const reason = this.form.value[ 'reason' ] || undefined | ||
54 | |||
55 | this.videoBlacklistService.blacklistVideo(this.video.id, reason) | ||
56 | .subscribe( | ||
57 | () => { | ||
58 | this.notificationsService.success(this.i18n('Success'), this.i18n('Video blacklisted.')) | ||
59 | this.hide() | ||
60 | this.redirectService.redirectToHomepage() | ||
61 | }, | ||
62 | |||
63 | err => this.notificationsService.error(this.i18n('Error'), err.message) | ||
64 | ) | ||
65 | } | ||
66 | } | ||
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 dd0d628bd..f82f1c554 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.html +++ b/client/src/app/videos/+video-watch/video-watch.component.html | |||
@@ -90,16 +90,16 @@ | |||
90 | <span class="icon icon-alert"></span> <ng-container i18n>Report</ng-container> | 90 | <span class="icon icon-alert"></span> <ng-container i18n>Report</ng-container> |
91 | </a> | 91 | </a> |
92 | 92 | ||
93 | <a *ngIf="isVideoBlacklistable()" class="dropdown-item" i18n-title title="Blacklist this video" href="#" (click)="blacklistVideo($event)"> | ||
94 | <span class="icon icon-blacklist"></span> <ng-container i18n>Blacklist</ng-container> | ||
95 | </a> | ||
96 | |||
97 | <a *ngIf="isVideoUpdatable()" class="dropdown-item" i18n-title title="Update this video" href="#" [routerLink]="[ '/videos/update', video.uuid ]"> | 93 | <a *ngIf="isVideoUpdatable()" class="dropdown-item" i18n-title title="Update this video" href="#" [routerLink]="[ '/videos/update', video.uuid ]"> |
98 | <span class="icon icon-edit"></span> <ng-container i18n>Update</ng-container> | 94 | <span class="icon icon-edit"></span> <ng-container i18n>Update</ng-container> |
99 | </a> | 95 | </a> |
100 | 96 | ||
97 | <a *ngIf="isVideoBlacklistable()" class="dropdown-item" i18n-title title="Blacklist this video" href="#" (click)="showBlacklistModal($event)"> | ||
98 | <span class="icon icon-blacklist"></span> <ng-container i18n>Blacklist</ng-container> | ||
99 | </a> | ||
100 | |||
101 | <a *ngIf="isVideoRemovable()" class="dropdown-item" i18n-title title="Delete this video" href="#" (click)="removeVideo($event)"> | 101 | <a *ngIf="isVideoRemovable()" class="dropdown-item" i18n-title title="Delete this video" href="#" (click)="removeVideo($event)"> |
102 | <span class="icon icon-blacklist"></span> <ng-container i18n>Delete</ng-container> | 102 | <span class="icon icon-delete"></span> <ng-container i18n>Delete</ng-container> |
103 | </a> | 103 | </a> |
104 | </div> | 104 | </div> |
105 | </div> | 105 | </div> |
@@ -205,4 +205,5 @@ | |||
205 | <my-video-share #videoShareModal [video]="video"></my-video-share> | 205 | <my-video-share #videoShareModal [video]="video"></my-video-share> |
206 | <my-video-download #videoDownloadModal [video]="video"></my-video-download> | 206 | <my-video-download #videoDownloadModal [video]="video"></my-video-download> |
207 | <my-video-report #videoReportModal [video]="video"></my-video-report> | 207 | <my-video-report #videoReportModal [video]="video"></my-video-report> |
208 | <my-video-blacklist #videoBlacklistModal [video]="video"></my-video-blacklist> | ||
208 | </ng-template> | 209 | </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 7d269b31f..e63ab7bbd 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.scss +++ b/client/src/app/videos/+video-watch/video-watch.component.scss | |||
@@ -258,6 +258,10 @@ | |||
258 | &.icon-blacklist { | 258 | &.icon-blacklist { |
259 | background-image: url('../../../assets/images/video/blacklist.svg'); | 259 | background-image: url('../../../assets/images/video/blacklist.svg'); |
260 | } | 260 | } |
261 | |||
262 | &.icon-delete { | ||
263 | background-image: url('../../../assets/images/global/delete-black.svg'); | ||
264 | } | ||
261 | } | 265 | } |
262 | } | 266 | } |
263 | } | 267 | } |
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 04bcc6cd1..878655d4a 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.ts +++ b/client/src/app/videos/+video-watch/video-watch.component.ts | |||
@@ -21,6 +21,7 @@ import { MarkdownService } from '../shared' | |||
21 | import { VideoDownloadComponent } from './modal/video-download.component' | 21 | import { VideoDownloadComponent } from './modal/video-download.component' |
22 | import { VideoReportComponent } from './modal/video-report.component' | 22 | import { VideoReportComponent } from './modal/video-report.component' |
23 | import { VideoShareComponent } from './modal/video-share.component' | 23 | import { VideoShareComponent } from './modal/video-share.component' |
24 | import { VideoBlacklistComponent } from './modal/video-blacklist.component' | ||
24 | import { addContextMenu, getVideojsOptions, loadLocale } from '../../../assets/player/peertube-player' | 25 | import { addContextMenu, getVideojsOptions, loadLocale } from '../../../assets/player/peertube-player' |
25 | import { ServerService } from '@app/core' | 26 | import { ServerService } from '@app/core' |
26 | import { I18n } from '@ngx-translate/i18n-polyfill' | 27 | import { I18n } from '@ngx-translate/i18n-polyfill' |
@@ -41,6 +42,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
41 | @ViewChild('videoShareModal') videoShareModal: VideoShareComponent | 42 | @ViewChild('videoShareModal') videoShareModal: VideoShareComponent |
42 | @ViewChild('videoReportModal') videoReportModal: VideoReportComponent | 43 | @ViewChild('videoReportModal') videoReportModal: VideoReportComponent |
43 | @ViewChild('videoSupportModal') videoSupportModal: VideoSupportComponent | 44 | @ViewChild('videoSupportModal') videoSupportModal: VideoSupportComponent |
45 | @ViewChild('videoBlacklistModal') videoBlacklistModal: VideoBlacklistComponent | ||
44 | 46 | ||
45 | otherVideosDisplayed: Video[] = [] | 47 | otherVideosDisplayed: Video[] = [] |
46 | 48 | ||
@@ -156,26 +158,6 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
156 | } | 158 | } |
157 | } | 159 | } |
158 | 160 | ||
159 | async blacklistVideo (event: Event) { | ||
160 | event.preventDefault() | ||
161 | |||
162 | const res = await this.confirmService.confirm(this.i18n('Do you really want to blacklist this video?'), this.i18n('Blacklist')) | ||
163 | if (res === false) return | ||
164 | |||
165 | this.videoBlacklistService.blacklistVideo(this.video.id) | ||
166 | .subscribe( | ||
167 | () => { | ||
168 | this.notificationsService.success( | ||
169 | this.i18n('Success'), | ||
170 | this.i18n('Video {{videoName}} had been blacklisted.', { videoName: this.video.name }) | ||
171 | ) | ||
172 | this.redirectService.redirectToHomepage() | ||
173 | }, | ||
174 | |||
175 | error => this.notificationsService.error(this.i18n('Error'), error.message) | ||
176 | ) | ||
177 | } | ||
178 | |||
179 | showMoreDescription () { | 161 | showMoreDescription () { |
180 | if (this.completeVideoDescription === undefined) { | 162 | if (this.completeVideoDescription === undefined) { |
181 | return this.loadCompleteDescription() | 163 | return this.loadCompleteDescription() |
@@ -230,6 +212,11 @@ export class VideoWatchComponent implements OnInit, OnDestroy { | |||
230 | this.videoDownloadModal.show() | 212 | this.videoDownloadModal.show() |
231 | } | 213 | } |
232 | 214 | ||
215 | showBlacklistModal (event: Event) { | ||
216 | event.preventDefault() | ||
217 | this.videoBlacklistModal.show() | ||
218 | } | ||
219 | |||
233 | isUserLoggedIn () { | 220 | isUserLoggedIn () { |
234 | return this.authService.isLoggedIn() | 221 | return this.authService.isLoggedIn() |
235 | } | 222 | } |
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 09d5133e4..7730919fe 100644 --- a/client/src/app/videos/+video-watch/video-watch.module.ts +++ b/client/src/app/videos/+video-watch/video-watch.module.ts | |||
@@ -15,6 +15,7 @@ import { VideoWatchRoutingModule } from './video-watch-routing.module' | |||
15 | import { VideoWatchComponent } from './video-watch.component' | 15 | import { VideoWatchComponent } from './video-watch.component' |
16 | import { NgxQRCodeModule } from 'ngx-qrcode2' | 16 | import { NgxQRCodeModule } from 'ngx-qrcode2' |
17 | import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap' | 17 | import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap' |
18 | import { VideoBlacklistComponent } from '@app/videos/+video-watch/modal/video-blacklist.component' | ||
18 | 19 | ||
19 | @NgModule({ | 20 | @NgModule({ |
20 | imports: [ | 21 | imports: [ |
@@ -31,6 +32,7 @@ import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap' | |||
31 | VideoDownloadComponent, | 32 | VideoDownloadComponent, |
32 | VideoShareComponent, | 33 | VideoShareComponent, |
33 | VideoReportComponent, | 34 | VideoReportComponent, |
35 | VideoBlacklistComponent, | ||
34 | VideoSupportComponent, | 36 | VideoSupportComponent, |
35 | VideoCommentsComponent, | 37 | VideoCommentsComponent, |
36 | VideoCommentAddComponent, | 38 | VideoCommentAddComponent, |
diff --git a/client/src/assets/images/global/delete-black.svg b/client/src/assets/images/global/delete-black.svg new file mode 100644 index 000000000..04ddc23aa --- /dev/null +++ b/client/src/assets/images/global/delete-black.svg | |||
@@ -0,0 +1,14 @@ | |||
1 | <?xml version="1.0" encoding="UTF-8"?> | ||
2 | <svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||
3 | <defs></defs> | ||
4 | <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||
5 | <g id="Artboard-4" transform="translate(-224.000000, -159.000000)"> | ||
6 | <g id="25" transform="translate(224.000000, 159.000000)"> | ||
7 | <path d="M5,7 L5,20.0081158 C5,21.1082031 5.89706013,22 7.00585866,22 L16.9941413,22 C18.1019465,22 19,21.1066027 19,20.0081158 L19,7" id="Path-296" stroke="#000" stroke-width="2"></path> | ||
8 | <rect id="Rectangle-424" fill="#000" x="2" y="4" width="20" height="2" rx="1"></rect> | ||
9 | <path d="M9,10.9970301 C9,10.4463856 9.44386482,10 10,10 C10.5522847,10 11,10.4530363 11,10.9970301 L11,17.0029699 C11,17.5536144 10.5561352,18 10,18 C9.44771525,18 9,17.5469637 9,17.0029699 L9,10.9970301 Z M13,10.9970301 C13,10.4463856 13.4438648,10 14,10 C14.5522847,10 15,10.4530363 15,10.9970301 L15,17.0029699 C15,17.5536144 14.5561352,18 14,18 C13.4477153,18 13,17.5469637 13,17.0029699 L13,10.9970301 Z" id="Combined-Shape" fill="#000"></path> | ||
10 | <path d="M9,5 L9,2.99895656 C9,2.44724809 9.45097518,2 9.99077797,2 L14.009222,2 C14.5564136,2 15,2.44266033 15,2.99895656 L15,5" id="Path-33" stroke="#000" stroke-width="2" stroke-linejoin="round"></path> | ||
11 | </g> | ||
12 | </g> | ||
13 | </g> | ||
14 | </svg> | ||