938d1928
Luigi Serra
Update documentat...
|
1
2
|
<!--
@license
|
584d6ecd
Luigi Serra
Update components...
|
3
|
The MIT License (MIT)
|
73bcce88
luigser
COMPONENTS
|
4
|
|
584d6ecd
Luigi Serra
Update components...
|
5
|
Copyright (c) 2015 Dipartimento di Informatica - Università di Salerno - Italy
|
73bcce88
luigser
COMPONENTS
|
6
|
|
938d1928
Luigi Serra
Update documentat...
|
7
8
9
10
11
12
|
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
|
e619a3b0
Luigi Serra
Controllet cross ...
|
13
|
|
938d1928
Luigi Serra
Update documentat...
|
14
15
|
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
|
73bcce88
luigser
COMPONENTS
|
16
|
|
938d1928
Luigi Serra
Update documentat...
|
17
18
19
20
21
22
23
24
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
-->
|
73bcce88
luigser
COMPONENTS
|
25
|
|
ae17a8dc
Luigi Serra
Controllet and da...
|
26
|
<!--
|
950d181d
Luigi Serra
license updates
|
27
28
|
* Developed by :
* ROUTE-TO-PA Project - grant No 645860. - www.routetopa.eu
|
ae17a8dc
Luigi Serra
Controllet and da...
|
29
30
31
|
*
-->
|
938d1928
Luigi Serra
Update documentat...
|
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
|
<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../../bower_components/paper-styles/color.html">
<link rel="import" href="../../bower_components/neon-animation/neon-animated-pages.html">
<link rel="import" href="../../bower_components/neon-animation/neon-animatable.html">
<link rel="import" href="../../bower_components/neon-animation/neon-animations.html">
<link rel="import" href="../../bower_components/iron-ajax/iron-ajax.html">
<link rel="import" href="../../bower_components/paper-input/paper-input.html">
<link rel="import" href="../../bower_components/paper-input/paper-textarea.html">
<link rel="import" href="../../bower_components/paper-button/paper-button.html">
<link rel="import" href="../../bower_components/paper-tabs/paper-tabs.html">
<link rel="import" href="../../bower_components/paper-tabs/paper-tab.html">
<link rel="import" href="../../bower_components/iron-pages/iron-pages.html">
<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">
<link rel="import" href="../../bower_components/paper-menu/paper-menu.html">
<link rel="import" href="../../bower_components/paper-item/paper-item.html">
<link rel="import" href="../../bower_components/paper-toast/paper-toast.html">
|
c011cd54
Luigi Serra
selection control...
|
50
51
|
<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html">
<link rel="import" href="../../bower_components/paper-dialog-scrollable/paper-dialog-scrollable.html">
|
938d1928
Luigi Serra
Update documentat...
|
52
53
54
55
|
<link rel="import" href="../items-slider-controllet/items-slider-controllet.html">
<link rel="import" href="../draggable-element-controllet/draggable-element-controllet.html">
<link rel="import" href="../treeview-controllet/treeview-controllet.html">
|
035bbee3
Luigi Serra
Datalets and cont...
|
56
|
<link rel="import" href="../text-element-controllet/text-element-controllet.html">
|
938d1928
Luigi Serra
Update documentat...
|
57
58
|
<!--
|
c6d8e1a1
Luigi Serra
fix
|
59
60
61
62
63
|
The `data-sevc-controllet` is a controllet to generate visualization from a dataset accessible through api. A json response is required.
It's composed by three steps. First, user have to select a datasource to access to a dataset. He can copy and paste/drag and drop an url(an api url with json response) or select
from select contextual menu an available one. Second, the user selects the fields he want to visualize from a treeview by checking on it. A table preview of selected fields will show
the currently selected values. Third, the users selects a visualization(datalet) from a slider and drags the previous selected fields in to the input data model fields area. A preview
is available every time a fields is dragged in the input data model fields area.
|
938d1928
Luigi Serra
Update documentat...
|
64
65
66
|
Example:
|
6f8e74f7
Luigi Serra
card update
|
67
68
|
<data-sevc-controllet deep-url="http://192.168.36.128/DatalEts-Ecosystem-Provider/DEEP/"
datalets-list-url="http://192.168.36.128/DatalEts-Ecosystem-Provider/DEEP/datalets-list"
|
c6d8e1a1
Luigi Serra
fix
|
69
|
datasets='{[{name : 'dataset1', url : dataset1Urls}, ... , {name : 'datasetN', url : datasetNUrls}]'>
|
938d1928
Luigi Serra
Update documentat...
|
70
71
72
73
74
|
</data-sevc-controllet>
@element data-sevc-controllet
@status beta
|
c6d8e1a1
Luigi Serra
fix
|
75
|
@homepage
|
938d1928
Luigi Serra
Update documentat...
|
76
77
78
79
80
81
82
|
@group controllets
-->
<dom-module id="data-sevc-controllet">
<template>
<link rel="stylesheet" href="../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css">
|
325c348a
Luigi Serra
Cross browser bug...
|
83
|
<link rel="stylesheet" href="static/css/reset.css">
|
74249687
Luigi Serra
Cross browser con...
|
84
|
|
325c348a
Luigi Serra
Cross browser bug...
|
85
|
<style is="custom-style">
|
73bcce88
luigser
COMPONENTS
|
86
|
|
938d1928
Luigi Serra
Update documentat...
|
87
88
89
|
::content body {
font-family: 'Roboto', sans-serif;
}
|
dbc787cf
Luigi Serra
Controllet cross ...
|
90
|
|
938d1928
Luigi Serra
Update documentat...
|
91
92
93
94
|
.flexchild
{
@apply(--layout-flex);
}
|
73bcce88
luigser
COMPONENTS
|
95
|
|
938d1928
Luigi Serra
Update documentat...
|
96
97
98
99
|
.flex2child
{
@apply(--layout-flex-2);
}
|
73bcce88
luigser
COMPONENTS
|
100
|
|
938d1928
Luigi Serra
Update documentat...
|
101
102
103
104
105
106
107
108
109
110
111
112
|
.avatar
{
display: inline-block;
height: 2em;
width: 2em;
border-radius: 50%;
background: var(--paper-blue-500);
color: white;
line-height: 2em;
font-size: 1.87em;
text-align: center;
}
|
73bcce88
luigser
COMPONENTS
|
113
|
|
938d1928
Luigi Serra
Update documentat...
|
114
115
116
117
118
119
|
.title
{
position: relative;
top: 0.60vh;
margin-left: 20px;
}
|
73bcce88
luigser
COMPONENTS
|
120
|
|
938d1928
Luigi Serra
Update documentat...
|
121
122
123
124
125
|
.big
{
font-size: 1.37em;
color: var(--google-grey-500);
}
|
73bcce88
luigser
COMPONENTS
|
126
|
|
938d1928
Luigi Serra
Update documentat...
|
127
128
129
130
131
132
133
|
.medium
{
font-size: 1em;
padding-bottom: 0.5em;
color : #000000;
font-weight: bold;
}
|
73bcce88
luigser
COMPONENTS
|
134
|
|
938d1928
Luigi Serra
Update documentat...
|
135
136
137
138
139
140
141
|
.small
{
font-size: 0.8em;
padding-top: 10px;
color: var(--paper-blue-500);
font-weight: bold;
}
|
74249687
Luigi Serra
Cross browser con...
|
142
|
|
938d1928
Luigi Serra
Update documentat...
|
143
144
145
146
|
paper-input
{
width: 80%;
}
|
73bcce88
luigser
COMPONENTS
|
147
|
|
938d1928
Luigi Serra
Update documentat...
|
148
149
150
151
152
153
|
paper-dropdown-menu
{
text-align: left;
margin: auto;
width: 100%;
}
|
cb1aab91
Luigi Serra
Controllets update
|
154
|
|
938d1928
Luigi Serra
Update documentat...
|
155
156
157
158
159
|
::content paper-menu-button
{
display: block;
width: 100%;
}
|
cb1aab91
Luigi Serra
Controllets update
|
160
|
|
938d1928
Luigi Serra
Update documentat...
|
161
162
163
164
165
|
#visualization_slider_area
{
min-width: 670px;
min-height: 180px;
}
|
73bcce88
luigser
COMPONENTS
|
166
|
|
938d1928
Luigi Serra
Update documentat...
|
167
168
169
170
171
|
#fields_mapping_area
{
min-width: 670px;
min-height: 180px;
}
|
73bcce88
luigser
COMPONENTS
|
172
|
|
938d1928
Luigi Serra
Update documentat...
|
173
174
175
176
|
#datalet_placeholder
{
height: 360px;
min-height: 360px;
|
73bcce88
luigser
COMPONENTS
|
177
|
|
938d1928
Luigi Serra
Update documentat...
|
178
|
}
|
73bcce88
luigser
COMPONENTS
|
179
|
|
938d1928
Luigi Serra
Update documentat...
|
180
181
182
183
|
.datalet_right_container
{
width: 100vh;
}
|
73bcce88
luigser
COMPONENTS
|
184
|
|
938d1928
Luigi Serra
Update documentat...
|
185
186
187
188
189
|
.field-mapping-card
{
width: 50%;
float: left;
}
|
73bcce88
luigser
COMPONENTS
|
190
|
|
938d1928
Luigi Serra
Update documentat...
|
191
192
193
194
195
|
.toolbar_button
{
--iron-icon-height: 32px;
--iron-icon-width: 32px;
}
|
73bcce88
luigser
COMPONENTS
|
196
|
|
938d1928
Luigi Serra
Update documentat...
|
197
198
199
200
201
202
|
#finish_button
{
--iron-icon-height: 32px;
--iron-icon-width: 32px;
color: var(--paper-blue-500);
}
|
73bcce88
luigser
COMPONENTS
|
203
|
|
938d1928
Luigi Serra
Update documentat...
|
204
205
206
207
208
209
210
211
212
|
.area_container
{
overflow: hidden;
margin : 0.8em;
padding : 0.8em;
border-width: 1em;
border-radius: 0.125rem;
box-shadow: 0.125em 0.125em 0.1125em 0.125em rgba(0, 0, 0, 0.25);
}
|
73bcce88
luigser
COMPONENTS
|
213
|
|
938d1928
Luigi Serra
Update documentat...
|
214
215
216
217
218
219
220
|
#fields_placeholder{
width: 40%;
height: 75vh;
position: relative;
float: left;
overflow: auto;
}
|
73bcce88
luigser
COMPONENTS
|
221
|
|
938d1928
Luigi Serra
Update documentat...
|
222
223
224
225
226
227
228
|
#table_fields_container{
height: 75vh;
width: 55%;
position: relative;
float: left;
overflow: auto;
}
|
73bcce88
luigser
COMPONENTS
|
229
|
|
938d1928
Luigi Serra
Update documentat...
|
230
231
232
233
234
235
|
paper-tabs, paper-toolbar
{
background-color: var(--paper-blue-500);
color: #ffffff;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
}
|
cb1aab91
Luigi Serra
Controllets update
|
236
|
|
938d1928
Luigi Serra
Update documentat...
|
237
238
239
240
241
|
paper-toolbar paper-tabs
{
box-shadow: none;
--paper-tabs-selection-bar-color : var(--google-gray-500);
}
|
cb1aab91
Luigi Serra
Controllets update
|
242
|
|
938d1928
Luigi Serra
Update documentat...
|
243
244
245
246
|
paper-tabs[noink][no-bar] paper-tab.iron-selected
{
background-color: var(--google-gray-500);
}
|
cb1aab91
Luigi Serra
Controllets update
|
247
|
|
938d1928
Luigi Serra
Update documentat...
|
248
249
250
251
|
paper-tabs[align-bottom]
{
box-shadow: 0px -2px 6px rgba(0, 0, 0, 0.15);
}
|
cb1aab91
Luigi Serra
Controllets update
|
252
|
|
938d1928
Luigi Serra
Update documentat...
|
253
254
255
256
|
#idm_fields_main_container{
position: relative;
height: 50vh;
}
|
74249687
Luigi Serra
Cross browser con...
|
257
|
|
24be6abb
Luigi Serra
selection control...
|
258
|
#selectedFields_main_container{
|
938d1928
Luigi Serra
Update documentat...
|
259
260
261
|
position: relative;
height: 50vh;
}
|
74249687
Luigi Serra
Cross browser con...
|
262
|
|
035bbee3
Luigi Serra
Datalets and cont...
|
263
264
|
#idm_layout_main_container{
position: relative;
|
24be6abb
Luigi Serra
selection control...
|
265
|
height: 65vh;
|
035bbee3
Luigi Serra
Datalets and cont...
|
266
267
|
}
|
938d1928
Luigi Serra
Update documentat...
|
268
269
270
|
paper-menu{
width: 100%;
}
|
74249687
Luigi Serra
Cross browser con...
|
271
|
|
c011cd54
Luigi Serra
selection control...
|
272
273
274
275
276
277
278
279
280
|
paper-dialog {
position: fixed;
top: 16px;
width: auto;
height: auto;
overflow: auto;
padding : 30px;
}
|
938d1928
Luigi Serra
Update documentat...
|
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
|
</style>
<iron-ajax
auto
id="data_request"
url={{dataUrl}}
verbose="true"
on-response="handleResponseData"
debounce-duration="300">
</iron-ajax>
<iron-ajax
id="datales_list_request"
auto
url={{dataletsListUrl}}
handle-as="json"
on-response="handleResponseDatalets"
debounce-duration="300">
</iron-ajax>
<iron-ajax
|
24be6abb
Luigi Serra
selection control...
|
302
|
id="selectedDatalet_request"
|
938d1928
Luigi Serra
Update documentat...
|
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
|
url={{deepUrl}}
verbose="true"
on-response="handleSelectedDatalet"
debounce-duration="300">
</iron-ajax>
<content>
<neon-animated-pages id="pages" selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]">
<neon-animatable>
<div class="vertical justified layout">
<div class="horizontal layout">
<div class="avatar" style="margin-left:15px">1</div>
<div class="title flex">
<div id="toolbar_title" class="big">Dataset source</div>
<div id="toolbar_description" class="small">Copy and paste/drag and drop in the textarea the url of datasource</div>
</div>
<paper-icon-button id="NextButton" class="toolbar_button" on-click="_onNextClick" icon="chevron-right" alt="arrow-forward" title="arrow-forward"></paper-icon-button>
|
74249687
Luigi Serra
Cross browser con...
|
324
|
</div>
|
74249687
Luigi Serra
Cross browser con...
|
325
|
|
938d1928
Luigi Serra
Update documentat...
|
326
327
328
329
330
331
332
333
334
335
336
337
|
<div class="area_container">
<paper-tabs selected="{{DatasourceTabSelected}}">
<paper-tab>Select data source</paper-tab>
<paper-tab>Most popular</paper-tab>
<paper-tab>Search</paper-tab>
</paper-tabs>
<iron-pages selected="{{DatasourceTabSelected}}">
<div>
<div class="card-content">
<paper-dropdown-menu id="datasets-sources" label="Available datasets">
<paper-menu class="dropdown-content">
<template is="dom-repeat" items="{{datasets}}" as="dataset" index-as="index">
|
35c4a6d8
Luigi Serra
Datasets provider...
|
338
|
<paper-item id="{{index}}" on-tap="_datasourceSelected">{{dataset.name}}</paper-item>
|
938d1928
Luigi Serra
Update documentat...
|
339
340
341
|
</template>
</paper-menu>
</paper-dropdown-menu>
|
c011cd54
Luigi Serra
selection control...
|
342
|
<paper-icon-button id="infoButton" on-click="_onInfoClick" icon="info-outline" alt="Information about selected dataset" title="info-button" style="color:#9e9e9e;"></paper-icon-button>
|
938d1928
Luigi Serra
Update documentat...
|
343
|
</div>
|
cb1aab91
Luigi Serra
Controllets update
|
344
|
|
938d1928
Luigi Serra
Update documentat...
|
345
|
<div><img src="static/images/or.png" style="position: relative;left: 50%;padding-top:20px"></div>
|
835a711f
Luigi Serra
Controllet cross ...
|
346
|
|
938d1928
Luigi Serra
Update documentat...
|
347
348
349
|
<div class="card-content">
<paper-textarea id="data_url" label="Dataset api data url" floatingLabel value="{{dataUrl}}" on-dragover="_handleDatasourceDragOver"></paper-textarea>
</div>
|
835a711f
Luigi Serra
Controllet cross ...
|
350
351
|
|
938d1928
Luigi Serra
Update documentat...
|
352
353
354
355
356
|
</div>
<div><img src="static/images/UnderConstruction.png" style="position: relative;top: 60%;left: 25%;"></div>
<div><img src="static/images/UnderConstruction.png" style="position: relative;top: 60%;left: 25%;"></div>
</iron-pages>
</div>
|
cb1aab91
Luigi Serra
Controllets update
|
357
|
|
938d1928
Luigi Serra
Update documentat...
|
358
|
</div>
|
73bcce88
luigser
COMPONENTS
|
359
|
|
938d1928
Luigi Serra
Update documentat...
|
360
|
</neon-animatable>
|
73bcce88
luigser
COMPONENTS
|
361
|
|
938d1928
Luigi Serra
Update documentat...
|
362
|
<neon-animatable>
|
73bcce88
luigser
COMPONENTS
|
363
|
|
938d1928
Luigi Serra
Update documentat...
|
364
|
<div class="vertical justified layout">
|
74249687
Luigi Serra
Cross browser con...
|
365
|
|
938d1928
Luigi Serra
Update documentat...
|
366
367
368
369
370
371
372
373
|
<div class="horizontal layout">
<paper-icon-button id="PrevButton" class="toolbar_button x-scope" on-click="_onPrevClick" icon="chevron-left" alt="arrow-back" title="arrow-back"></paper-icon-button>
<div class="avatar">2</div>
<div class="title flex">
<div id="toolbar_title" class="big">Dataset source</div>
<div id="toolbar_description" class="small">Copy and paste/drag and drop in the textarea the url of datasource</div>
</div>
<paper-icon-button id="NextButton" class="toolbar_button" on-click="_onNextClick" icon="chevron-right" alt="arrow-forward" title="arrow-forward"></paper-icon-button>
|
74249687
Luigi Serra
Cross browser con...
|
374
|
</div>
|
74249687
Luigi Serra
Cross browser con...
|
375
|
|
938d1928
Luigi Serra
Update documentat...
|
376
|
<div class="horizontal layout">
|
73bcce88
luigser
COMPONENTS
|
377
|
|
938d1928
Luigi Serra
Update documentat...
|
378
379
380
381
382
383
384
|
<div id="fields_placeholder" class="area_container flexchild" style="min-width:300px">
<treeview-controllet id="fields_treeview"></treeview-controllet>
</div>
<div id="table_fields_container" class="area_container flex2child">
<div id="table_component_place_holder"></div>
</div>
|
74249687
Luigi Serra
Cross browser con...
|
385
|
|
73bcce88
luigser
COMPONENTS
|
386
|
</div>
|
74249687
Luigi Serra
Cross browser con...
|
387
|
|
73bcce88
luigser
COMPONENTS
|
388
|
</div>
|
74249687
Luigi Serra
Cross browser con...
|
389
|
|
938d1928
Luigi Serra
Update documentat...
|
390
|
</neon-animatable>
|
73bcce88
luigser
COMPONENTS
|
391
|
|
938d1928
Luigi Serra
Update documentat...
|
392
|
<neon-animatable style="height:100vh">
|
73bcce88
luigser
COMPONENTS
|
393
|
|
938d1928
Luigi Serra
Update documentat...
|
394
|
<div class="vertical justified layout">
|
73bcce88
luigser
COMPONENTS
|
395
|
|
938d1928
Luigi Serra
Update documentat...
|
396
397
398
399
400
401
402
|
<div class="horizontal layout">
<paper-icon-button id="PrevButton" class="toolbar_button x-scope" on-click="_onPrevClick" icon="chevron-left" alt="arrow-back" title="arrow-back"></paper-icon-button>
<div class="avatar">3</div>
<div class="title flex">
<div id="toolbar_title" class="big">Data mapping</div>
<div id="toolbar_description" class="small">Select the visualization from the slider, drag and drop the selected fields in visualization parameter area, customize the visualization if you need</div>
</div>
|
24be6abb
Luigi Serra
selection control...
|
403
|
<paper-icon-button id="NextButton" class="toolbar_button" on-click="_onNextClick" icon="chevron-right" alt="arrow-forward" title="arrow-forward"></paper-icon-button>
|
73bcce88
luigser
COMPONENTS
|
404
|
</div>
|
74249687
Luigi Serra
Cross browser con...
|
405
|
|
73bcce88
luigser
COMPONENTS
|
406
|
|
938d1928
Luigi Serra
Update documentat...
|
407
|
<div class="horizontal layout">
|
74249687
Luigi Serra
Cross browser con...
|
408
|
|
938d1928
Luigi Serra
Update documentat...
|
409
410
411
|
<div class="">
<div id="visualization_slider_area" class="area_container"></div>
<div id="fields_mapping_area" class="area_container">
|
73bcce88
luigser
COMPONENTS
|
412
|
|
24be6abb
Luigi Serra
selection control...
|
413
|
<div id="selectedFields_main_container" class="field-mapping-card">
|
938d1928
Luigi Serra
Update documentat...
|
414
415
416
|
<div class="title">
<div class="medium">Selected fields</div>
</div>
|
24be6abb
Luigi Serra
selection control...
|
417
|
<div id="selectedFields_container" class="area_container"></div>
|
73bcce88
luigser
COMPONENTS
|
418
|
</div>
|
73bcce88
luigser
COMPONENTS
|
419
|
|
938d1928
Luigi Serra
Update documentat...
|
420
421
422
423
424
|
<div id="idm_fields_main_container" class="field-mapping-card">
<div class="title">
<div class="medium">Datalet fields</div>
</div>
<div id="datalet_idm_fields_container" class="area_container"></div>
|
73bcce88
luigser
COMPONENTS
|
425
|
</div>
|
73bcce88
luigser
COMPONENTS
|
426
|
</div>
|
74249687
Luigi Serra
Cross browser con...
|
427
|
</div>
|
73bcce88
luigser
COMPONENTS
|
428
|
|
24be6abb
Luigi Serra
selection control...
|
429
|
<div id="datalet_placeholder" style="min-width: 43%;margin-top:10px;"></div>
|
8f65d1be
Luigi Serra
selection control...
|
430
|
|
24be6abb
Luigi Serra
selection control...
|
431
|
</div>
|
73bcce88
luigser
COMPONENTS
|
432
|
|
24be6abb
Luigi Serra
selection control...
|
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
|
</div>
</neon-animatable>
<neon-animatable>
<div class="vertical justified layout">
<div class="horizontal layout">
<paper-icon-button id="PrevButton" class="toolbar_button x-scope" on-click="_onPrevClick" icon="chevron-left" alt="arrow-back" title="arrow-back"></paper-icon-button>
<div class="avatar">4</div>
<div class="title flex">
<div id="toolbar_title" class="big">Finalize visualization</div>
<div id="toolbar_description" class="small">Assign the values for label parameters (e.g. title for you visualization).</div>
</div>
<paper-icon-button id="finish_button" on-click="_onFinish" icon="add-circle" alt="Conforms the creation" title="finish"></paper-icon-button>
|
938d1928
Luigi Serra
Update documentat...
|
448
|
</div>
|
74249687
Luigi Serra
Cross browser con...
|
449
|
|
24be6abb
Luigi Serra
selection control...
|
450
451
452
453
454
455
456
457
458
459
460
461
462
|
<div class="horizontal layout">
<div style="margin-top: 10px;">
<div class="title">
<div class="medium">Layout fields</div>
</div>
<div id="idm_layout_main_container" class="area_container">
<div id="idm_layout_container" class="area_container"></div>
</div>
</div>
<div id="datalet_placeholder_2" style="min-width: 43%;margin-top: 10px;"></div>
</div>
|
938d1928
Luigi Serra
Update documentat...
|
463
|
</div>
|
73bcce88
luigser
COMPONENTS
|
464
|
|
938d1928
Luigi Serra
Update documentat...
|
465
|
</neon-animatable>
|
73bcce88
luigser
COMPONENTS
|
466
|
|
938d1928
Luigi Serra
Update documentat...
|
467
|
</neon-animated-pages>
|
73bcce88
luigser
COMPONENTS
|
468
|
|
938d1928
Luigi Serra
Update documentat...
|
469
|
<paper-toast id="message" text=""></paper-toast>
|
73bcce88
luigser
COMPONENTS
|
470
|
|
c011cd54
Luigi Serra
selection control...
|
471
472
473
474
475
476
|
<paper-dialog id="infoDialog">
<h2 id="infoDialogTitle"></h2>
<paper-dialog-scrollable id="infoDialogContent">
</paper-dialog-scrollable>
</paper-dialog>
|
938d1928
Luigi Serra
Update documentat...
|
477
|
</content>
|
73bcce88
luigser
COMPONENTS
|
478
|
</template>
|
74249687
Luigi Serra
Cross browser con...
|
479
|
|
0b818d7e
Luigi Serra
Selection control...
|
480
|
<script src="../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script>
|
73bcce88
luigser
COMPONENTS
|
481
482
483
484
|
<script src="../../../DEEPCLIENT/js/deepClient.js"></script>
<script>
|
73bcce88
luigser
COMPONENTS
|
485
486
487
488
|
Polymer({
is : 'data-sevc-controllet',
|
938d1928
Luigi Serra
Update documentat...
|
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
|
/**
* Received when the user selects a datalet from slider.
*
* @event items-slider-controllet_item-selected
*/
/**
* Received when the user drags a selected fields in to one of the source input data model field
*
* @event draggable-element-controllet_content-dragged
*/
/**
* Received when the user selects one field from treeview controllet
*
* @event treeview-controllet-fileds-selected
*/
/**
* Received when the user drags a selected fields in to one of the source input data model field
*
* @event draggable-element-controllet_content-dragged
*/
/**
|
035bbee3
Luigi Serra
Datalets and cont...
|
514
515
516
517
518
519
|
* Received when the user change text value of the selected datalet layout inputs
*
* @event text-element-controllet_content-changed
*/
/**
|
938d1928
Luigi Serra
Update documentat...
|
520
521
522
523
524
|
* Fired when the user press to finish button. At this event are attached all information about the visualization currently created
*
* @event data-sevc-controllet.dataletCreated
*/
|
73bcce88
luigser
COMPONENTS
|
525
526
527
|
listeners : {
'items-slider-controllet_item-selected' : '_dataletSelected',
'draggable-element-controllet_content-dragged' : '_fieldsMapped',
|
035bbee3
Luigi Serra
Datalets and cont...
|
528
529
|
'treeview-controllet_fileds-selected' : '_fieldsSelected',
'text-element-controllet_content-changed' : '_textElementChanged'
|
73bcce88
luigser
COMPONENTS
|
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
|
},
properties : {
entryAnimation : {
type : String,
value : ""
},
exitAnimation : {
type : String,
value : ""
},
selected : {
type : Number,
value : 0
},
/**
|
938d1928
Luigi Serra
Update documentat...
|
550
|
* It represents the data url from CKAN api
|
73bcce88
luigser
COMPONENTS
|
551
552
553
554
555
556
557
|
*
* @attribute dataUrl
* @type string
* @default 'null'
*/
dataUrl : {
type : String,
|
24be6abb
Luigi Serra
selection control...
|
558
|
value : undefined,
|
73bcce88
luigser
COMPONENTS
|
559
560
561
|
observer : '_dataUrlChanged'
},
/**
|
938d1928
Luigi Serra
Update documentat...
|
562
|
* It represents the DEEP url to get information about the datalets
|
73bcce88
luigser
COMPONENTS
|
563
564
565
566
567
568
569
|
*
* @attribute deepUrl
* @type string
* @default 'null'
*/
deepUrl : {
type : String,
|
24be6abb
Luigi Serra
selection control...
|
570
|
value : undefined
|
73bcce88
luigser
COMPONENTS
|
571
|
},
|
938d1928
Luigi Serra
Update documentat...
|
572
|
/**
|
938d1928
Luigi Serra
Update documentat...
|
573
574
575
576
577
578
|
* It's used to store the list of datalets returned from DEEP
*
* @attribute datalets_list
* @type Array
* @default empty
*/
|
73bcce88
luigser
COMPONENTS
|
579
580
581
582
|
datalets_list : {
type : Array ,
value : []
},
|
938d1928
Luigi Serra
Update documentat...
|
583
584
585
|
/**
* It's used to store the selected datalet. It will be set when the controllet get the event of selection by item slider (items-slider-controllet_item-selected)
*
|
24be6abb
Luigi Serra
selection control...
|
586
|
* @attribute selectedDatalet
|
938d1928
Luigi Serra
Update documentat...
|
587
588
589
|
* @type String
* @default ''
*/
|
24be6abb
Luigi Serra
selection control...
|
590
|
selectedDatalet : {
|
73bcce88
luigser
COMPONENTS
|
591
|
type : String,
|
24be6abb
Luigi Serra
selection control...
|
592
|
value : undefined
|
73bcce88
luigser
COMPONENTS
|
593
|
},
|
938d1928
Luigi Serra
Update documentat...
|
594
595
596
|
/**
* It's used to store the list of selected fields by user
*
|
24be6abb
Luigi Serra
selection control...
|
597
|
* @attribute selectedFields
|
938d1928
Luigi Serra
Update documentat...
|
598
599
600
|
* @type Array
* @default empty
*/
|
24be6abb
Luigi Serra
selection control...
|
601
|
selectedFields : {
|
73bcce88
luigser
COMPONENTS
|
602
|
type : Array,
|
24be6abb
Luigi Serra
selection control...
|
603
604
605
606
607
608
609
610
|
value : undefined
},
/**
* It contains all attributes for the datalet preset. It'll be used when the controllet is called to modify an exsting datalet.
*/
dataletPreset:{
type: Object,
value: undefined
|
cb1aab91
Luigi Serra
Controllets update
|
611
|
},
|
938d1928
Luigi Serra
Update documentat...
|
612
|
/**
|
035bbee3
Luigi Serra
Datalets and cont...
|
613
614
|
* It's used to store the params to give to datalet. This kind of params will not processed by selection step
*
|
24be6abb
Luigi Serra
selection control...
|
615
|
* @attribute paramsFields
|
035bbee3
Luigi Serra
Datalets and cont...
|
616
617
618
|
* @type Object
* @default empty
*/
|
24be6abb
Luigi Serra
selection control...
|
619
|
paramsFields:{
|
035bbee3
Luigi Serra
Datalets and cont...
|
620
621
622
623
|
type: Object,
value: {}
},
/**
|
938d1928
Luigi Serra
Update documentat...
|
624
625
626
627
628
629
|
* It's used to store the tab index in the first pass
*
* @attribute DatasourceTabSelected
* @type Number
* @default 0
*/
|
cb1aab91
Luigi Serra
Controllets update
|
630
631
632
633
|
DatasourceTabSelected : {
type : Number,
value : 0
},
|
938d1928
Luigi Serra
Update documentat...
|
634
635
636
637
638
639
640
|
/**
* It's used to store the datasets to show in the contexual menu
*
* @attribute datasets
* @type Array
* @default empty
*/
|
cb1aab91
Luigi Serra
Controllets update
|
641
642
643
|
datasets :
{
type : Array,
|
35c4a6d8
Luigi Serra
Datasets provider...
|
644
|
value : []
|
73bcce88
luigser
COMPONENTS
|
645
|
}
|
73bcce88
luigser
COMPONENTS
|
646
|
},
|
938d1928
Luigi Serra
Update documentat...
|
647
648
649
650
651
652
653
654
|
/**
* It is called after the elements template has been stamped and all elements inside the elements local DOM have been configured (with values bound from parents, deserialized attributes, or else default values) and had their ready method called.
* In this phase the scrollbar will be initialized
*
* @method handleResponseData
*
* @param {Event} e
*/
|
73bcce88
luigser
COMPONENTS
|
655
656
657
|
ready : function(){
|
0b818d7e
Luigi Serra
Selection control...
|
658
|
$(this.$.fields_placeholder).perfectScrollbar();
|
24be6abb
Luigi Serra
selection control...
|
659
|
$(this.$.selectedFields_main_container).perfectScrollbar();
|
0b818d7e
Luigi Serra
Selection control...
|
660
|
$(this.$.idm_fields_main_container).perfectScrollbar();
|
035bbee3
Luigi Serra
Datalets and cont...
|
661
|
$(this.$.idm_layout_main_container).perfectScrollbar();
|
0b818d7e
Luigi Serra
Selection control...
|
662
|
$(this.$.table_fields_container).perfectScrollbar();
|
73bcce88
luigser
COMPONENTS
|
663
|
|
24be6abb
Luigi Serra
selection control...
|
664
665
666
667
|
if(this.dataletPreset != undefined) {
this.$.data_url.value = this.dataletPreset['data-url'];
this.selected = 3;
}
|
7b2d40bf
Luigi Serra
Selection control...
|
668
669
|
},
|
73bcce88
luigser
COMPONENTS
|
670
671
672
673
|
/**
* Callback to parse the data requested when dataUrl change its value
*
* @method handleResponseData
|
938d1928
Luigi Serra
Update documentat...
|
674
675
|
*
* @param {Event} e
|
73bcce88
luigser
COMPONENTS
|
676
677
678
|
*/
handleResponseData : function(e){
|
24be6abb
Luigi Serra
selection control...
|
679
|
this.$.fields_treeview.init(e.detail.response, this.selectedFields);
|
74249687
Luigi Serra
Cross browser con...
|
680
|
|
73bcce88
luigser
COMPONENTS
|
681
682
683
684
685
686
|
},
/**
* Callback to parse the components response object
*
* @method handleResponseDatalets
|
938d1928
Luigi Serra
Update documentat...
|
687
688
|
*
* @param {Event} e
|
73bcce88
luigser
COMPONENTS
|
689
690
691
692
693
694
695
696
697
698
699
|
*/
handleResponseDatalets : function(e){
this.datalets_list = new Array();
for(var i=0;i < e.detail.response.length;i++){
var datalet_info = { name : e.detail.response[i].name ,
image : e.detail.response[i].url + e.detail.response[i].name + ".png"
};
this.datalets_list.push(datalet_info);
}
|
24be6abb
Luigi Serra
selection control...
|
700
701
702
703
704
705
706
|
if(this.selectedDatalet == undefined)
this.$.visualization_slider_area.innerHTML = '<items-slider-controllet items=\'' + JSON.stringify(this.datalets_list) + '\'' +
'\'></items-slider-controllet>';
else
this.$.visualization_slider_area.innerHTML = '<items-slider-controllet items=\'' + JSON.stringify(this.datalets_list) + '\'' +
'selected-card=\'' + this.selectedDatalet + '\'></items-slider-controllet>';
|
73bcce88
luigser
COMPONENTS
|
707
|
},
|
938d1928
Luigi Serra
Update documentat...
|
708
709
710
711
712
713
714
715
|
/**
* Callback to dataset selection from list in the phase three. When a datalet is selected this function will build a bundle of box items, based on the datalet input data model,
* to allow user to drag the fields, from the selected fields box, and create a new visualization.
*
* @method handleSelectedDatalet
*
* @param {Event} e
*/
|
73bcce88
luigser
COMPONENTS
|
716
717
718
|
handleSelectedDatalet : function(e){
var response = e.detail.response;
|
73bcce88
luigser
COMPONENTS
|
719
|
this.$.datalet_idm_fields_container.innerHTML = "";
|
035bbee3
Luigi Serra
Datalets and cont...
|
720
|
this.$.idm_layout_container.innerHTML = "";
|
73bcce88
luigser
COMPONENTS
|
721
|
|
24be6abb
Luigi Serra
selection control...
|
722
723
724
|
var input;
var layouts = jQuery.extend(true, {}, response.idm.inputs.layouts);
|
a619e8e4
Luigi Serra
Selection control...
|
725
|
if(response.idm.inputs.input.constructor == Object) {
|
24be6abb
Luigi Serra
selection control...
|
726
727
728
729
730
731
732
733
|
if(response.idm.inputs.input.selection == "*")
{
input = response.idm.inputs.input;
response.idm.inputs.input = new Array();
for(var i=0;i<this.selectedFields.length;i++){
var newInput = jQuery.extend(true, {}, input);
newInput.name = input.name + ' ' + (i + 1);
response.idm.inputs.input.push(newInput);
|
a619e8e4
Luigi Serra
Selection control...
|
734
735
|
}
}
|
24be6abb
Luigi Serra
selection control...
|
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
|
}
var heading;
var id;
for(var i =0; i < response.idm.inputs.input.length; i++) {
var html = '<draggable-element-controllet is-target="true" ';
input = response.idm.inputs.input[i];
heading = ' heading="' + input.name + '"';
id = ' id="' + (i + 1) + '"';
html += heading + id;
html += ' description="' + input.description + '"' +
' number="' + (i + 1) + '"';
if(this.selectedFields != undefined) {
if(this.selectedFields[i] != undefined) {
html += ' value="' + this.selectedFields[i] + '"' +
' label="' + this.selectedFields[i].split(",")[this.selectedFields[i].split(",").length - 1] + '"';
}
|
74249687
Luigi Serra
Cross browser con...
|
757
|
}
|
24be6abb
Luigi Serra
selection control...
|
758
759
760
761
|
html += '></draggable-element-controllet><br>';
this.$.datalet_idm_fields_container.innerHTML += html;
|
a619e8e4
Luigi Serra
Selection control...
|
762
763
|
}
|
24be6abb
Luigi Serra
selection control...
|
764
765
766
|
if(layouts.input != undefined) {
if(layouts.input.constructor == Object){
layouts.input = new Array(jQuery.extend(true, {}, layouts.input));
|
035bbee3
Luigi Serra
Datalets and cont...
|
767
768
|
}
|
24be6abb
Luigi Serra
selection control...
|
769
770
771
772
773
774
775
776
777
778
779
780
|
html = '<text-element-controllet ';
for (var i = 0; i < layouts.input.length; i++) {
html += '<text-element-controllet heading="' + layouts.input[i].name + '" ' +
'description="' + layouts.input[i].description + '" ' +
'number="' + (i + 1) + '" ';
if(this.dataletPreset != undefined){
html += 'value="' + this.dataletPreset[Object.keys(this.dataletPreset)[(i + 1)]] + '"';
}
html += '></text-element-controllet>';
}
this.$.idm_layout_container.innerHTML = html;
|
035bbee3
Luigi Serra
Datalets and cont...
|
781
782
|
}
|
24be6abb
Luigi Serra
selection control...
|
783
784
|
if(this.selectedFields != undefined) this.generateDataletPreview();
|
035bbee3
Luigi Serra
Datalets and cont...
|
785
786
787
788
789
790
791
792
793
|
},
/**
* Generate the datalet preview when user mapped fields. it even retrieves the value of layout inputs values.
*
* @method generateDataletPreview
*/
generateDataletPreview : function(){
var input_mapped_fields = Polymer.dom(this.$.datalet_idm_fields_container).querySelectorAll('draggable-element-controllet[is-target=true]');
|
24be6abb
Luigi Serra
selection control...
|
794
|
this.selectedFields = Array();
|
035bbee3
Luigi Serra
Datalets and cont...
|
795
796
797
|
for (var i = 0; i < input_mapped_fields.length; i++) {
if (input_mapped_fields[i].value != "") {
|
24be6abb
Luigi Serra
selection control...
|
798
|
this.selectedFields.push(input_mapped_fields[i].value);
|
035bbee3
Luigi Serra
Datalets and cont...
|
799
800
801
802
|
}
}
var input_layouts_fields = Polymer.dom(this.$.idm_layout_container).querySelectorAll('text-element-controllet');
|
24be6abb
Luigi Serra
selection control...
|
803
|
this.paramsFields = {'data-url' : this.dataUrl};
|
035bbee3
Luigi Serra
Datalets and cont...
|
804
805
806
|
for (var i = 0; i < input_layouts_fields.length; i++) {
if (input_layouts_fields[i].value != "") {
|
24be6abb
Luigi Serra
selection control...
|
807
|
this.paramsFields[input_layouts_fields[i].heading] = input_layouts_fields[i].value;
|
035bbee3
Luigi Serra
Datalets and cont...
|
808
809
810
811
812
|
}
}
var datalet_params ={
|
24be6abb
Luigi Serra
selection control...
|
813
814
815
|
component : this.selectedDatalet,
params : this.paramsFields,
fields : this.selectedFields,
|
035bbee3
Luigi Serra
Datalets and cont...
|
816
817
818
|
placeHolder : this.$.datalet_placeholder
};
|
24be6abb
Luigi Serra
selection control...
|
819
820
821
822
823
824
825
|
var datalet_params_2 ={
component : this.selectedDatalet,
params : this.paramsFields,
fields : this.selectedFields,
placeHolder : this.$.datalet_placeholder_2
};
|
035bbee3
Luigi Serra
Datalets and cont...
|
826
827
828
|
ComponentService.deep_url = this.deepUrl;
ComponentService.getComponent(datalet_params);
|
24be6abb
Luigi Serra
selection control...
|
829
|
ComponentService.getComponent(datalet_params_2);
|
035bbee3
Luigi Serra
Datalets and cont...
|
830
|
|
73bcce88
luigser
COMPONENTS
|
831
|
},
|
938d1928
Luigi Serra
Update documentat...
|
832
833
834
835
836
837
838
|
/**
* Validate the current pass in order to access to next one.
*
* @method validateCurrentPass
*
* @param {Number} next_selected_pass
*/
|
74249687
Luigi Serra
Cross browser con...
|
839
840
841
842
843
844
|
validateCurrentPass : function(next_selected_pass){
switch(next_selected_pass){
case 0:
return true;
case 1:
|
24be6abb
Luigi Serra
selection control...
|
845
|
if(this.$.data_url.value == undefined){
|
74249687
Luigi Serra
Cross browser con...
|
846
847
848
849
850
851
852
853
|
this.$.message.text = "You have to select a dataset to access to pass 2.";
this.$.message.show();
return false;
}else{
return true;
}
case 2:
|
24be6abb
Luigi Serra
selection control...
|
854
|
if(Polymer.dom(this.$.selectedFields_container).querySelectorAll('draggable-element-controllet') == 0){
|
74249687
Luigi Serra
Cross browser con...
|
855
856
857
858
859
860
|
this.$.message.text = "You have to select a set of fields to access to pass 3.";
this.$.message.show();
return false;
}else{
return true;
}
|
24be6abb
Luigi Serra
selection control...
|
861
862
|
case 3:
return true;
|
74249687
Luigi Serra
Cross browser con...
|
863
864
865
|
}
},
|
938d1928
Luigi Serra
Update documentat...
|
866
867
868
869
870
871
|
/**
* Callback for manage the previous pass button
*
* @method _onPrevClick
*
*/
|
73bcce88
luigser
COMPONENTS
|
872
|
_onPrevClick : function() {
|
74249687
Luigi Serra
Cross browser con...
|
873
874
|
if(!this.validateCurrentPass(this.selected === 0 ? 0 : (this.selected - 1))) return;
|
73bcce88
luigser
COMPONENTS
|
875
|
this.entryAnimation = 'slide-from-left-animation';
|
2b9aa997
Luigi Serra
Bugs fix
|
876
877
|
this.exitAnimation = 'slide-right-animation';
this.selected = this.selected === 0 ? 0 : (this.selected - 1);
|
73bcce88
luigser
COMPONENTS
|
878
|
},
|
938d1928
Luigi Serra
Update documentat...
|
879
|
/**
|
c011cd54
Luigi Serra
selection control...
|
880
|
* Callback to manage the next pass button
|
938d1928
Luigi Serra
Update documentat...
|
881
882
883
884
|
*
* @method _onNextClick
*
*/
|
73bcce88
luigser
COMPONENTS
|
885
|
_onNextClick : function() {
|
74249687
Luigi Serra
Cross browser con...
|
886
|
|
24be6abb
Luigi Serra
selection control...
|
887
|
if(!this.validateCurrentPass(this.selected === 3 ? 3 : (this.selected + 1))) return;
|
74249687
Luigi Serra
Cross browser con...
|
888
|
|
73bcce88
luigser
COMPONENTS
|
889
|
this.entryAnimation = 'slide-from-right-animation';
|
2b9aa997
Luigi Serra
Bugs fix
|
890
|
this.exitAnimation = 'slide-left-animation';
|
24be6abb
Luigi Serra
selection control...
|
891
|
this.selected = this.selected === 3 ? 3 : (this.selected + 1);
|
73bcce88
luigser
COMPONENTS
|
892
|
},
|
938d1928
Luigi Serra
Update documentat...
|
893
|
/**
|
c011cd54
Luigi Serra
selection control...
|
894
895
896
897
898
899
900
901
902
|
* Callback to manage InfoButton click to give user information about the selected dataset
*
*/
_onInfoClick : function(){
this.$.infoDialog.open();
},
/**
|
938d1928
Luigi Serra
Update documentat...
|
903
904
905
906
907
908
|
* Callback related to datasource selection from select menu
*
* @method _datasourceSelected
*
* @param {Event} e
*/
|
cb1aab91
Luigi Serra
Controllets update
|
909
|
_datasourceSelected : function(e){
|
2b235978
Luigi Serra
Controllet cross ...
|
910
|
|
35c4a6d8
Luigi Serra
Datasets provider...
|
911
|
this.$.data_url.value = this.datasets[parseInt(e.target.id)].url;
|
c011cd54
Luigi Serra
selection control...
|
912
913
914
|
this.$.infoDialogTitle.innerHTML = this.datasets[parseInt(e.target.id)].name;
this.$.infoDialogContent.innerHTML = this.datasets[parseInt(e.target.id)].description;
|
cb1aab91
Luigi Serra
Controllets update
|
915
|
},
|
938d1928
Luigi Serra
Update documentat...
|
916
917
918
919
920
921
922
|
/**
* Callback related to data url change
*
* @method _dataUrlChanged
*
* @param {Event} e
*/
|
73bcce88
luigser
COMPONENTS
|
923
924
925
|
_dataUrlChanged : function(newValue, oldValue){
this.$.data_request.generateRequest();
},
|
938d1928
Luigi Serra
Update documentat...
|
926
927
928
929
930
931
932
|
/**
* Callback related to event 'items-slider-controllet_item-selected' fired by items-slider-controllet when the user selects a datalet
*
* @method _dataletSelected
*
* @param {Event} e
*/
|
73bcce88
luigser
COMPONENTS
|
933
|
_dataletSelected : function(e){
|
24be6abb
Luigi Serra
selection control...
|
934
935
936
|
this.selectedDatalet = e.detail.datalet;
this.$.selectedDatalet_request.url = this.deepUrl + e.detail.datalet;
this.$.selectedDatalet_request.generateRequest();
|
73bcce88
luigser
COMPONENTS
|
937
938
|
},
|
938d1928
Luigi Serra
Update documentat...
|
939
940
941
942
943
944
945
|
/**
* Callback related to event 'treeview-controllet-fileds-selected' fired by treeview-controllet when the user selects a field
*
* @method _fieldsSelected
*
* @param {Event} e
*/
|
73bcce88
luigser
COMPONENTS
|
946
947
|
_fieldsSelected : function(e){
|
24be6abb
Luigi Serra
selection control...
|
948
949
|
this.selectedFields = e.detail.fields;
this.$.selectedFields_container.innerHTML = "";
|
73bcce88
luigser
COMPONENTS
|
950
|
for(var i=0;i<e.detail.fields.length;i++) {
|
24be6abb
Luigi Serra
selection control...
|
951
|
this.$.selectedFields_container.innerHTML += '<draggable-element-controllet identifier="' + e.detail.fields[i] +
|
73bcce88
luigser
COMPONENTS
|
952
953
954
955
|
'" label="' + e.detail.fields[i].split(",")[e.detail.fields[i].split(",").length -1] +
'"></draggable-element-controllet><br>';
}
|
74249687
Luigi Serra
Cross browser con...
|
956
957
|
var place_holder = (navigator.userAgent.toLowerCase().indexOf('chrome') > -1) ? this.$.table_component_place_holder : this.$.table_component_place_holder[Object.keys(this.$.table_component_place_holder)[0]];
|
73bcce88
luigser
COMPONENTS
|
958
959
960
961
962
963
|
var table_params ={
component : "datatable-datalet",
params :{
'data-url' : this.dataUrl
},
fields : e.detail.fields,
|
74249687
Luigi Serra
Cross browser con...
|
964
|
placeHolder : this.$.table_component_place_holder
|
73bcce88
luigser
COMPONENTS
|
965
966
967
968
969
970
|
};
ComponentService.deep_url = this.deepUrl;
ComponentService.getComponent(table_params);
},
|
938d1928
Luigi Serra
Update documentat...
|
971
972
973
974
975
976
977
|
/**
* Callback related to event 'draggable-element-controllet_content-dragged' fired by draggable-element-controllet when the user drags a selected field in to input data model field
*
* @method _fieldsMapped
*
* @param {Event} e
*/
|
73bcce88
luigser
COMPONENTS
|
978
979
|
_fieldsMapped : function(e){
|
035bbee3
Luigi Serra
Datalets and cont...
|
980
|
this.generateDataletPreview();
|
73bcce88
luigser
COMPONENTS
|
981
982
|
},
|
938d1928
Luigi Serra
Update documentat...
|
983
|
/**
|
035bbee3
Luigi Serra
Datalets and cont...
|
984
985
986
987
988
989
990
991
992
993
|
* Callback related to event 'text-element-controllet_content-changed' fired by text-element-controllet when the user change the value of text
*
* @method _textElementChanged
*
* @param {Event} e
*/
_textElementChanged : function(e){
this.generateDataletPreview();
},
/**
|
938d1928
Luigi Serra
Update documentat...
|
994
995
996
997
998
999
|
* Callback related to the drag operation in the dataUrl input area. It's used to delete previous value.
*
* @method _handleDatasourceDragOver
*
* @param {Event} e
*/
|
73bcce88
luigser
COMPONENTS
|
1000
1001
1002
|
_handleDatasourceDragOver : function(e){
this.$.data_url.value = "";
},
|
938d1928
Luigi Serra
Update documentat...
|
1003
1004
1005
1006
1007
1008
1009
|
/**
* Callback related to the finish button.
*
* @method _onFinish
*
* @param {Event} e
*/
|
73bcce88
luigser
COMPONENTS
|
1010
1011
|
_onFinish : function(e){
|
24be6abb
Luigi Serra
selection control...
|
1012
|
if((this.selectedFields.length == 0) || this.selectedDatalet == ""){
|
dbc787cf
Luigi Serra
Controllet cross ...
|
1013
1014
1015
1016
1017
|
this.$.message.text = "You have to map the selected fields with datalets fields(by dragging) and select a datalet to export a new visualization.";
this.$.message.show();
return;
}
|
73bcce88
luigser
COMPONENTS
|
1018
1019
|
var data = {
dataUrl : this.dataUrl,
|
24be6abb
Luigi Serra
selection control...
|
1020
1021
1022
|
params : this.paramsFields,
fields : this.selectedFields,
datalet : this.selectedDatalet,
|
5e31b047
isisadmin
datalet chaching ...
|
1023
|
staticData : JSON.stringify(this.$.datalet_placeholder.children[1].behavior.data)
|
73bcce88
luigser
COMPONENTS
|
1024
1025
1026
1027
1028
1029
1030
1031
1032
1033
1034
|
}
this.fire('data-sevc-controllet.dataletCreated', {data : data});
}
});
</script>
</dom-module>
|