import { Component, Injector, Input, OnInit, Optional } from '@angular/core';
import {
  GridColumnDefinition,
  GridLength,
  ModelProxy,
  GridUnitType,
} from '@mobilize/wms-framework';

/**
 * Angular Component for the ColumnDefinition.
 *
 * @export
 * @class GridColumnDefinitionComponent
 * @implements {OnInit}
 */
@Component({
  selector: 'wm-grid-column-definition',
  templateUrl: './grid-column-definition.component.html',
  styleUrls: ['./grid-column-definition.component.scss'],
})
export class GridColumnDefinitionComponent implements OnInit {
  /**
   * Object with properties and events for the GridColumnDefinition.
   *
   * @type {GridColumnDefinition}
   * @memberof GridColumnDefinitionComponent
   */
  @Input()
  model: GridColumnDefinition;

  /**
   * ModelProxy is a copy of the model, used on the component initial building to prevent crashes with external bindings.
   *
   * @private
   * @type {GridColumnDefinition}
   * @memberof GridColumnDefinitionComponent
   */
  private modelProxy: GridColumnDefinition =
    ModelProxy.create<GridColumnDefinition>();

  /**
   * Creates an instance of GridColumnDefinitionComponent.
   *
   * @param {Injector} injector
   * @param {GridColumnDefinition} [injectedModel=null]
   * @memberof GridColumnDefinitionComponent
   */
  /* istanbul ignore next */
  constructor(
    private injector: Injector,
    @Optional() protected injectedModel: GridColumnDefinition = null
  ) {
    this.model = injectedModel;
  }

  /**
   * Property used to save the column width.
   *
   * @memberof GridColumnDefinitionComponent
   */
  @Input()
  set width(value: string) {
    if (Number(value)) {
      this.modelProxy.Width = new GridLength(Number(value), GridUnitType.Pixel);
    } else if (value.toLowerCase() === 'auto') {
      this.modelProxy.Width = new GridLength(0, GridUnitType.Auto);
    } /* istanbul ignore else */ else if (value.endsWith('*')) {
      const starNumber =
        Number(value.slice(0, -1)) === 0 ? 1 : Number(value.slice(0, -1));
      this.modelProxy.Width = new GridLength(starNumber, GridUnitType.Star);
    }
  }

  /**
   * Sets the maxWidth for the column
   *
   * @memberof GridColumnDefinitionComponent
   */
  @Input()
  set maxWidth(value: number) {
    this.modelProxy.MaxWidth = value;
  }

  /**
   * Gets the maxWidth for the column
   *
   * @readonly
   * @type {number}
   * @memberof GridColumnDefinitionComponent
   */
  get maxWidth(): number {
    return this.model.MaxWidth;
  }

  /**
   * Sets the minWidth for the column
   *
   * @memberof GridColumnDefinitionComponent
   */
  @Input()
  set minWidth(value: number) {
    this.modelProxy.MinWidth = value;
  }

  /**
   * Gets the maxWidth for the column
   *
   * @readonly
   * @type {number}
   * @memberof GridColumnDefinitionComponent
   */
  get minWidth(): number {
    return this.model.MinWidth;
  }

  /**
   * Gets the Width value from the GridColumnDefinition model.
   *
   * @readonly
   * @type {number}
   * @memberof GridColumnDefinitionComponent
   */
  get widthValue(): number {
    return this.model.Width.Value;
  }

  /**
   * Angular lifecycle.
   *
   * @memberof GridColumnDefinitionComponent
   */
  ngOnInit(): void {
    this.model = this.model || this.injectedModel || new GridColumnDefinition();
    ModelProxy.copy(this.modelProxy, this.model);
    this.modelProxy = this.model;
  }
}