]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blob - client/src/app/videos/+video-edit/video-add.component.ts
Add poster for video watch
[github/Chocobozzz/PeerTube.git] / client / src / app / videos / +video-edit / video-add.component.ts
1 import { HttpEventType, HttpResponse } from '@angular/common/http'
2 import { Component, OnInit, ViewChild } from '@angular/core'
3 import { FormBuilder, FormGroup } from '@angular/forms'
4 import { Router } from '@angular/router'
5 import { NotificationsService } from 'angular2-notifications'
6 import { VideoPrivacy } from '../../../../../shared/models/videos'
7 import { AuthService, ServerService } from '../../core'
8 import { FormReactive } from '../../shared'
9 import { ValidatorMessage } from '../../shared/forms/form-validators/validator-message'
10 import { VideoEdit } from '../../shared/video/video-edit.model'
11 import { VideoService } from '../../shared/video/video.service'
12
13 @Component({
14 selector: 'my-videos-add',
15 templateUrl: './video-add.component.html',
16 styleUrls: [
17 './shared/video-edit.component.scss',
18 './video-add.component.scss'
19 ]
20 })
21
22 export class VideoAddComponent extends FormReactive implements OnInit {
23 @ViewChild('videofileInput') videofileInput
24
25 isUploadingVideo = false
26 videoUploaded = false
27 videoUploadPercents = 0
28 videoUploadedId = 0
29
30 error: string = null
31 form: FormGroup
32 formErrors: { [ id: string ]: string } = {}
33 validationMessages: ValidatorMessage = {}
34
35 userVideoChannels = []
36 videoPrivacies = []
37 firstStepPrivacyId = 0
38 firstStepChannelId = 0
39
40 constructor (
41 private formBuilder: FormBuilder,
42 private router: Router,
43 private notificationsService: NotificationsService,
44 private authService: AuthService,
45 private serverService: ServerService,
46 private videoService: VideoService
47 ) {
48 super()
49 }
50
51 buildForm () {
52 this.form = this.formBuilder.group({})
53 this.form.valueChanges.subscribe(data => this.onValueChanged(data))
54 }
55
56 ngOnInit () {
57 this.buildForm()
58
59 this.serverService.videoPrivaciesLoaded
60 .subscribe(
61 () => {
62 this.videoPrivacies = this.serverService.getVideoPrivacies()
63
64 // Public by default
65 this.firstStepPrivacyId = VideoPrivacy.PUBLIC
66 })
67
68 this.authService.userInformationLoaded
69 .subscribe(
70 () => {
71 const user = this.authService.getUser()
72 if (!user) return
73
74 const videoChannels = user.videoChannels
75 if (Array.isArray(videoChannels) === false) return
76
77 this.userVideoChannels = videoChannels.map(v => ({ id: v.id, label: v.name }))
78 this.firstStepChannelId = this.userVideoChannels[0].id
79 }
80 )
81 }
82
83 fileChange () {
84 this.uploadFirstStep()
85 }
86
87 checkForm () {
88 this.forceCheck()
89
90 return this.form.valid
91 }
92
93 uploadFirstStep () {
94 const videofile = this.videofileInput.nativeElement.files[0]
95 const name = videofile.name.replace(/\.[^/.]+$/, '')
96 const privacy = this.firstStepPrivacyId.toString()
97 const nsfw = false
98 const channelId = this.firstStepChannelId.toString()
99
100 const formData = new FormData()
101 formData.append('name', name)
102 // Put the video "private" -> we wait he validates the second step
103 formData.append('privacy', VideoPrivacy.PRIVATE.toString())
104 formData.append('nsfw', '' + nsfw)
105 formData.append('channelId', '' + channelId)
106 formData.append('videofile', videofile)
107
108 this.isUploadingVideo = true
109 this.form.patchValue({
110 name,
111 privacy,
112 nsfw,
113 channelId
114 })
115
116 this.videoService.uploadVideo(formData).subscribe(
117 event => {
118 if (event.type === HttpEventType.UploadProgress) {
119 this.videoUploadPercents = Math.round(100 * event.loaded / event.total)
120 } else if (event instanceof HttpResponse) {
121 console.log('Video uploaded.')
122
123 this.videoUploaded = true
124
125 this.videoUploadedId = event.body.video.id
126 }
127 },
128
129 err => {
130 // Reset progress
131 this.videoUploadPercents = 0
132 this.error = err.message
133 }
134 )
135 }
136
137 updateSecondStep () {
138 if (this.checkForm() === false) {
139 return
140 }
141
142 const video = new VideoEdit()
143 video.patch(this.form.value)
144 video.channel = this.firstStepChannelId
145 video.id = this.videoUploadedId
146
147 this.videoService.updateVideo(video)
148 .subscribe(
149 () => {
150 this.notificationsService.success('Success', 'Video published.')
151 this.router.navigate([ '/videos/watch', video.id ])
152 },
153
154 err => {
155 this.error = 'Cannot update the video.'
156 console.error(err)
157 }
158 )
159
160 }
161 }