<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-data-controllet/select-data-controllet.html" /> <link rel="import" href="../select-visualization-controllet/select-visualization-controllet.html" /> <dom-module id="datalets-modifier-controllet"> <template> <page-slider-controllet id="slider"> <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}} data-url={{dataUrl}} preselected-datalet={{selectedDatalet}} datalet-preset={{dataletPreset}}></select-visualization-controllet> </neon-animatable> </page-slider-controllet> </template> <script> Polymer({ is : 'datalets-modifier-controllet', listeners : { 'page-slider-controllet_selected' : '_updateSlider', 'select-fields-controllet_selected-fields' : '_allowThirdStep', 'filters-controllet_filters': '_allowThirdStep', 'aggregators-controllet_aggregators': '_allowThirdStep', 'data-ready': '_preselect' }, properties : { dataUrl : { type : String, value : undefined }, deepUrl : { type : String, value : undefined }, dataletsListUrl : { type : String , value : undefined }, selectedDatalet : { type : String, value : undefined }, selectedFields : { type : Array, value : [] }, dataletPreset : { type : Object, value : [] }, localization : { type : String, value : "en" } }, ready : function(){ ln["localization"] = this.localization; this.$.select_data.dataUrl = this.dataletPreset["data-url"]; this.$.select_data.init(); this.$.select_visualization.dataUrl = this.dataletPreset["data-url"]; this.$.select_visualization.init(); }, _preselect : function(){ this.$.select_data.setSelectedFields(this.selectedFields); this.$.select_data.setFilters(JSON.parse(this.dataletPreset["filters"])); this.$.select_data.setAggregators(JSON.parse(this.dataletPreset["aggregators"])); // this.$.select_visualization.preselect(); }, _updateSlider : function(e){ switch (e.detail.selected) { case 0: this.$.slider.setTitle(ln["slide2Title_" + this.localization], ln["slide2Subtitle_" + 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["slide3Title_" + this.localization], ln["slide3Subtitle_" + this.localization]); this.$.slider.chevronLeft(true); this.$.slider.chevronRight("invisible"); this.$.select_visualization.preselect(); } }, _allowThirdStep : function(){ // this.debounce('_allowThirdStep', function () { console.log("_allowThirdStep"); this.$.slider.chevronRight(false); var selectedFields = this.$.select_data.getSelectedFields(); var filters = this.$.select_data.getFilters(); var aggregators = this.$.select_data.getAggregators(); var data = this.$.select_data.getData(); if(selectedFields.length > 0) { this.$.select_visualization.init(); this.$.select_visualization.setSelectedFields(selectedFields); this.$.select_visualization.setFilters(filters); this.$.select_visualization.setAggregators(aggregators); this.$.select_visualization.setData(data); this.$.slider.chevronRight(true); } // }, 300); } }); </script> </dom-module>