import { Component, OnInit, ChangeDetectionStrategy, forwardRef, Input, Output, EventEmitter, ViewChild, ElementRef, Renderer2 } from '@angular/core';
import { NG_VALUE_ACCESSOR, ControlContainer, NgForm, DefaultValueAccessor } from '@angular/forms';
import { UuidUtils } from '../../utilities/uuid-utils';

@Component({
  selector: 'rbj-email-input',
  templateUrl: './email-input.component.html',
  styleUrls: ['./email-input.component.scss'],
  providers: [
    {
      provide: NG_VALUE_ACCESSOR,
      useExisting: forwardRef(() => EmailInputComponent),
      multi: true
    }
  ],
  viewProviders: [{ provide: ControlContainer, useExisting: NgForm }]
})
export class EmailInputComponent implements OnInit {

  private _value: string;
  disabledState: boolean = false;
  readOnly: boolean = false;

  @Input()
  public get value(): string {
    return this._value;
  }

  onChange = (value: string) => { };
  onTouched = () => { };

  uuid: string = UuidUtils.generate();
  @Input() id?= "";
  @Input() placeholder: string;
  @Input() class: string;
  @Input() size: string = 'medium';
  public set value(v: string) {
    if (this._value != v) {
      this._value = v;
      this.onChange(v)
    }
  }

  @Input("readonly")
  public set input_readOnly(value) {
    this.readOnly = typeof value !== "undefined" && value !== false;
  }
  @ViewChild('inputBox', { static: true }) input: ElementRef;

  constructor(
    private renderer: Renderer2,
    private el: ElementRef) { }

  ngAfterViewInit() {
    this.renderer.removeAttribute(this.el.nativeElement, 'id')
  }
  writeValue(value: any): void {
    this.value = value;
  }

  registerOnChange(fn: (value: string) => void): void {
    this.onChange = fn;
  }
  registerOnTouched(fn: any): void {
    this.onTouched = fn;
  }
  setDisabledState(isDisabled: boolean): void {
    this.disabledState = isDisabled;
  }

  ngOnInit() {
  }

}
