1 import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
4 selector: 'my-simple-search-input',
5 templateUrl: './simple-search-input.component.html',
6 styleUrls: [ './simple-search-input.component.scss' ]
8 export class SimpleSearchInputComponent implements OnInit {
9 @ViewChild('ref') input: ElementRef
11 @Input() name = 'search'
12 @Input() placeholder = $localize`Search`
13 @Input() iconTitle = $localize`Search`
14 @Input() alwaysShow = true
16 @Output() searchChanged = new EventEmitter<string>()
17 @Output() inputDisplayChanged = new EventEmitter<boolean>()
22 private hasAlreadySentSearch = false
25 if (this.isInputShown()) this.showInput(false)
29 if (this.alwaysShow) return true
31 return this.inputShown
35 if (!this.isInputShown()) {
43 showInput (focus = true) {
44 this.inputShown = true
45 this.inputDisplayChanged.emit(this.inputShown)
48 setTimeout(() => this.input.nativeElement.focus())
53 this.inputShown = false
55 if (this.isInputShown() === false) {
56 this.inputDisplayChanged.emit(this.inputShown)
61 if (this.value) return
67 this.hasAlreadySentSearch = true
68 this.searchChanged.emit(this.value)
74 if (this.hasAlreadySentSearch) this.sendSearch()