import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ChangeDetectorRef, OnInit } from '@angular/core';
import { CheckboxOption } from './models';
import { WindowRef } from './services/window-ref.service';

@Component({
  selector: 'app-checkbox',
  templateUrl: './checkbox.component.html',
  styleUrls: ['./checkbox.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class CheckboxComponent implements OnInit {
  @Input() option: CheckboxOption;
  @Input() set negative(val) {
    this._negative = val;
    this.cdrf.detectChanges();
  }
  @Output() valueChanges: EventEmitter<boolean> = new EventEmitter();
  _negative = false;
  isIPad = false;

  constructor(private cdrf: ChangeDetectorRef, private windowRef: WindowRef) {}

  ngOnInit() {
    this.isIPad = this.isIPadEnv();
  }

  onChange() {
    if (!this.option.disabled) {
      this.option.selected = !this.option.selected;
      this.valueChanges.emit(this.option.selected);
    }
  }

  public isIPadEnv() {
    const navigator = this.windowRef.nativeWindow.navigator as Navigator;
    const userAgent = navigator.userAgent.toLowerCase(),
      ios = /iphone|ipod|ipad/.test(userAgent);
    return ios;
  }
}
