import { Component, Input, OnInit } from '@angular/core';

import { Chart } from 'angular-highcharts';
import * as Highcharts from 'highcharts';
import { utc } from 'moment';

@Component({
  selector: 'byte-avg-intent-by-customer',
  templateUrl: './avg-intent-by-customer.component.html',
  styleUrls: ['./avg-intent-by-customer.component.scss']
})
export class AvgIntentByCustomerComponent implements OnInit {


  chart: Chart;

  @Input()
  data: Array<number> = [];

  @Input()
  minDate: Date = new Date();

  constructor() { }

  ngOnInit() {
    if (!this.data) {
      return;
    }
    this.chart = new Chart({
      title: {
        text: ''
      },
      exporting: {
        enabled: false
      },
      credits: {
        enabled: false
      },
      legend: {
        enabled: false
      },
      chart: {
        renderTo: 'container',
        type: 'column',
        zoomType: 'xy'
      },
      xAxis: {
        type: 'datetime',
        tickInterval: 86400000,
        labels: {
          formatter() {
            return Highcharts.dateFormat('%e - %b',
            this.value);
          }
        }
      },
      yAxis: {
        title: {
          text: ''
        }
      },
      series: [
        {
          name: 'Promedio',
          pointStart: this.getDate(this.minDate),
          pointInterval: 86400000,
          dataLabels: {
            inside: false,
            enabled: true,
            style: {
              color: 'white'
            }
          },
          data: this.data

        }
      ] as Array<any>
    });
  }

  private getDate(date: Date): any {
    // let dateNumber = Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDay(), 0, 0, 0);
    // console.log(dateNumber);
    // return dateNumber;

    return (new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0))).getTime();
  }


}
