]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blobdiff - client/src/app/core/confirm/confirm.component.ts
remove unused imports
[github/Chocobozzz/PeerTube.git] / client / src / app / core / confirm / confirm.component.ts
index 0515d969aa7575d4021ccc306a32d7bb4ef32714..5138b78483e4a204971bc22a243fec3425d8ebe8 100644 (file)
@@ -1,62 +1,68 @@
-import { Component, HostListener, OnInit, ViewChild } from '@angular/core'
-
-import { ModalDirective } from 'ngx-bootstrap/modal'
-
+import { Component, ElementRef, HostListener, OnInit, ViewChild } from '@angular/core'
 import { ConfirmService } from './confirm.service'
-
-export interface ConfigChangedEvent {
-  columns: { [id: string]: { isDisplayed: boolean } }
-  config: { resultsPerPage: number }
-}
+import { I18n } from '@ngx-translate/i18n-polyfill'
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
+import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
 
 @Component({
   selector: 'my-confirm',
   templateUrl: './confirm.component.html',
-  styles: [ '.button { padding: 0 13px; }' ]
+  styleUrls: [ './confirm.component.scss' ]
 })
 export class ConfirmComponent implements OnInit {
-  @ViewChild('confirmModal') confirmModal: ModalDirective
+  @ViewChild('confirmModal') confirmModal: ElementRef
 
   title = ''
   message = ''
+  expectedInputValue = ''
+  inputLabel = ''
 
-  constructor (private confirmService: ConfirmService) {
-    // Empty
-  }
+  inputValue = ''
+  confirmButtonText = ''
 
-  ngOnInit () {
-    this.confirmModal.config = {
-      backdrop: 'static',
-      keyboard: false
-    }
+  private openedModal: NgbModalRef
+
+  constructor (
+    private modalService: NgbModal,
+    private confirmService: ConfirmService,
+    private i18n: I18n
+  ) { }
 
+  ngOnInit () {
     this.confirmService.showConfirm.subscribe(
-      ({ title, message }) => {
+      ({ title, message, expectedInputValue, inputLabel, confirmButtonText }) => {
         this.title = title
         this.message = message
 
+        this.inputLabel = inputLabel
+        this.expectedInputValue = expectedInputValue
+
+        this.confirmButtonText = confirmButtonText || this.i18n('Confirm')
+
         this.showModal()
       }
     )
   }
 
-  @HostListener('keydown.enter')
+  @HostListener('document:keydown.enter')
   confirm () {
-    this.confirmService.confirmResponse.next(true)
-    this.hideModal()
+    if (this.openedModal) this.openedModal.close()
   }
 
-  @HostListener('keydown.esc')
-  cancel () {
-    this.confirmService.confirmResponse.next(false)
-    this.hideModal()
+  isConfirmationDisabled () {
+    // No input validation
+    if (!this.inputLabel || !this.expectedInputValue) return false
+
+    return this.expectedInputValue !== this.inputValue
   }
 
   showModal () {
-    this.confirmModal.show()
-  }
+    this.inputValue = ''
+
+    this.openedModal = this.modalService.open(this.confirmModal)
 
-  hideModal () {
-    this.confirmModal.hide()
+    this.openedModal.result
+        .then(() => this.confirmService.confirmResponse.next(true))
+        .catch(() => this.confirmService.confirmResponse.next(false))
   }
 }