]>
Commit | Line | Data |
---|---|---|
63347a0f | 1 | import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core' |
40e87e9e | 2 | import { ServerService } from '@app/core' |
7ed1edbb | 3 | import { VIDEO_CAPTION_FILE_VALIDATOR, VIDEO_CAPTION_LANGUAGE_VALIDATOR } from '@app/shared/form-validators/video-captions-validators' |
5c5bcea2 | 4 | import { FormReactive, FormReactiveService } from '@app/shared/shared-forms' |
67ed6552 | 5 | import { VideoCaptionEdit } from '@app/shared/shared-main' |
63347a0f | 6 | import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap' |
2989628b | 7 | import { HTMLServerConfig, VideoConstant } from '@shared/models' |
40e87e9e C |
8 | |
9 | @Component({ | |
10 | selector: 'my-video-caption-add-modal', | |
11 | styleUrls: [ './video-caption-add-modal.component.scss' ], | |
12 | templateUrl: './video-caption-add-modal.component.html' | |
13 | }) | |
14 | ||
15 | export class VideoCaptionAddModalComponent extends FormReactive implements OnInit { | |
16 | @Input() existingCaptions: string[] | |
2989628b | 17 | @Input() serverConfig: HTMLServerConfig |
40e87e9e C |
18 | |
19 | @Output() captionAdded = new EventEmitter<VideoCaptionEdit>() | |
20 | ||
f36da21e | 21 | @ViewChild('modal', { static: true }) modal: ElementRef |
40e87e9e | 22 | |
c199c427 | 23 | videoCaptionLanguages: VideoConstant<string>[] = [] |
40e87e9e | 24 | |
63347a0f | 25 | private openedModal: NgbModalRef |
40e87e9e C |
26 | private closingModal = false |
27 | ||
28 | constructor ( | |
5c5bcea2 | 29 | protected formReactiveService: FormReactiveService, |
63347a0f | 30 | private modalService: NgbModal, |
7ed1edbb | 31 | private serverService: ServerService |
40e87e9e C |
32 | ) { |
33 | super() | |
34 | } | |
35 | ||
36 | get videoCaptionExtensions () { | |
ba430d75 | 37 | return this.serverConfig.videoCaption.file.extensions |
40e87e9e C |
38 | } |
39 | ||
40 | get videoCaptionMaxSize () { | |
ba430d75 | 41 | return this.serverConfig.videoCaption.file.size.max |
40e87e9e C |
42 | } |
43 | ||
a2c5cd4a C |
44 | getReactiveFileButtonTooltip () { |
45 | return `(extensions: ${this.videoCaptionExtensions.join(', ')})` | |
46 | } | |
47 | ||
40e87e9e | 48 | ngOnInit () { |
ba430d75 C |
49 | this.serverService.getVideoLanguages() |
50 | .subscribe(languages => this.videoCaptionLanguages = languages) | |
40e87e9e C |
51 | |
52 | this.buildForm({ | |
7ed1edbb C |
53 | language: VIDEO_CAPTION_LANGUAGE_VALIDATOR, |
54 | captionfile: VIDEO_CAPTION_FILE_VALIDATOR | |
40e87e9e C |
55 | }) |
56 | } | |
57 | ||
58 | show () { | |
f4001cf4 C |
59 | this.closingModal = false |
60 | ||
24e7916c | 61 | this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false }) |
40e87e9e C |
62 | } |
63 | ||
64 | hide () { | |
f4001cf4 | 65 | this.closingModal = true |
63347a0f | 66 | this.openedModal.close() |
d8c9996c | 67 | this.form.reset() |
40e87e9e C |
68 | } |
69 | ||
70 | isReplacingExistingCaption () { | |
71 | if (this.closingModal === true) return false | |
72 | ||
9df52d66 | 73 | const languageId = this.form.value['language'] |
40e87e9e | 74 | |
9df52d66 | 75 | return languageId && this.existingCaptions.includes(languageId) |
40e87e9e C |
76 | } |
77 | ||
98ab5dc8 | 78 | addCaption () { |
9df52d66 | 79 | const languageId = this.form.value['language'] |
c199c427 | 80 | const languageObject = this.videoCaptionLanguages.find(l => l.id === languageId) |
40e87e9e C |
81 | |
82 | this.captionAdded.emit({ | |
83 | language: languageObject, | |
57d74ec8 | 84 | captionfile: this.form.value['captionfile'], |
85 | action: 'CREATE' | |
40e87e9e C |
86 | }) |
87 | ||
259dd796 | 88 | this.hide() |
40e87e9e C |
89 | } |
90 | } |