<script src="../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script>
<link rel="stylesheet" href="../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css">

<script src="../../locales/controllet_ln.js"></script>

<link rel="import" href="../../bower_components/polymer/polymer.html">

<link rel="import" href="../page-slider-controllet/page-slider-controllet.html">

<link rel="import" href="../select-dataset-controllet/select-dataset-controllet.html">
<link rel="import" href="../select-data-controllet/select-data-controllet.html" />
<link rel="import" href="../select-visualization-controllet/select-visualization-controllet.html" />

<dom-module id="data-sevc-controllet">

    <template>

        <page-slider-controllet id="slider">

            <neon-animatable>

                <select-dataset-controllet id="select_dataset" datasets={{datasets}} suggested-datasets={{suggestedDatasets}}></select-dataset-controllet>

            </neon-animatable>

            <neon-animatable>

                <select-data-controllet id="select_data"></select-data-controllet>

            </neon-animatable>

            <neon-animatable>

                <select-visualization-controllet id="select_visualization" deep-url={{deepUrl}} datalets-list-url={{dataletsListUrl}}></select-visualization-controllet>

            </neon-animatable>

        </page-slider-controllet>

    </template>

    <script>

        Polymer({

            is : 'data-sevc-controllet',

            listeners : {
                'page-slider-controllet_selected' : '_updateSlider',
                'dataset-selection-controllet_data-url' : '_allowSecondStep',
                'select-fields-controllet_selected-fields' : '_allowThirdStep',
                'filters-controllet_filters': '_allowThirdStep'
            },

            properties : {

                datasets : {
                    type : Object,
                    value : undefined
                },

                suggestedDatasets : {
                    type : Array,
                    value : undefined
                },

                deepUrl : {
                    type : String,
                    value : undefined
                },

                dataletsListUrl : {
                    type : String ,
                    value : undefined
                },

                localization : {
                    type : String,
                    value : "en"
                }

            },

            ready : function(){
                ln["localization"] = this.localization;
            },

            _updateSlider : function(e){
                switch (e.detail.selected) {
                    case 0:
                        this.$.slider.setTitle(ln["slide1Title_" + this.localization], ln["slide1Subtitle_" + this.localization]);

                        this.$.slider.chevronLeft("invisible");
                        this.$.slider.chevronRight(false);

                        if(this.$.slider.getPrevSelected() == 1)
                            this.$.slider.chevronRight(true);
                        break;
                    case 1:
                        this.$.slider.setTitle(ln["slide2Title_" + this.localization], ln["slide2Subtitle_" + this.localization]);

                        this.$.slider.chevronLeft(true);
                        this.$.slider.chevronRight(false);

                        if(this.$.slider.getPrevSelected() == 2)
                            this.$.slider.chevronRight(true);
                        break;
                    case 2:
                        this.$.slider.setTitle(ln["slide3Title_" + this.localization], ln["slide3Subtitle_" + this.localization]);

                        this.$.slider.chevronLeft(true);
                        this.$.slider.chevronRight("invisible");
                }
            },

            _allowSecondStep : function(e){
                if(e.detail.url == "") {
                    this.$.slider.chevronRight(false);
                    this.$.select_dataset.$.selected_url.invalid = false;
                    return;
                }

                var that = this;

                $.ajax({
                    url: e.detail.url,
                    dataType: "json",
                    success: function(){
                        that.$.select_dataset.$.selected_url.invalid = false;
                        var f = Object.create(providerFactory);
                        var provider = f.getProvider(e.detail.url);
                        var dataUrl = provider.addLimit(e.detail.url);
                        that.$.select_data.dataUrl = dataUrl;
                        that.$.select_data.init();
                        that.$.select_visualization.dataUrl = dataUrl;
                        that.$.select_visualization.init();
                        that.$.slider.chevronRight(true);
                    },
                    error: function(){
                        that.$.slider.chevronRight(false);
                        that.$.select_dataset.$.selected_url.invalid = true;
                    }
                });
            },

            _allowThirdStep : function(){
                this.$.slider.chevronRight(false);
                var fields = this.$.select_data.getSelectedFields();
                var filters = this.$.select_data.getFilters();
                var data = this.$.select_data.getData();
                if(fields.length > 0) {
                    this.$.select_visualization.init();
                    this.$.select_visualization.setFields(fields);
                    this.$.select_visualization.setFilters(filters);
                    this.$.select_visualization.setData(data);
                    this.$.slider.chevronRight(true);
                }
            }

        });

    </script>

</dom-module>