/**
 * Un composant de 'PlotFunction' qui permet à l'utilisateur de séléctionner le type de fonction à appliquer : FFT, SUM, ...
 */
Ext.define('amdaPlotComp.plotFunction.CreatePlot', {
    extend: 'Ext.window.Window',
    requires: [
        'amdaUI.PlotlyContainer'
    ],

    initComponent: function () {

        this.emptyChartConfig = {
            xtype: 'amdaUI.PlotlyContainer',
            id: 'visu-chart',
        };

        const config =
        {
            title: 'Apply a Function on Interval',
            width: 700,
            height: 500,
            layout: 'fit',
            bodyStyle: { background: '#FFFFFF' },
            modal: false,
            resizable: true,
            maximizable: true,
            items: [
                this.emptyChartConfig
            ]
        };

        Ext.apply(this, config);
        this.callParent(arguments);
    },

    getXYData: function (data, serie_label) {
        const separatorItems = "|";
        const separator = ";";

        let legends = serie_label.split(separator);
        legends.pop();

        let items = data.split(separatorItems);
        items.pop();

        const xs = [];
        const ys = [];
        const labels = [];
        for (j = 0; j < legends.length; j++) {
            let i;
            const y = [];
            const x = [];
            for (i = 0; i < items.length; i++) {
                const temp = items[i].split(separator);
                x.push(this.timeConverter(temp[0]));
                y.push(temp[j + 1]);
            }
            ys.push(y);
            xs.push(x);
            labels.push(legends[j]);
        }

        return { xs: xs, ys: ys, labels: labels };
    },

    timeConverter: function (_timestamp) {
        var a = new Date(_timestamp * 1000);
        var year = a.getUTCFullYear();
        var month = a.getUTCMonth() + 1;
        var date = a.getUTCDate();
        var hour = a.getUTCHours();
        var min = a.getUTCMinutes();
        var sec = a.getUTCSeconds();
        var time = year + '-' + month + '-' + date + ' ' + hour + ':' + min + ':' + sec;
        return time;
    },

    applyFunction: function (y, dimSize) {
        const type = this.plotFunctionType;
        const valDict = type.getValues();
        const fct = valDict[type.plotFunctionItems.type.name];
        let out_y = [];
        switch (fct) {
            case type.plotFunctionItems.type.values.sum:
                out_y = y;
                break;
            case type.plotFunctionItems.type.values.fft:

                break;
            case type.plotFunctionItems.type.values.avg:
                if (dimSize === -1) {
                    out_y = y.map(e => e / y.length);
                } else {
                    out_y = y.map(e => e / dimSize);
                }
                break;

            default:
                break;
        }
        return out_y;
    },



    plot: function () {
        const param = this.xmlDoc.getElementsByTagName('parameter');
        const traces = [];
        let yAxisLabel = "";
        let i;
        for (i = 0; i < param.length; i++) {
            const param_name = param[i].getAttribute('name');
            const param_unit = param[i].getAttribute('unit');
            const serie = param[i].getElementsByTagName('serie');

            yAxisLabel += param_unit + "<br>";

            for (let si = 0; si < serie.length; si++) {
                const serie_label = serie[si].getAttribute('serie_label');
                const data_ = this.getXYData(serie[si].getAttribute('data'), serie_label);
                let k;

                const dimSize = serie[si].getAttribute('dimSize');

                for (k = 0; k < data_.ys.length; k++) {
                    let trace = {};
                    trace.x = data_.xs[k];
                    trace.y = this.applyFunction(data_.ys[k], parseInt(dimSize));
                    trace.mode = 'lines+markers';
                    trace.name = param_name + " (" + data_.labels[k] + ")";
                    trace.type = 'scatter';

                    traces.push(trace);
                }
            }
        }

        var chart = Ext.getCmp(this.emptyChartConfig.id);

        var config = this.emptyChartConfig;

        config.data = traces;

        const config_ = {
            showgrid: true,
            zeroline: true,
            showline: true,
            mirror: 'ticks',
            gridcolor: '#bdbdbd',
            gridwidth: 1,
            zerolinecolor: '#969696',
            zerolinewidth: 1,
            linecolor: '#636363',
            linewidth: 1
        };

        let config_x = {
            title: {
                text: "Time, UT"
            },
            type: 'date',
        };

        let config_y = {
            title: {
                text: this.format_label(yAxisLabel)
            },
            exponentformat: "e"
        }

        for (var key in config_) {
            config_x[key] = config_[key];
            config_y[key] = config_[key];
        }

        config.layout = {
            xaxis: config_x,
            yaxis: config_y
        };

        if (chart) {
            var chartPanel = chart.up();
            chartPanel.remove(chart);
        }
        var testPlotly = new amdaUI.PlotlyContainer(config);
        chartPanel.insert(testPlotly);
    },
    format_label: function (label) {
        const power_2 = "\xB2";
        const power_3 = "\xB3";
        const amda_power_2 = "#u2";
        const amda_space = "#d";
        return label.replace(amda_power_2, power_2).replace(amda_space, " ");
    }
});