/*
 * ============LICENSE_START==========================================
 * ONAP Portal SDK
 * ===================================================================
 * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
 * ===================================================================
 *
 * Unless otherwise specified, all software contained herein is licensed
 * under the Apache License, Version 2.0 (the "License");
 * you may not use this software except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *             http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 * Unless otherwise specified, all documentation contained herein is licensed
 * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
 * you may not use this documentation except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *             https://creativecommons.org/licenses/by/4.0/
 *
 * Unless required by applicable law or agreed to in writing, documentation
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 * ============LICENSE_END============================================
 *
 * 
 */

import {coerceBooleanProperty} from '@angular/cdk/coercion';
import {Component, Input, OnDestroy, OnInit, Optional, ViewChild, ContentChild, TemplateRef} from '@angular/core';
import {MatSortHeader} from '@angular/material';
import {MatColumnDef, MatTable} from '@angular/material';

@Component({
  selector: 'rdp-column',
  template: `
  <ng-container matColumnDef>
      <div *ngIf="_sortable">
       <th mat-header-cell *matHeaderCellDef mat-sort-header> {{ label }} </th>
      </div>
      <div *ngIf="!_sortable">
          <th mat-header-cell *matHeaderCellDef> {{ label }} </th>
      </div>
      <td mat-cell *matCellDef="let data" id="{{ label }}">
          {{ getData(data) }}
      </td>
  </ng-container>`
})
export class RdpColumnComponent<T> implements OnDestroy, OnInit {

  // @ContentChild(TemplateRef) template: TemplateRef<any>;
  // @ContentChild('colContent') colContentTmpl: TemplateRef<any>;

  /** Column name that should be used to reference this column. */
  @Input()
  get name(): string { return this._name; }
  set name(name: string) {
      this._name = name;
      this.columnDef.name = name;
  }
  _name: string;

  /**
   * Text label that should be used for the column header. If this property is not
   * set, the header text will default to the column name.
   */
  @Input() label: string;

   /**
   * Text label that should be used for the column header. If this property is not
   * set, the header text will default to the column name.
   */
  @Input() sort: boolean;

  /**
   * Accessor function to retrieve the data should be provided to the cell. If this
   * property is not set, the data cells will assume that the column name is the same
   * as the data property the cells should display.
   */
  @Input() dataAccessor: ((data: T, name: string) => string);

  @ViewChild(MatColumnDef) columnDef: MatColumnDef;
  @ViewChild(MatSortHeader) sortHeader: MatSortHeader;

  constructor(@Optional() public table: MatTable<any>) {}

  _sortable: boolean;

  ngOnInit() {
      if (this.table) {
          //console.log("Column name --"+this._name+ " Is Sorting  applied  ",this.sort);
          this._sortable = coerceBooleanProperty(this.sort);
          //console.log("this._sortable ",this._sortable);
          if(this._name === 'delete' || this._name === 'edit'){
              //Don't add delete column as this column is not added dynamically.
          }else{
              this.table.addColumnDef(this.columnDef);
          }
      }
  }

  ngOnDestroy() {
      if (this.table) {
          this.table.removeColumnDef(this.columnDef);
      }
  }

  getData(data: T): any {
      return this.dataAccessor ? this.dataAccessor(data, this.name) : (data as any)[this.name];
  }
}