import { DataControlFieldComponent } from '../../data-control-field/data-control-field.component';
import { UnitType } from '../../../contracts/UnitType';

/**
 * Const used as key for the background color style property
 *  @type {*} */
const backColorString = 'background-color';

/**
 * Const used as key for the width style property
 *  @type {*} */
const widthString = 'width';

/**
 * ColumnStyle manager
 *
 * This class is used to set the GridView columns styles. Including headers, rows, cells, and footers
 *
 * @export
 * @class ColumnStyleManager
 */
export class ColumnStyleManager {
  /**
   * Creates an instance of ColumnStyleManager.
   * @memberof ColumnStyleManager
   */
  constructor() {}

  /**
   * Object used to set the Cell Style
   * @private
   * @memberof ColumnStyleManager
   */
  private cellStyleObject = {
    'background-color': null,
    width: null
  };

  /**
   * Gets the cell style object
   *
   * @readonly
   * @type {*}
   * @memberof ColumnStyleManager
   */
  get cellStyle(): any {
    return this.cellStyleObject;
  }

  /**
   * Applies the cell style
   *
   * This is because is needed to validate if applies the RowStyle props or the cell style of DataControlFields
   * @param {DataControlFieldComponent | any} columnControl the column control model
   * @param {*} rowStyle the row style object
   * @return {*}  {*}
   * @memberof ColumnStyleManager
   */
  applyCellStyle(
    columnControl: DataControlFieldComponent | any,
    rowStyle: any
  ): any {
    const unitType: UnitType = (UnitType as any)[
      columnControl.itemStyle?.Width?.Type
    ];
    const itemStyleWidth = columnControl.itemStyle?.Width?.Value;
    /* c8 ignore next 2 */
    const itemStyleBackgroundColor =
      columnControl.itemStyle?.BackColor ?? rowStyle?.BackColor ?? null;
    if (itemStyleWidth) {
      const width =
        unitType === UnitType.Percentage
          ? `${itemStyleWidth}%`
          : `${itemStyleWidth}px`;
      this.cellStyleObject = this.applyPropToStyleObject(
        widthString,
        width,
        this.cellStyleObject
      );
    }
    this.applyPropToStyleObject(
      backColorString,
      itemStyleBackgroundColor,
      this.cellStyleObject
    );
    return this.cellStyleObject;
  }

  /**
   * Applies the property value to a given style object (cellStyleObjetc, headerStyleObject, etc)
   *
   * @param {string} prop The property to be applied
   * @param {string} value The value of the property
   * @param {*} styleObject the object to apply the property. This could be the HeaderStyle, rowStyle, etc
   * @return {*}  {*}
   * @memberof ColumnStyleManager
   */
  applyPropToStyleObject(prop: string, value: string, styleObject: any): any {
    styleObject[prop] = value;
    return styleObject;
  }
}