aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos/+video-watch/modal
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/+video-watch/modal
parent693263e936763a851e3c8c020e3739def8bd4eca (diff)
downloadPeerTube-3a0fb65c61f80b510bce979a45d59d17948745e8.tar.gz
PeerTube-3a0fb65c61f80b510bce979a45d59d17948745e8.tar.zst
PeerTube-3a0fb65c61f80b510bce979a45d59d17948745e8.zip
Add video miniature dropdown
Diffstat (limited to 'client/src/app/videos/+video-watch/modal')
-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
9 files changed, 0 insertions, 384 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}
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-30 05:51:52 +0000