datalets-modifier-controllet.html
5.34 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
<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>