diff options
Diffstat (limited to 'client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts')
-rw-r--r-- | client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts | 48 |
1 files changed, 28 insertions, 20 deletions
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts b/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts index ac6c1786f..9cadf52cb 100644 --- a/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts +++ b/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts | |||
@@ -1,12 +1,11 @@ | |||
1 | import { HttpEventType, HttpResponse } from '@angular/common/http' | 1 | import { HttpEventType, HttpResponse } from '@angular/common/http' |
2 | import { Component, EventEmitter, OnDestroy, OnInit, Output, ViewChild } from '@angular/core' | 2 | import { Component, ElementRef, EventEmitter, OnDestroy, OnInit, Output, ViewChild } from '@angular/core' |
3 | import { Router } from '@angular/router' | 3 | import { Router } from '@angular/router' |
4 | import { LoadingBarService } from '@ngx-loading-bar/core' | 4 | import { LoadingBarService } from '@ngx-loading-bar/core' |
5 | import { NotificationsService } from 'angular2-notifications' | ||
6 | import { BytesPipe } from 'ngx-pipes' | 5 | import { BytesPipe } from 'ngx-pipes' |
7 | import { Subscription } from 'rxjs' | 6 | import { Subscription } from 'rxjs' |
8 | import { VideoPrivacy } from '../../../../../../shared/models/videos' | 7 | import { VideoPrivacy } from '../../../../../../shared/models/videos' |
9 | import { AuthService, ServerService } from '../../../core' | 8 | import { AuthService, Notifier, ServerService } from '../../../core' |
10 | import { VideoEdit } from '../../../shared/video/video-edit.model' | 9 | import { VideoEdit } from '../../../shared/video/video-edit.model' |
11 | import { VideoService } from '../../../shared/video/video.service' | 10 | import { VideoService } from '../../../shared/video/video.service' |
12 | import { I18n } from '@ngx-translate/i18n-polyfill' | 11 | import { I18n } from '@ngx-translate/i18n-polyfill' |
@@ -14,18 +13,21 @@ import { VideoSend } from '@app/videos/+video-edit/video-add-components/video-se | |||
14 | import { CanComponentDeactivate } from '@app/shared/guards/can-deactivate-guard.service' | 13 | import { CanComponentDeactivate } from '@app/shared/guards/can-deactivate-guard.service' |
15 | import { FormValidatorService, UserService } from '@app/shared' | 14 | import { FormValidatorService, UserService } from '@app/shared' |
16 | import { VideoCaptionService } from '@app/shared/video-caption' | 15 | import { VideoCaptionService } from '@app/shared/video-caption' |
16 | import { scrollToTop } from '@app/shared/misc/utils' | ||
17 | 17 | ||
18 | @Component({ | 18 | @Component({ |
19 | selector: 'my-video-upload', | 19 | selector: 'my-video-upload', |
20 | templateUrl: './video-upload.component.html', | 20 | templateUrl: './video-upload.component.html', |
21 | styleUrls: [ | 21 | styleUrls: [ |
22 | '../shared/video-edit.component.scss', | 22 | '../shared/video-edit.component.scss', |
23 | './video-upload.component.scss' | 23 | './video-upload.component.scss', |
24 | './video-send.scss' | ||
24 | ] | 25 | ] |
25 | }) | 26 | }) |
26 | export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy, CanComponentDeactivate { | 27 | export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy, CanComponentDeactivate { |
27 | @Output() firstStepDone = new EventEmitter<string>() | 28 | @Output() firstStepDone = new EventEmitter<string>() |
28 | @ViewChild('videofileInput') videofileInput | 29 | @Output() firstStepError = new EventEmitter<void>() |
30 | @ViewChild('videofileInput') videofileInput: ElementRef<HTMLInputElement> | ||
29 | 31 | ||
30 | // So that it can be accessed in the template | 32 | // So that it can be accessed in the template |
31 | readonly SPECIAL_SCHEDULED_PRIVACY = VideoEdit.SPECIAL_SCHEDULED_PRIVACY | 33 | readonly SPECIAL_SCHEDULED_PRIVACY = VideoEdit.SPECIAL_SCHEDULED_PRIVACY |
@@ -42,13 +44,16 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy | |||
42 | id: 0, | 44 | id: 0, |
43 | uuid: '' | 45 | uuid: '' |
44 | } | 46 | } |
47 | waitTranscodingEnabled = true | ||
48 | |||
49 | error: string | ||
45 | 50 | ||
46 | protected readonly DEFAULT_VIDEO_PRIVACY = VideoPrivacy.PUBLIC | 51 | protected readonly DEFAULT_VIDEO_PRIVACY = VideoPrivacy.PUBLIC |
47 | 52 | ||
48 | constructor ( | 53 | constructor ( |
49 | protected formValidatorService: FormValidatorService, | 54 | protected formValidatorService: FormValidatorService, |
50 | protected loadingBar: LoadingBarService, | 55 | protected loadingBar: LoadingBarService, |
51 | protected notificationsService: NotificationsService, | 56 | protected notifier: Notifier, |
52 | protected authService: AuthService, | 57 | protected authService: AuthService, |
53 | protected serverService: ServerService, | 58 | protected serverService: ServerService, |
54 | protected videoService: VideoService, | 59 | protected videoService: VideoService, |
@@ -105,20 +110,15 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy | |||
105 | this.isUploadingVideo = false | 110 | this.isUploadingVideo = false |
106 | this.videoUploadPercents = 0 | 111 | this.videoUploadPercents = 0 |
107 | this.videoUploadObservable = null | 112 | this.videoUploadObservable = null |
108 | this.notificationsService.info(this.i18n('Info'), this.i18n('Upload cancelled')) | 113 | this.notifier.info(this.i18n('Upload cancelled')) |
109 | } | 114 | } |
110 | } | 115 | } |
111 | 116 | ||
112 | uploadFirstStep () { | 117 | uploadFirstStep () { |
113 | const videofile = this.videofileInput.nativeElement.files[0] as File | 118 | const videofile = this.videofileInput.nativeElement.files[0] |
114 | if (!videofile) return | 119 | if (!videofile) return |
115 | 120 | ||
116 | // Cannot upload videos > 8GB for now | 121 | // Check global user quota |
117 | if (videofile.size > 8 * 1024 * 1024 * 1024) { | ||
118 | this.notificationsService.error(this.i18n('Error'), this.i18n('We are sorry but PeerTube cannot handle videos > 8GB')) | ||
119 | return | ||
120 | } | ||
121 | |||
122 | const bytePipes = new BytesPipe() | 122 | const bytePipes = new BytesPipe() |
123 | const videoQuota = this.authService.getUser().videoQuota | 123 | const videoQuota = this.authService.getUser().videoQuota |
124 | if (videoQuota !== -1 && (this.userVideoQuotaUsed + videofile.size) > videoQuota) { | 124 | if (videoQuota !== -1 && (this.userVideoQuotaUsed + videofile.size) > videoQuota) { |
@@ -130,10 +130,11 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy | |||
130 | videoQuota: bytePipes.transform(videoQuota, 0) | 130 | videoQuota: bytePipes.transform(videoQuota, 0) |
131 | } | 131 | } |
132 | ) | 132 | ) |
133 | this.notificationsService.error(this.i18n('Error'), msg) | 133 | this.notifier.error(msg) |
134 | return | 134 | return |
135 | } | 135 | } |
136 | 136 | ||
137 | // Check daily user quota | ||
137 | const videoQuotaDaily = this.authService.getUser().videoQuotaDaily | 138 | const videoQuotaDaily = this.authService.getUser().videoQuotaDaily |
138 | if (videoQuotaDaily !== -1 && (this.userVideoQuotaUsedDaily + videofile.size) > videoQuotaDaily) { | 139 | if (videoQuotaDaily !== -1 && (this.userVideoQuotaUsedDaily + videofile.size) > videoQuotaDaily) { |
139 | const msg = this.i18n( | 140 | const msg = this.i18n( |
@@ -144,10 +145,11 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy | |||
144 | quotaDaily: bytePipes.transform(videoQuotaDaily, 0) | 145 | quotaDaily: bytePipes.transform(videoQuotaDaily, 0) |
145 | } | 146 | } |
146 | ) | 147 | ) |
147 | this.notificationsService.error(this.i18n('Error'), msg) | 148 | this.notifier.error(msg) |
148 | return | 149 | return |
149 | } | 150 | } |
150 | 151 | ||
152 | // Build name field | ||
151 | const nameWithoutExtension = videofile.name.replace(/\.[^/.]+$/, '') | 153 | const nameWithoutExtension = videofile.name.replace(/\.[^/.]+$/, '') |
152 | let name: string | 154 | let name: string |
153 | 155 | ||
@@ -155,6 +157,11 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy | |||
155 | if (nameWithoutExtension.length < 3) name = videofile.name | 157 | if (nameWithoutExtension.length < 3) name = videofile.name |
156 | else name = nameWithoutExtension | 158 | else name = nameWithoutExtension |
157 | 159 | ||
160 | // Force user to wait transcoding for unsupported video types in web browsers | ||
161 | if (!videofile.name.endsWith('.mp4') && !videofile.name.endsWith('.webm') && !videofile.name.endsWith('.ogv')) { | ||
162 | this.waitTranscodingEnabled = false | ||
163 | } | ||
164 | |||
158 | const privacy = this.firstStepPrivacyId.toString() | 165 | const privacy = this.firstStepPrivacyId.toString() |
159 | const nsfw = false | 166 | const nsfw = false |
160 | const waitTranscoding = true | 167 | const waitTranscoding = true |
@@ -203,7 +210,8 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy | |||
203 | this.isUploadingVideo = false | 210 | this.isUploadingVideo = false |
204 | this.videoUploadPercents = 0 | 211 | this.videoUploadPercents = 0 |
205 | this.videoUploadObservable = null | 212 | this.videoUploadObservable = null |
206 | this.notificationsService.error(this.i18n('Error'), err.message) | 213 | this.firstStepError.emit() |
214 | this.notifier.error(err.message) | ||
207 | } | 215 | } |
208 | ) | 216 | ) |
209 | } | 217 | } |
@@ -232,13 +240,13 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy | |||
232 | this.isUpdatingVideo = false | 240 | this.isUpdatingVideo = false |
233 | this.isUploadingVideo = false | 241 | this.isUploadingVideo = false |
234 | 242 | ||
235 | this.notificationsService.success(this.i18n('Success'), this.i18n('Video published.')) | 243 | this.notifier.success(this.i18n('Video published.')) |
236 | this.router.navigate([ '/videos/watch', video.uuid ]) | 244 | this.router.navigate([ '/videos/watch', video.uuid ]) |
237 | }, | 245 | }, |
238 | 246 | ||
239 | err => { | 247 | err => { |
240 | this.isUpdatingVideo = false | 248 | this.error = err.message |
241 | this.notificationsService.error(this.i18n('Error'), err.message) | 249 | scrollToTop() |
242 | console.error(err) | 250 | console.error(err) |
243 | } | 251 | } |
244 | ) | 252 | ) |