aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-08-07 09:54:36 +0200
committerChocobozzz <me@florianbigard.com>2018-08-08 09:30:31 +0200
commit990b6a0b0c4fbebc165e5cf7cec8fbc1cbaa6c66 (patch)
tree8aaa0638798bfa14813f4d6ed5247242313b9ce6 /client
parentce33919c24e7402d92d81f3cd8e545df52d98240 (diff)
downloadPeerTube-990b6a0b0c4fbebc165e5cf7cec8fbc1cbaa6c66.tar.gz
PeerTube-990b6a0b0c4fbebc165e5cf7cec8fbc1cbaa6c66.tar.zst
PeerTube-990b6a0b0c4fbebc165e5cf7cec8fbc1cbaa6c66.zip
Import torrents with webtorrent
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html7
-rw-r--r--client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html12
-rw-r--r--client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.scss20
-rw-r--r--client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts16
-rw-r--r--client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts2
-rw-r--r--client/src/app/videos/+video-edit/video-add.component.scss2
6 files changed, 49 insertions, 10 deletions
diff --git a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
index 00b2d7cb0..b2b6c3d60 100644
--- a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
+++ b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
@@ -5,7 +5,7 @@
5 <ng-template pTemplate="header"> 5 <ng-template pTemplate="header">
6 <tr> 6 <tr>
7 <th style="width: 40px;"></th> 7 <th style="width: 40px;"></th>
8 <th i18n>URL</th> 8 <th i18n>Target</th>
9 <th i18n>Video</th> 9 <th i18n>Video</th>
10 <th i18n style="width: 150px">State</th> 10 <th i18n style="width: 150px">State</th>
11 <th i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th> 11 <th i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th>
@@ -22,7 +22,10 @@
22 </td> 22 </td>
23 23
24 <td> 24 <td>
25 <a [href]="videoImport.targetUrl" target="_blank" rel="noopener noreferrer">{{ videoImport.targetUrl }}</a> 25 <a *ngIf="videoImport.targetUrl; else torrent" [href]="videoImport.targetUrl" target="_blank" rel="noopener noreferrer">{{ videoImport.targetUrl }}</a>
26 <ng-template #torrent>
27 <span [title]="videoImport.torrentName || videoImport.magnetUri">{{ videoImport.torrentName || videoImport.magnetUri }}</span>
28 </ng-template>
26 </td> 29 </td>
27 30
28 <td *ngIf="isVideoImportPending(videoImport)"> 31 <td *ngIf="isVideoImportPending(videoImport)">
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html
index 409e4de5e..2f0c9abb5 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html
+++ b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.html
@@ -2,8 +2,16 @@
2 <div class="import-video-torrent"> 2 <div class="import-video-torrent">
3 <div class="icon icon-upload"></div> 3 <div class="icon icon-upload"></div>
4 4
5 <div class="form-group"> 5 <div class="button-file">
6 <label i18n for="magnetUri">Magnet URI</label> 6 <span i18n>Select the torrent to import</span>
7 <input #torrentfileInput type="file" name="torrentfile" id="torrentfile" accept=".torrent" (change)="fileChange()" />
8 </div>
9 <span class="button-file-extension">(.torrent)</span>
10
11 <div class="torrent-or-magnet">Or</div>
12
13 <div class="form-group form-group-magnet-uri">
14 <label i18n for="magnetUri">Paste magnet URI</label>
7 <my-help 15 <my-help
8 helpType="custom" i18n-customHtml 16 helpType="custom" i18n-customHtml
9 customHtml="You can import any torrent file that points to a mp4 file. You should make sure you have diffusion rights over the content it points to, otherwise it could cause legal trouble to yourself and your instance." 17 customHtml="You can import any torrent file that points to a mp4 file. You should make sure you have diffusion rights over the content it points to, otherwise it could cause legal trouble to yourself and your instance."
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.scss b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.scss
index 1ef5adc25..262b0b68e 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.scss
+++ b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.scss
@@ -20,6 +20,26 @@ $width-size: 190px;
20 background-image: url('../../../../assets/images/video/upload.svg'); 20 background-image: url('../../../../assets/images/video/upload.svg');
21 } 21 }
22 22
23 .button-file {
24 @include peertube-button-file(auto);
25
26 min-width: 190px;
27 }
28
29 .button-file-extension {
30 display: block;
31 font-size: 12px;
32 margin-top: 5px;
33 }
34
35 .torrent-or-magnet {
36 margin: 10px 0;
37 }
38
39 .form-group-magnet-uri {
40 margin-bottom: 40px;
41 }
42
23 input[type=text] { 43 input[type=text] {
24 @include peertube-input-text($width-size); 44 @include peertube-input-text($width-size);
25 display: block; 45 display: block;
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts
index 330c37718..9623c2bf4 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts
+++ b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts
@@ -1,4 +1,4 @@
1import { Component, EventEmitter, OnInit, Output } from '@angular/core' 1import { Component, EventEmitter, OnInit, Output, ViewChild } from '@angular/core'
2import { Router } from '@angular/router' 2import { Router } from '@angular/router'
3import { NotificationsService } from 'angular2-notifications' 3import { NotificationsService } from 'angular2-notifications'
4import { VideoPrivacy, VideoUpdate } from '../../../../../../shared/models/videos' 4import { VideoPrivacy, VideoUpdate } from '../../../../../../shared/models/videos'
@@ -23,6 +23,7 @@ import { VideoImportService } from '@app/shared/video-import'
23}) 23})
24export class VideoImportTorrentComponent extends VideoSend implements OnInit, CanComponentDeactivate { 24export class VideoImportTorrentComponent extends VideoSend implements OnInit, CanComponentDeactivate {
25 @Output() firstStepDone = new EventEmitter<string>() 25 @Output() firstStepDone = new EventEmitter<string>()
26 @ViewChild('torrentfileInput') torrentfileInput
26 27
27 videoFileName: string 28 videoFileName: string
28 magnetUri = '' 29 magnetUri = ''
@@ -33,7 +34,7 @@ export class VideoImportTorrentComponent extends VideoSend implements OnInit, Ca
33 34
34 video: VideoEdit 35 video: VideoEdit
35 36
36 protected readonly DEFAULT_VIDEO_PRIVACY = VideoPrivacy.PRIVATE 37 protected readonly DEFAULT_VIDEO_PRIVACY = VideoPrivacy.PUBLIC
37 38
38 constructor ( 39 constructor (
39 protected formValidatorService: FormValidatorService, 40 protected formValidatorService: FormValidatorService,
@@ -62,7 +63,14 @@ export class VideoImportTorrentComponent extends VideoSend implements OnInit, Ca
62 return !!this.magnetUri 63 return !!this.magnetUri
63 } 64 }
64 65
65 importVideo () { 66 fileChange () {
67 const torrentfile = this.torrentfileInput.nativeElement.files[0] as File
68 if (!torrentfile) return
69
70 this.importVideo(torrentfile)
71 }
72
73 importVideo (torrentfile?: Blob) {
66 this.isImportingVideo = true 74 this.isImportingVideo = true
67 75
68 const videoUpdate: VideoUpdate = { 76 const videoUpdate: VideoUpdate = {
@@ -74,7 +82,7 @@ export class VideoImportTorrentComponent extends VideoSend implements OnInit, Ca
74 82
75 this.loadingBar.start() 83 this.loadingBar.start()
76 84
77 this.videoImportService.importVideoTorrent(this.magnetUri, videoUpdate).subscribe( 85 this.videoImportService.importVideoTorrent(torrentfile || this.magnetUri, videoUpdate).subscribe(
78 res => { 86 res => {
79 this.loadingBar.complete() 87 this.loadingBar.complete()
80 this.firstStepDone.emit(res.video.name) 88 this.firstStepDone.emit(res.video.name)
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts b/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts
index 842ede732..97b402bfe 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts
+++ b/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts
@@ -33,7 +33,7 @@ export class VideoImportUrlComponent extends VideoSend implements OnInit, CanCom
33 33
34 video: VideoEdit 34 video: VideoEdit
35 35
36 protected readonly DEFAULT_VIDEO_PRIVACY = VideoPrivacy.PRIVATE 36 protected readonly DEFAULT_VIDEO_PRIVACY = VideoPrivacy.PUBLIC
37 37
38 constructor ( 38 constructor (
39 protected formValidatorService: FormValidatorService, 39 protected formValidatorService: FormValidatorService,
diff --git a/client/src/app/videos/+video-edit/video-add.component.scss b/client/src/app/videos/+video-edit/video-add.component.scss
index 02ee295f9..443361f50 100644
--- a/client/src/app/videos/+video-edit/video-add.component.scss
+++ b/client/src/app/videos/+video-edit/video-add.component.scss
@@ -49,7 +49,7 @@ $background-color: #F7F7F7;
49 background-color: $background-color; 49 background-color: $background-color;
50 border-radius: 3px; 50 border-radius: 3px;
51 width: 100%; 51 width: 100%;
52 height: 440px; 52 min-height: 440px;
53 display: flex; 53 display: flex;
54 justify-content: center; 54 justify-content: center;
55 align-items: center; 55 align-items: center;