import {Component, Inject, OnInit} from "@angular/core";
import {Chart} from "chart.js";
import {DOCUMENT} from '@angular/common';
import {mockGraphConfig} from "../config/mocks/mock-graph";
import {graphOptions} from "../config/graph-canevas-options";
import {ConfigService} from "../services/config.service";
import {mockPoll3} from "../config/mocks/mock-poll3";

@Component({
    selector: "framadate-poll-graphic",
    templateUrl: "./poll-graphic.component.html",
    styleUrls: ["./poll-graphic.component.scss"]
})
export class PollGraphicComponent implements OnInit {
    isColorblind: boolean = false;
    pollConfigRetrieved: any = mockPoll3;
    graphicConfig: any = mockGraphConfig;
    preferred: any = "rien";
    yesList: number[] = [];
    maybeList: number[] = [];
    noList: number[] = [];
    nbPoll: number = 0;
    dateList: string[] = [];

    constructor(@Inject(DOCUMENT) private document: any,
                private config: ConfigService) {
    }

    ngOnInit() {
        this.formatDataAnswers(this.graphicConfig);
        this.isColorblind = false;
        this.pollConfigRetrieved = new Chart(this.document.getElementById("graph"), {
            type: "horizontalBar",
            data: {
                labels: this.pollConfigRetrieved.choices.map(choice => choice.name),
                datasets: [
                    {
                        type: "horizontalBar",
                        stack: "Yes",
                        backgroundColor: "#429a00",
                        data: this.yesList
                    },
                    {
                        type: "horizontalBar",
                        stack: "Yes",
                        backgroundColor: "#f5a623",
                        data: this.maybeList
                    },
                    {
                        type: "horizontalBar",
                        stack: "No",
                        backgroundColor: "#cd0000",
                        data: this.noList
                    }
                ]
            },
            options: graphOptions
        });
    }

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

    formatDataAnswers(poll) {
        // if (poll && poll.pollType === "date") {
        this.initPollCounter();
        poll.answers.forEach(response => {
            switch (response.text) {
                case "yes":
                    this.yesList[this.nbPoll - 1]++;
                    break;
                case "maybe":
                    this.maybeList[this.nbPoll - 1]++;
                    break;
                case "no":
                    this.noList[this.nbPoll - 1]++;
                    break;
            }
        });
        // }
    }

    initPollCounter() {
        this.nbPoll++;
        this.dateList[this.nbPoll - 1] = "jeudi";
        this.maybeList[this.nbPoll - 1] = 0;
        this.yesList[this.nbPoll - 1] = 0;
        this.noList[this.nbPoll - 1] = 0;
    }
}