class ChartManager {

    defaultColors = [
        '#2ec7c9','#b6a2de','#5ab1ef','#ffb980','#d87a80',
        '#8d98b3','#e5cf0d','#97b552','#95706d','#dc69aa',
        '#07a2a4','#9a7fd1','#588dd5','#f5994e','#c05050',
        '#59678c','#c9ab00','#7eb00a','#6f5553','#c14089',
        '#66bb6a'
    ];

    defaultLoadingOptions = {
        text: 'LADE DATEN',
        maskColor: '#353f53',
        color: '#fff',
        textColor: '#fff',
        fontSize: 15
    };

    defaultGlobalTextStyle = {
        fontFamily: 'Roboto, Arial, Verdana, sans-serif',
        fontSize: 13
    };

    isModuleSet() {
        let isset = (typeof echarts != 'undefined');
        if (isset == false) console.warn('Warning - echarts.min.js is not loaded.');
        return isset;
    }

    getColors(objectData, elementObject) {
        return objectData?.colors ?? (JSON.parse(elementObject.attr('colors')) ?? chartManager.defaultColors)
    }

    getAnimationDuration(objectData, elementObject) {
        return objectData?.animationDuration ?? (elementObject.attr('animation-duration') ?? 750);
    }

    getYAxisLabelValueFormat(objectData, elementObject) {
        // ex '{value} users'  - https://echarts.apache.org/en/option.html#yAxis.axisLabel.formatter
        return objectData?.yAxisLabelValueFormat ?? (elementObject.attr('y-axis-label-value-format') ?? null);
    }

    getSeriesStacked(objectData, elementObject) {
        return objectData?.stacked ?? ((elementObject.attr('stacked') == 'true' || elementObject.attr('stacked') == true) ?? false);
    }

    getSeriesMarkLine(objectData, elementObject) {
        // min | max | average
        return objectData?.markLine ?? (elementObject.attr('mark-line') ?? null);
    }

    getChartCategories(objectData, elementObject) {
        return objectData?.categories ?? (JSON.parse(elementObject.attr('categories')) ?? null);
    }

    getChartSeries(objectData, elementObject) {
        return objectData?.series ?? (JSON.parse(elementObject.attr('series')) ?? null);
    }

    getChartSeriesNames(series) {
        return series && series.map(function(item){ return item.name });
    }

    getRawData(objectData, elementObject) {
        return objectData?.rawData ?? (elementObject.attr('raw') ? JSON.parse(elementObject.attr('raw')) : null);
    }

    getObjectData(elementObject) {
        return elementObject.attr('data') ? JSON.parse(elementObject.attr('data')) : null;
    }

    setSeriesMarkLine(series, seriesData, markLine) {
        if(seriesData.markLine !== undefined && ['min', 'max', 'average'].includes(markLine)) {

            series.markLine = {
                data: [{
                    type: seriesData.markLine,
                    name: seriesData.markLine[0].toUpperCase() + seriesData.markLine.substring(1),
                }]
            };

        } else if(markLine != null && ['min', 'max', 'average'].includes(markLine)) {

            series.markLine = {
                data: [{
                    type: markLine,
                    name: markLine[0].toUpperCase() + markLine.substring(1),
                }]
            };
        }
    }

    setResizeEvent(chartElement, chartInstance) {
        // Resize function
        let triggerChartResize = function() {
            chartElement && chartInstance.resize();
        };

        // On sidebar width change
        let sidebarToggle = document.querySelector('.sidebar-control');
        sidebarToggle && sidebarToggle.addEventListener('click', triggerChartResize);

        // On window resize
        let resizeCharts;
        window.addEventListener('resize', function() {
            clearTimeout(resizeCharts);
            resizeCharts = setTimeout(function () {
                triggerChartResize();
            }, 200);
        });
    }

}