import { Component, OnInit } from "@angular/core";
import { Chart } from "chart.js";

@Component({
    selector: "framadate-poll-graphic",
    templateUrl: "./poll-graphic.component.html",
    styleUrls: ["./poll-graphic.component.scss"]
})
export class PollGraphicComponent implements OnInit {
    isColorblind: boolean;
    lineChart: Chart;
    pollData: any;

    constructor() {}

    ngOnInit() {

        //const data = this.formatDataAnswers();

        this.isColorblind = false;
        this.pollData = new Chart(document.getElementById("graph"), {
            type: 'horizontalBar',
            data: {
              labels: ["Je 17 août 8h00", "Je 17 août 8h00", "Je 17 août 8h00"],
              datasets: [{
                type: "horizontalBar",
                stack: "Yes",
                backgroundColor: "#429a00",
                data: [30, 31, 32, 33, 34, 35, 36],
              }, {
                type: "horizontalBar",
                stack: "Yes",
                backgroundColor: "#f5a623",
                data: [15, 16, 17, 18, 19, 20, 21],
              }, {
                type: "horizontalBar",
                stack: "No",
                backgroundColor: "#cd0000",      
                data: [20, 21, 22, 23, 24, 25, 26],
              }]
            },
            options: {
                legend:{display:false},
              scales: {
                xAxes: [{
                    gridLines: {drawBorder:false, display:false},
                    display:false,
                  stacked: true,
                  ticks: {
                    beginAtZero: true,
                    maxRotation: 0,
                    minRotation: 0
                  }
                }],
                yAxes: [{
                gridLines: {drawBorder: true, display: false},
                display:true,
                  stacked: true,
                }]
              },
            }
          });
        }

    setColorblind() {
        this.isColorblind = !this.isColorblind;
    }

    formatDataAnswers(){

    }

    
}