]>
Commit | Line | Data |
---|---|---|
c729caf6 C |
1 | import { Component, OnInit } from '@angular/core' |
2 | import { ActivatedRoute, Router } from '@angular/router' | |
3 | import { ConfirmService, Notifier, ServerService } from '@app/core' | |
4 | import { FormReactive, FormValidatorService } from '@app/shared/shared-forms' | |
92e66e04 | 5 | import { VideoDetails } from '@app/shared/shared-main' |
c729caf6 C |
6 | import { LoadingBarService } from '@ngx-loading-bar/core' |
7 | import { secondsToTime } from '@shared/core-utils' | |
92e66e04 C |
8 | import { VideoStudioTask, VideoStudioTaskCut } from '@shared/models' |
9 | import { VideoStudioService } from '../shared' | |
c729caf6 C |
10 | |
11 | @Component({ | |
92e66e04 C |
12 | selector: 'my-video-studio-edit', |
13 | templateUrl: './video-studio-edit.component.html', | |
14 | styleUrls: [ './video-studio-edit.component.scss' ] | |
c729caf6 | 15 | }) |
92e66e04 | 16 | export class VideoStudioEditComponent extends FormReactive implements OnInit { |
c729caf6 C |
17 | isRunningEdition = false |
18 | ||
19 | video: VideoDetails | |
20 | ||
21 | constructor ( | |
22 | protected formValidatorService: FormValidatorService, | |
23 | private serverService: ServerService, | |
24 | private notifier: Notifier, | |
25 | private router: Router, | |
26 | private route: ActivatedRoute, | |
92e66e04 | 27 | private videoStudioService: VideoStudioService, |
c729caf6 C |
28 | private loadingBar: LoadingBarService, |
29 | private confirmService: ConfirmService | |
30 | ) { | |
31 | super() | |
32 | } | |
33 | ||
34 | ngOnInit () { | |
35 | this.video = this.route.snapshot.data.video | |
36 | ||
37 | const defaultValues = { | |
38 | cut: { | |
39 | start: 0, | |
40 | end: this.video.duration | |
41 | } | |
42 | } | |
43 | ||
44 | this.buildForm({ | |
45 | cut: { | |
46 | start: null, | |
47 | end: null | |
48 | }, | |
49 | 'add-intro': { | |
50 | file: null | |
51 | }, | |
52 | 'add-outro': { | |
53 | file: null | |
54 | }, | |
55 | 'add-watermark': { | |
56 | file: null | |
57 | } | |
58 | }, defaultValues) | |
59 | } | |
60 | ||
61 | get videoExtensions () { | |
62 | return this.serverService.getHTMLConfig().video.file.extensions | |
63 | } | |
64 | ||
65 | get imageExtensions () { | |
66 | return this.serverService.getHTMLConfig().video.image.extensions | |
67 | } | |
68 | ||
69 | async runEdition () { | |
70 | if (this.isRunningEdition) return | |
71 | ||
72 | const title = $localize`Are you sure you want to edit "${this.video.name}"?` | |
73 | const listHTML = this.getTasksSummary().map(t => `<li>${t}</li>`).join('') | |
74 | ||
75 | // eslint-disable-next-line max-len | |
76 | const confirmHTML = $localize`The current video will be overwritten by this edited video and <strong>you won't be able to recover it</strong>.<br /><br />` + | |
77 | $localize`As a reminder, the following tasks will be executed: <ol>${listHTML}</ol>` | |
78 | ||
79 | if (await this.confirmService.confirm(confirmHTML, title) !== true) return | |
80 | ||
81 | this.isRunningEdition = true | |
82 | ||
83 | const tasks = this.buildTasks() | |
84 | ||
85 | this.loadingBar.useRef().start() | |
86 | ||
92e66e04 | 87 | return this.videoStudioService.editVideo(this.video.uuid, tasks) |
c729caf6 C |
88 | .subscribe({ |
89 | next: () => { | |
92e66e04 C |
90 | this.notifier.success($localize`Edition tasks created.`) |
91 | ||
92 | // Don't redirect to old video version watch page that could be confusing for users | |
93 | this.router.navigateByUrl('/my-library/videos') | |
c729caf6 C |
94 | }, |
95 | ||
96 | error: err => { | |
97 | this.loadingBar.useRef().complete() | |
98 | this.isRunningEdition = false | |
99 | this.notifier.error(err.message) | |
100 | console.error(err) | |
101 | } | |
102 | }) | |
103 | } | |
104 | ||
105 | getIntroOutroTooltip () { | |
106 | return $localize`(extensions: ${this.videoExtensions.join(', ')})` | |
107 | } | |
108 | ||
109 | getWatermarkTooltip () { | |
110 | return $localize`(extensions: ${this.imageExtensions.join(', ')})` | |
111 | } | |
112 | ||
113 | noEdition () { | |
114 | return this.buildTasks().length === 0 | |
115 | } | |
116 | ||
117 | getTasksSummary () { | |
118 | const tasks = this.buildTasks() | |
119 | ||
120 | return tasks.map(t => { | |
121 | if (t.name === 'add-intro') { | |
052bdb7c | 122 | return $localize`"${this.getFilename(t.options.file)}" will be added at the beginning of the video` |
c729caf6 C |
123 | } |
124 | ||
125 | if (t.name === 'add-outro') { | |
126 | return $localize`"${this.getFilename(t.options.file)}" will be added at the end of the video` | |
127 | } | |
128 | ||
129 | if (t.name === 'add-watermark') { | |
130 | return $localize`"${this.getFilename(t.options.file)}" image watermark will be added to the video` | |
131 | } | |
132 | ||
133 | if (t.name === 'cut') { | |
134 | const { start, end } = t.options | |
135 | ||
136 | if (start !== undefined && end !== undefined) { | |
137 | return $localize`Video will begin at ${secondsToTime(start)} and stop at ${secondsToTime(end)}` | |
138 | } | |
139 | ||
140 | if (start !== undefined) { | |
141 | return $localize`Video will begin at ${secondsToTime(start)}` | |
142 | } | |
143 | ||
144 | if (end !== undefined) { | |
145 | return $localize`Video will stop at ${secondsToTime(end)}` | |
146 | } | |
147 | } | |
148 | ||
149 | return '' | |
150 | }) | |
151 | } | |
152 | ||
153 | private getFilename (obj: any) { | |
154 | return obj.name | |
155 | } | |
156 | ||
157 | private buildTasks () { | |
92e66e04 | 158 | const tasks: VideoStudioTask[] = [] |
c729caf6 C |
159 | const value = this.form.value |
160 | ||
161 | const cut = value['cut'] | |
162 | if (cut['start'] !== 0 || cut['end'] !== this.video.duration) { | |
163 | ||
92e66e04 | 164 | const options: VideoStudioTaskCut['options'] = {} |
c729caf6 C |
165 | if (cut['start'] !== 0) options.start = cut['start'] |
166 | if (cut['end'] !== this.video.duration) options.end = cut['end'] | |
167 | ||
168 | tasks.push({ | |
169 | name: 'cut', | |
170 | options | |
171 | }) | |
172 | } | |
173 | ||
174 | if (value['add-intro']?.['file']) { | |
175 | tasks.push({ | |
176 | name: 'add-intro', | |
177 | options: { | |
178 | file: value['add-intro']['file'] | |
179 | } | |
180 | }) | |
181 | } | |
182 | ||
183 | if (value['add-outro']?.['file']) { | |
184 | tasks.push({ | |
185 | name: 'add-outro', | |
186 | options: { | |
187 | file: value['add-outro']['file'] | |
188 | } | |
189 | }) | |
190 | } | |
191 | ||
192 | if (value['add-watermark']?.['file']) { | |
193 | tasks.push({ | |
194 | name: 'add-watermark', | |
195 | options: { | |
196 | file: value['add-watermark']['file'] | |
197 | } | |
198 | }) | |
199 | } | |
200 | ||
201 | return tasks | |
202 | } | |
203 | ||
204 | } |