//VERSUS ESPECIALMENTE PARA C1
export class Versus2 {

    constructor() {

        this.height = null;
        this.title = null;
        this.series = [];
        this.size = null;
        this.width = null;
        this.subtitle = null;
        this.categories = null;
        this.yLabelFormat = '{value:.2f}%';
        this.yTitle = 'Tiempo %';
        this.yMin = 0;
        this.yMax = 100;
        this.inverted = false;
        this.legend = false;
        this.dataLabels = true;
        this.dataLabelsFormat = '{value:.2f}%';
        this.dataLabelsFormat2 = '{value:.2f}%';
        this.export = false;
        this.metrica = "";
        this.metricas = [];
        this.headerTooltip;
        this.bodyTooltip;

    }

    setMetricas(metrica1,metrica2,metrica3){
        this.metricas = [metrica1,metrica2,metrica3];
    }

    setSeries(series) {
        this.series = series;
    };

    setInverted(inverted) {
        this.inverted = inverted;
    };

    setHeight(height) {
        this.height = height;
    };

    setWidth(width) {
        this.width = width;
    };

    setTitle(title) {
        this.title = title;
    };

    setSubtitle(subtitle) {
        this.subtitle = subtitle;
    };

    setYMax(yMax) {
        this.yMax = yMax;
    };

    setYMin(yMin) {
        this.yMin = yMin;
    };

    setCategories(categories) {
        this.categories = categories;
    };

    setYLabelFormat(yLabelFormat){
        this.yLabelFormat = yLabelFormat;
    };

    setYTitle(yTitle){
        this.yTitle = yTitle;
    };

    setLegend(legend){
        this.legend = legend;
    };

    setDataLabels(dataLabels){
        this.dataLabels = dataLabels;
    };

    setDataLabelsFormat(dataLabelsFormat){
        this.dataLabelsFormat = dataLabelsFormat;
    };

    setDataLabelsFormat2(dataLabelsFormat){
        this.dataLabelsFormat2 = dataLabelsFormat;
    };

    setExport(exporting) {
        this.export = exporting;
    };


    
    
    Draw(){
        var  VersusDefaultChart = {

            chart: {
                zoomType: 'xy',
                // reflow: true
            },
            exporting:{
                enabled: this.export
            },
            credits:{
                enabled: false
            },
            lang: {
                noData: "Datos Insuficientes."
            },
            title: {
                text: this.title
            },
            subtitle: {
                text: this.subtitle
            },
            xAxis: [{
                categories: this.categories,
                crosshair: true
            }],
            yAxis: [{ // Primary yAxis
                labels: {
                    format: this.dataLabelsFormat,
                    style: {
                        // color: Highcharts.getOptions().colors[1]
                    }
                },
                max:this.yMax,
                min:this.yMin,
                softMax: 100,
                title: {
                    text: null,
                    style: {
                     // color: Highcharts.getOptions().colors[1]
                    }
                }
            }, { // Secondary yAxis
                title: {
                    text: null,
                    style: {
                        // color: Highcharts.getOptions().colors[0]
                    }
                },
                
                max:this.yMax,
                min:this.yMin,
                softMax: 100,
                labels: {
                    format: this.dataLabelsFormat2,
                    style: {
                        // color: Highcharts.getOptions().colors[0]
                    }
                },
                opposite: true
            }],
            tooltip: {
                headerFormat: '<span style="font-size:15px">{point.key}</span><br>',
                pointFormat: '<span class= "uk-center" style="font-size:13px"><span  style="color:{point.color};"> ■ </span><span>{series.name}: </span>{point.y:.2f}'+'{series.tooltipOptions.valueSuffix}'+'</span><br>',
                shared: true,
                useHTML:true
            },
            // legend: {
            //     layout: 'vertical',
            //     align: 'left',
            //     x: 120,
            //     verticalAlign: 'top',
            //     y: 100,
            //     floating: true,
            //     backgroundColor: '#FFFFFF'
            // },
            series: this.series

        };

    return VersusDefaultChart;
    }

}
