import { Component, OnInit, forwardRef } from '@angular/core';
import { Input } from '@angular/core';
import { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms';
const noop = () => {
};
export const CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR: any = {
    provide: NG_VALUE_ACCESSOR,
    useExisting: forwardRef(() => ToggleComponent),
    multi: true
};
@Component({
  selector: 'fu-toggle',
  templateUrl: './toggle.component.html',
  styleUrls: ['./toggle.component.scss'],
  providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR]
})
export class ToggleComponent implements OnInit, ControlValueAccessor {
  private onChangeCallback: (_: any) => void = noop;
  private onTouchedCallback: () => void = noop;

  private innerValue: any;

  @Input()
  isRound: boolean;
  @Input()
  activeColor: string;
  @Input()
  activeHolderColor: string;
  @Input()
  color: string;
  @Input()
  holderColor: string;
  getBackColor(): string {
      if (this.innerValue) {
        return this.activeColor || this.color || '#2196F3';
      } else {
        return this.color || '#ccc';
      }
  }
  getHolderColor(): string {
      if (this.innerValue) {
          return this.activeHolderColor || this.holderColor || '#fff';
      } else {
          return this.holderColor || '#fff';
      }
  }
  // get accessor
  get value(): any {
      return this.innerValue;
  }

  // set accessor including call the onchange callback
  set value(v: any) {
      if (v !== this.innerValue) {
          this.innerValue = v;
          this.onChangeCallback(v);
      }
  }
  writeValue(value: any): void {
    if (value !== this.innerValue) {
        this.innerValue = value;
    }
  }
  registerOnChange(fn: any): void {
      this.onChangeCallback = fn;
  }
  // Set touched on blur
  onBlur() {
      this.onTouchedCallback();
  }

  registerOnTouched(fn: any): void {
      this.onTouchedCallback = fn;
  }
  setDisabledState?(isDisabled: boolean): void {
      throw new Error('Method not implemented.');
  }

  constructor() {
  }
  ngOnInit() {
    console.log(this.isRound);
  }
}