diff options
Diffstat (limited to 'client/src/app/+videos/+video-edit/shared/video-caption-add-modal.component.ts')
-rw-r--r-- | client/src/app/+videos/+video-edit/shared/video-caption-add-modal.component.ts | 85 |
1 files changed, 85 insertions, 0 deletions
diff --git a/client/src/app/+videos/+video-edit/shared/video-caption-add-modal.component.ts b/client/src/app/+videos/+video-edit/shared/video-caption-add-modal.component.ts new file mode 100644 index 000000000..a90d04ce8 --- /dev/null +++ b/client/src/app/+videos/+video-edit/shared/video-caption-add-modal.component.ts | |||
@@ -0,0 +1,85 @@ | |||
1 | import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core' | ||
2 | import { ServerService } from '@app/core' | ||
3 | import { FormReactive, FormValidatorService, VideoCaptionsValidatorsService } from '@app/shared/shared-forms' | ||
4 | import { VideoCaptionEdit } from '@app/shared/shared-main' | ||
5 | import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap' | ||
6 | import { ServerConfig, VideoConstant } from '@shared/models' | ||
7 | |||
8 | @Component({ | ||
9 | selector: 'my-video-caption-add-modal', | ||
10 | styleUrls: [ './video-caption-add-modal.component.scss' ], | ||
11 | templateUrl: './video-caption-add-modal.component.html' | ||
12 | }) | ||
13 | |||
14 | export class VideoCaptionAddModalComponent extends FormReactive implements OnInit { | ||
15 | @Input() existingCaptions: string[] | ||
16 | @Input() serverConfig: ServerConfig | ||
17 | |||
18 | @Output() captionAdded = new EventEmitter<VideoCaptionEdit>() | ||
19 | |||
20 | @ViewChild('modal', { static: true }) modal: ElementRef | ||
21 | |||
22 | videoCaptionLanguages: VideoConstant<string>[] = [] | ||
23 | |||
24 | private openedModal: NgbModalRef | ||
25 | private closingModal = false | ||
26 | |||
27 | constructor ( | ||
28 | protected formValidatorService: FormValidatorService, | ||
29 | private modalService: NgbModal, | ||
30 | private serverService: ServerService, | ||
31 | private videoCaptionsValidatorsService: VideoCaptionsValidatorsService | ||
32 | ) { | ||
33 | super() | ||
34 | } | ||
35 | |||
36 | get videoCaptionExtensions () { | ||
37 | return this.serverConfig.videoCaption.file.extensions | ||
38 | } | ||
39 | |||
40 | get videoCaptionMaxSize () { | ||
41 | return this.serverConfig.videoCaption.file.size.max | ||
42 | } | ||
43 | |||
44 | ngOnInit () { | ||
45 | this.serverService.getVideoLanguages() | ||
46 | .subscribe(languages => this.videoCaptionLanguages = languages) | ||
47 | |||
48 | this.buildForm({ | ||
49 | language: this.videoCaptionsValidatorsService.VIDEO_CAPTION_LANGUAGE, | ||
50 | captionfile: this.videoCaptionsValidatorsService.VIDEO_CAPTION_FILE | ||
51 | }) | ||
52 | } | ||
53 | |||
54 | show () { | ||
55 | this.closingModal = false | ||
56 | |||
57 | this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false }) | ||
58 | } | ||
59 | |||
60 | hide () { | ||
61 | this.closingModal = true | ||
62 | this.openedModal.close() | ||
63 | this.form.reset() | ||
64 | } | ||
65 | |||
66 | isReplacingExistingCaption () { | ||
67 | if (this.closingModal === true) return false | ||
68 | |||
69 | const languageId = this.form.value[ 'language' ] | ||
70 | |||
71 | return languageId && this.existingCaptions.indexOf(languageId) !== -1 | ||
72 | } | ||
73 | |||
74 | async addCaption () { | ||
75 | const languageId = this.form.value[ 'language' ] | ||
76 | const languageObject = this.videoCaptionLanguages.find(l => l.id === languageId) | ||
77 | |||
78 | this.captionAdded.emit({ | ||
79 | language: languageObject, | ||
80 | captionfile: this.form.value[ 'captionfile' ] | ||
81 | }) | ||
82 | |||
83 | this.hide() | ||
84 | } | ||
85 | } | ||