Commit 3388b02bcff14f8e26cd12ae2d3c60366eeb640b
1 parent
a53fbbed
shadow x Andrea
Showing
3 changed files
with
484 additions
and
46 deletions
controllets/data-sevc-controllet/demo/index.html
... | ... | @@ -9,56 +9,15 @@ |
9 | 9 | <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script> |
10 | 10 | <link rel="stylesheet" href="../../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css"> |
11 | 11 | |
12 | - <!--<!–<meta name="defaultLanguage" content="en">–>--> | |
13 | - <meta name="availableLanguages" content="en, it"> | |
14 | - <!--<!–<link rel="localization" href="../../../locales/{locale}.l20n">–>--> | |
15 | - <link rel="localization" href="../../../locales/it.l20n"> | |
16 | - <!--<script defer src="../../../bower_components/l20n/dist/compat/web/l20n.min.js"></script>--> | |
17 | - | |
18 | 12 | <link rel="import" href="../data-sevc-controllet.html" /> |
19 | 13 | </head> |
20 | 14 | |
21 | 15 | <body> |
22 | 16 | |
23 | - <!--<span data-l10n-id="name"></span>--> | |
24 | - <data-sevc-controllet localization="it" id="dsc" deep-url="http://172.16.15.77/DEEalerProvider/DEEP/" datalets-list-url="http://172.16.15.77/DEEalerProvider/DEEP/datalets-list"></data-sevc-controllet> | |
25 | - | |
26 | - <script> | |
27 | - | |
28 | -// var languageLink = document.createElement("link"); | |
29 | -// languageLink.rel = "localization"; | |
30 | -// languageLink.href = "../../../locales/it.l20n"; | |
31 | -// document.getElementsByTagName("head")[0].appendChild(languageLink); | |
32 | - | |
33 | - var description = "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa "+ | |
34 | - " aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa "+ | |
35 | - " aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa "+ | |
36 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
37 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
38 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
39 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
40 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
41 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
42 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
43 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
44 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
45 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
46 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
47 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
48 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"+ | |
49 | - "aaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaa aaaaaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaa"; | |
50 | - | |
51 | - var dataset1 = {description: description, name: "Data", url: "http://ckan.routetopa.eu/api/action/datastore_search?resource_id=c3b52992-ba61-4a73-a637-0f2e1ca26aab"}; | |
52 | - var dataset2 = {description: "", name: "Klassen", url: "http://ckan.routetopa.eu/api/action/datastore_search?resource_id=dfd27de5-0790-466c-af59-6a82509e7fbb"}; | |
53 | - var dataset3 = {description: "descrizione bellissima purissima levissima sbiricuda antani", name: "Derelict Sites", url: "http://ckan.routetopa.eu/api/action/datastore_search?resource_id=fcbee83e-3d3d-4303-a568-24dd33d02adc"}; | |
54 | - var datasets = [dataset1, dataset2, dataset3]; | |
55 | - var s_datasets = [dataset1, dataset3]; | |
56 | - | |
57 | - var dsc = document.getElementById('dsc'); | |
58 | - dsc.setAttribute("datasets", JSON.stringify(datasets)); | |
59 | - | |
60 | - dsc.setAttribute("suggested-datasets", JSON.stringify(s_datasets)); | |
61 | - </script> | |
17 | + <data-sevc-controllet localization="en" id="dsc" deep-url="http://172.16.15.77/DEEalerProvider/DEEP/" datalets-list-url="http://172.16.15.77/DEEalerProvider/DEEP/datalets-list" | |
18 | + datasets='{"result":{"providers":{"1":{"title":"CKAN","api_url":"http:\/\/ckan.routetopa.eu","image_hash":"11","id":"1"}},"datasets":[{"w":1,"provider_name":"p:1","organization_name":"Dublin","package_name":"isislab DATA","resource_name":"Resource 1","url":"http:\/\/ckan.routetopa.eu\/dataset\/566c2867-ea89-45a2-bd7a-30ae82606007\/resource\/b3d3d9ff-291e-47ca-a0d2-a15deef81737\/download\/isislab2.csv","metas":"{\"organization\":\"Dublin\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"Dublin","package_name":"isislab DATA","resource_name":"Resource 1","url":"http:\/\/ckan.routetopa.eu\/dataset\/566c2867-ea89-45a2-bd7a-30ae82606007\/resource\/b3d3d9ff-291e-47ca-a0d2-a15deef81737\/download\/isislab2.csv","metas":"{\"organization\":\"Dublin\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"Dublin","package_name":"isislab DATA","resource_name":"Resource 1","url":"http:\/\/ckan.routetopa.eu\/dataset\/566c2867-ea89-45a2-bd7a-30ae82606007\/resource\/b3d3d9ff-291e-47ca-a0d2-a15deef81737\/download\/isislab2.csv","metas":"{\"organization\":\"Dublin\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"Dublin","package_name":"isislab DATA","resource_name":"Resource 1","url":"http:\/\/ckan.routetopa.eu\/dataset\/566c2867-ea89-45a2-bd7a-30ae82606007\/resource\/b3d3d9ff-291e-47ca-a0d2-a15deef81737\/download\/isislab2.csv","metas":"{\"organization\":\"Dublin\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"Dublin","package_name":"isislab DATA","resource_name":"Resource 1","url":"http:\/\/ckan.routetopa.eu\/dataset\/566c2867-ea89-45a2-bd7a-30ae82606007\/resource\/b3d3d9ff-291e-47ca-a0d2-a15deef81737\/download\/isislab2.csv","metas":"{\"organization\":\"Dublin\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"Dublin","package_name":"isislab DATA","resource_name":"Resource 1","url":"http:\/\/ckan.routetopa.eu\/dataset\/566c2867-ea89-45a2-bd7a-30ae82606007\/resource\/b3d3d9ff-291e-47ca-a0d2-a15deef81737\/download\/isislab2.csv","metas":"{\"organization\":\"Dublin\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"Dublin","package_name":"isislab DATA","resource_name":"Resource 1","url":"http:\/\/ckan.routetopa.eu\/dataset\/566c2867-ea89-45a2-bd7a-30ae82606007\/resource\/b3d3d9ff-291e-47ca-a0d2-a15deef81737\/download\/isislab2.csv","metas":"{\"organization\":\"Dublin\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"Dublin","package_name":"isislab DATA","resource_name":"Resource 2","url":"http:\/\/ckan.routetopa.eu\/dataset\/566c2867-ea89-45a2-bd7a-30ae82606007\/resource\/b056c5e6-76af-4526-a35d-7dee664fb6ee\/download\/isislab.csv","metas":"{\"organization\":\"Dublin\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"ROUTE-TO-PA","package_name":"Year 1 Dissemination of the ROUTE-TO-PA project (2015)","resource_name":"First year (2015) ROUTE-TO-PA Dissemination","url":"http:\/\/ckan.routetopa.eu\/dataset\/d81d451d-8b3d-47f4-b57f-e295e8f51da0\/resource\/818c2edb-0cb7-4288-b340-e4dd1933d817\/download\/ROUTE-TO-PA-Individual-Dissemination-Activity-Report-Form-Responses-New---Link-Upd.csv","metas":"{\"organization\":\"ROUTE-TO-PA\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"ROUTE-TO-PA","package_name":"Year 1 Dissemination of the ROUTE-TO-PA project (2015)","resource_name":"First year (2015) ROUTE-TO-PA Dissemination - dl","url":"http:\/\/ckan.routetopa.eu\/dataset\/d81d451d-8b3d-47f4-b57f-e295e8f51da0\/resource\/fd8c4d6f-315d-4aa0-b7bd-4fdde7bf641b\/download\/ROUTE-TO-PA-Individual-Dissemination-Activity-Report-Form-Responses-New---Link-Upd.csv","metas":"{\"organization\":\"ROUTE-TO-PA\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"ROUTE-TO-PA","package_name":"Year 1 Dissemination of the ROUTE-TO-PA project (2015)","resource_name":"First year (2015) dissemination of ROUTE-TO-PA project","url":"http:\/\/ckan.routetopa.eu\/dataset\/d81d451d-8b3d-47f4-b57f-e295e8f51da0\/resource\/b0ef6017-8c64-4e11-8046-7e51a8561856\/download\/ROUTE-TO-PA-Individual-Dissemination-Activity-Report-Form-Responses-New---Link-Upd.csv","metas":"{\"organization\":\"ROUTE-TO-PA\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"ROUTE-TO-PA","package_name":"test dissemination with link","resource_name":"Year 1 Dissemination of the ROUTE-TO-PA project (2015)","url":"http:\/\/ckan.routetopa.eu\/dataset\/ba5054af-7561-4f99-9504-76ea004a1e85\/resource\/4cc2349d-bf7b-4bbe-a7ca-db5312bb6c94\/download\/ROUTE-TO-PA-Individual-Dissemination-Activity-Report-Form-Responses-New---Link.csv","metas":"{\"organization\":\"ROUTE-TO-PA\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"ROUTE-TO-PA","package_name":"Dissemination activity of the first year","resource_name":"Dissemination activity of the first year (2015)","url":"http:\/\/ckan.routetopa.eu\/dataset\/61f07087-210a-4c35-9606-2aafe183633b\/resource\/5f9d8d8b-1c41-45f7-9dbb-61b9a7bcd076\/download\/ROUTE-TO-PA-Individual-Dissemination-Activity-Report-Form-Responses-New.csv","metas":"{\"organization\":\"ROUTE-TO-PA\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"},{"w":1,"provider_name":"p:1","organization_name":"City of the Hague Municipality","package_name":"Test 3- Buurten","resource_name":"Test Buurten - 3","url":"http:\/\/ckan.routetopa.eu\/dataset\/1248d447-2901-4beb-91ae-c2f249fd8a99\/resource\/1fdbc765-8945-4271-8dce-9c7eba45a67d\/download\/Test-3-Compare.csv","metas":"{\"organization\":\"City of the Hague Municipality\",\"description\":\"\",\"format\":\"\",\"last_modified\":\"\",\"name\":\"\",\"created\":\"\"}"}]}}' | |
19 | + suggested-datasets='[{"resource_name":"SUGGESTED 1","url":"noUrl.csv","metas":"{\"description\":\"noDescriione\"}"},{"resource_name":"SUGGESTED 2","url":"noUrl.csv","metas":"{\"description\":\"noDescriione\"}"},{"resource_name":"SUGGESTED 3","url":"noUrl.csv","metas":"{\"description\":\"noDescriione\"}"}]' | |
20 | + ></data-sevc-controllet> | |
62 | 21 | |
63 | 22 | </body> |
64 | 23 | ... | ... |
controllets/select-dataset-controllet/select-dataset-controllet.html
... | ... | @@ -193,11 +193,31 @@ |
193 | 193 | } |
194 | 194 | |
195 | 195 | #select_dataset_container #header { |
196 | + position: relative; | |
197 | + z-index: 1; | |
198 | + -webkit-box-shadow: 0 30px 24px -12px rgba(0, 0, 0, 0.14), 0 20px 30px -9px rgba(0, 0, 0, 0.12), 0 20px 10px -19px rgba(0, 0, 0, 0.4); | |
199 | + -moz-box-shadow: 0 30px 24px -12px rgba(0, 0, 0, 0.14), 0 20px 30px -9px rgba(0, 0, 0, 0.12), 0 20px 10px -19px rgba(0, 0, 0, 0.4); | |
200 | + box-shadow: 0 30px 24px -12px rgba(0, 0, 0, 0.14), 0 20px 30px -9px rgba(0, 0, 0, 0.12), 0 20px 10px -19px rgba(0, 0, 0, 0.4); | |
201 | + | |
196 | 202 | background-color: #B6B6B6; |
197 | 203 | display: flex; |
198 | 204 | padding: 0px 4px; |
199 | 205 | } |
200 | 206 | |
207 | + #select_dataset_container #footer_list { | |
208 | + position: relative; | |
209 | + z-index: 1; | |
210 | + -webkit-box-shadow: 0 -30px 24px -12px rgba(0, 0, 0, 0.14), 0 -20px 30px -9px rgba(0, 0, 0, 0.12), 0 -20px 10px -19px rgba(0, 0, 0, 0.4); | |
211 | + -moz-box-shadow: 0 -30px 24px -12px rgba(0, 0, 0, 0.14), 0 -20px 30px -9px rgba(0, 0, 0, 0.12), 0 -20px 10px -19px rgba(0, 0, 0, 0.4); | |
212 | + box-shadow: 0 -30px 24px -12px rgba(0, 0, 0, 0.14), 0 -20px 30px -9px rgba(0, 0, 0, 0.12), 0 -20px 10px -19px rgba(0, 0, 0, 0.4); | |
213 | + } | |
214 | + | |
215 | + .noshadow { | |
216 | + -webkit-box-shadow: none !important; | |
217 | + -moz-box-shadow: none !important; | |
218 | + box-shadow: none !important; | |
219 | + } | |
220 | + | |
201 | 221 | #select_dataset_container #footer_list, |
202 | 222 | #select_dataset_container #footer_treemap { |
203 | 223 | width: 100%; |
... | ... | @@ -250,7 +270,7 @@ |
250 | 270 | <paper-tabs selected="{{selected}}" no-bar> |
251 | 271 | <paper-tab noink on-tap="_refreshList"><span id="listView"></span></paper-tab> |
252 | 272 | <!--<paper-tab noink ><span id="listView"></span></paper-tab>--> |
253 | - <paper-tab noink><span id="treeMapView"></span></paper-tab> | |
273 | + <paper-tab on-tap="_noShadow" noink><span id="treeMapView"></span></paper-tab> | |
254 | 274 | </paper-tabs> |
255 | 275 | |
256 | 276 | <div id="header"> |
... | ... | @@ -515,6 +535,12 @@ |
515 | 535 | |
516 | 536 | _refreshList : function() { |
517 | 537 | this.shownDatasets = this.filteredDatasets.slice(this.prev - 1, this.next); |
538 | + this.$.header.className = this.$.header.className.replace(" noshadow", ""); | |
539 | + }, | |
540 | + | |
541 | + _noShadow : function() { | |
542 | + console.log(this.$.header); | |
543 | + this.$.header.className += " noshadow"; | |
518 | 544 | }, |
519 | 545 | |
520 | 546 | _clearInput : function() { | ... | ... |
controllets/select-visualization-controllet/select-datalet-inputs_series_original.html
0 โ 100644
1 | +<link rel="import" href="../../bower_components/polymer/polymer.html" /> | |
2 | + | |
3 | +<link rel="import" href="../../bower_components/paper-material/paper-material.html" /> | |
4 | + | |
5 | +<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> | |
6 | +<link rel="import" href="../../bower_components/paper-menu/paper-menu.html"> | |
7 | +<link rel="import" href="../../bower_components/paper-item/paper-item.html"> | |
8 | + | |
9 | +<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html"> | |
10 | +<link rel="import" href="../../bower_components/iron-icons/iron-icons.html"> | |
11 | +<link rel="import" href="../../bower_components/iron-icon/iron-icon.html"> | |
12 | + | |
13 | +<dom-module id="select-datalet-inputs_series"> | |
14 | + | |
15 | + <template> | |
16 | + | |
17 | + <style is="custom-style"> | |
18 | + :host { | |
19 | + --paper-dropdown-menu-icon: { | |
20 | + color: #2196F3; | |
21 | + }; | |
22 | + } | |
23 | + | |
24 | + #inputs_series_container { | |
25 | + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
26 | + font-size: 16px; | |
27 | + | |
28 | + height: 100%; | |
29 | + width: 258px; | |
30 | + } | |
31 | + | |
32 | + .inputs{ | |
33 | + position: relative; | |
34 | + } | |
35 | + | |
36 | + .input_header { | |
37 | + height: 32px; | |
38 | + padding-top: 16px; | |
39 | + text-align: center; | |
40 | + font-weight: 700; | |
41 | + background-color: #B6B6B6; | |
42 | + } | |
43 | + | |
44 | + #expert_container { | |
45 | + display: none; | |
46 | + } | |
47 | + | |
48 | + #expert_header { | |
49 | + height: 32px; | |
50 | + padding-top: 16px; | |
51 | + margin-top: 8px; | |
52 | + text-align: center; | |
53 | + font-weight: 700; | |
54 | + color: #00BCD4; | |
55 | + cursor: pointer; | |
56 | + } | |
57 | + | |
58 | + .info_button { | |
59 | + position: absolute; | |
60 | + top: 18px; | |
61 | + right: 0px; | |
62 | + } | |
63 | + | |
64 | + paper-dropdown-menu { | |
65 | + height: 48px; | |
66 | + width: 210px;; | |
67 | + padding-left: 8px; | |
68 | + padding-bottom: 8px; | |
69 | + --paper-input-container-focus-color: #2196F3; | |
70 | + } | |
71 | + | |
72 | + paper-item.iron-selected { | |
73 | + background-color: #2196F3; | |
74 | + color: #FFFFFF; | |
75 | + } | |
76 | + | |
77 | + paper-icon-button { | |
78 | + color: #2196F3; | |
79 | + --paper-icon-button-ink-color: #2196F3; | |
80 | + margin: 0px; | |
81 | + } | |
82 | + </style> | |
83 | + | |
84 | + <paper-material id="inputs_series_container" elevation="5"> | |
85 | + | |
86 | + <div class="input_header"><span id="inputs"></span></div> | |
87 | + | |
88 | + <template is="dom-repeat" items="{{inputs}}" index-as="ddl_index"> | |
89 | + <div class="inputs"> | |
90 | + <paper-dropdown-menu id={{ddl_index}} label={{_getLabelName(item.name)}}> | |
91 | + <paper-menu class="dropdown-content"> | |
92 | + <template is="dom-repeat" items={{fields}}> | |
93 | + <paper-item id={{index}} on-tap="_addInput">{{_fieldName(item)}}</paper-item> | |
94 | + </template> | |
95 | + </paper-menu> | |
96 | + </paper-dropdown-menu> | |
97 | + <div class="info_button"> | |
98 | + <paper-icon-button id="{{ddl_index}}" on-click="_setOrders" icon="unfold-more" title=""></paper-icon-button> | |
99 | + </div> | |
100 | + </div> | |
101 | + </template> | |
102 | + | |
103 | + <div id="expert_header" on-click="_showExpertMode"><span id="groupBy"></span></div> | |
104 | + | |
105 | + <div id="expert_container"> | |
106 | + | |
107 | + <div class="inputs"> | |
108 | + <paper-dropdown-menu id="group_by" disabled> | |
109 | + <paper-menu class="dropdown-content"> | |
110 | + <template is="dom-repeat" items={{groupableFields}}> | |
111 | + <paper-item id={{index}} on-tap="_setAggregatorsFields">{{_fieldName(item)}}</paper-item> | |
112 | + </template> | |
113 | + </paper-menu> | |
114 | + </paper-dropdown-menu> | |
115 | + <div class="info_button"> | |
116 | + <paper-icon-button id="gb" on-click="_setOrders" icon="unfold-more" title="" disabled></paper-icon-button> | |
117 | + </div> | |
118 | + </div> | |
119 | + | |
120 | + <template is="dom-repeat" items="{{aggregateFields}}" as="field"> | |
121 | + <div class="inputs"> | |
122 | + <paper-dropdown-menu id="calculate_{{index}}" label="{{_calculateLabel()}}" disabled> | |
123 | + <paper-menu class="dropdown-content"> | |
124 | + <template is="dom-repeat" items="{{functions}}"> | |
125 | + <paper-item id={{index}} on-tap="_setAggregators">{{_operationName(index)}} : {{_fieldName(field)}}</paper-item> | |
126 | + </template> | |
127 | + </paper-menu> | |
128 | + </paper-dropdown-menu> | |
129 | + </div> | |
130 | + </template> | |
131 | + | |
132 | + </div> | |
133 | + | |
134 | + </paper-material> | |
135 | + | |
136 | + | |
137 | + </template> | |
138 | + | |
139 | + <script> | |
140 | + | |
141 | + Polymer({ | |
142 | + | |
143 | + is : 'select-datalet-inputs_series', | |
144 | + | |
145 | + properties : { | |
146 | + | |
147 | + //INPUT | |
148 | + fields : {type : Array, value : []}, | |
149 | + | |
150 | + //OUTPUT | |
151 | + selectedFields : {type : Array, value : ["", ""]}, | |
152 | + aggregators : {type : Array, value : []}, | |
153 | + orders : {type : Array, value : []}, | |
154 | + | |
155 | + expert : { | |
156 | + type : Boolean, | |
157 | + value : false | |
158 | + }, | |
159 | + | |
160 | + functions : { | |
161 | + type : Array, | |
162 | + value : ["COUNT", "SUM", "MIN", "MAX", "AVG", "FIRST", "LAST"] | |
163 | + }, | |
164 | + | |
165 | + inputs : { | |
166 | + type : Array, | |
167 | + value : [] | |
168 | + }, | |
169 | + | |
170 | + groupableFields : { | |
171 | + type : Array, | |
172 | + value : [] | |
173 | + }, | |
174 | + | |
175 | + aggregateFields : { | |
176 | + type : Array, | |
177 | + value : [""] | |
178 | + } | |
179 | + | |
180 | + }, | |
181 | + | |
182 | + ready : function() { | |
183 | + $(this.$.inputs_series_container).perfectScrollbar(); | |
184 | + }, | |
185 | + | |
186 | + attached : function() { | |
187 | + this._translate(); | |
188 | + }, | |
189 | + | |
190 | + _preselectInputs : function(fields, aggregators, orders) { | |
191 | + var ddls = this.$.inputs_series_container.querySelectorAll("paper-dropdown-menu"); | |
192 | + | |
193 | +// this.async(function () { | |
194 | + for (var i = 0; i < fields.length; i++) { | |
195 | + var menu = $(ddls[i]).find("paper-menu")[0]; | |
196 | + menu.select(i+1); | |
197 | + } | |
198 | + this.selectedFields = this._copy(fields); | |
199 | +// }, 0); | |
200 | + }, | |
201 | + | |
202 | + getSelectedFields : function () { | |
203 | + var gb_menu = $(this.$.group_by).find("paper-menu")[0]; | |
204 | + var c_menu = $("#calculate_0").find("paper-menu")[0]; | |
205 | + | |
206 | + if(gb_menu.selectedItem && c_menu.selectedItem && gb_menu.selectedItem.id != 0) { | |
207 | + var groupByField = this.groupableFields[gb_menu.selected]; | |
208 | + if (groupByField != this.selectedFields[0]) | |
209 | + return [this.selectedFields[0], groupByField, this.selectedFields[1]]; | |
210 | + } | |
211 | + return this.selectedFields; | |
212 | + }, | |
213 | + | |
214 | + getAggregators : function () { | |
215 | + return this.aggregators; | |
216 | + }, | |
217 | + | |
218 | + getOrders : function () { | |
219 | + return this.orders; | |
220 | + }, | |
221 | + | |
222 | + setFields : function(fields) { | |
223 | + var temp = this._copy(fields); | |
224 | + temp.unshift(""); | |
225 | + | |
226 | + if (JSON.stringify(this.fields) != JSON.stringify(temp)) { | |
227 | + this.fields = this._copy(temp); | |
228 | + this._reset(); | |
229 | + } | |
230 | + }, | |
231 | + | |
232 | + setInputs : function(inputs) { | |
233 | + this.inputs = this._copy(inputs); | |
234 | + }, | |
235 | + | |
236 | + fireReady : function() { | |
237 | + if(this.selectedFields[0] != "" && this.selectedFields[1] != "") | |
238 | + this.fire('select_visualization_inputs_ready', {isReady: true}); | |
239 | + else | |
240 | + this.fire('select_visualization_inputs_ready', {isReady: false}); | |
241 | + }, | |
242 | + | |
243 | + _reset : function() { | |
244 | + //this.fields = []; --> setFields | |
245 | + //this.inputs = []; --> setInputs | |
246 | + this.selectedFields = ["", ""]; | |
247 | + this.aggregators = []; | |
248 | + //this.orders = []; --> _resetOrders | |
249 | + this.expert = true; | |
250 | + this._showExpertMode();//expert --> false | |
251 | + this.groupableFields = []; | |
252 | + this.aggregateFields = [""]; | |
253 | + | |
254 | + this.async(function () { | |
255 | + //reset ddl | |
256 | + var ddls = this.$.inputs_series_container.getElementsByTagName("paper-dropdown-menu"); | |
257 | + for (var i = 0; i < ddls.length; i++) | |
258 | + $(ddls[i]).find("paper-menu")[0].select(-1); | |
259 | + this.$.group_by.setAttribute("disabled", ""); | |
260 | + $("#calculate_0")[0].setAttribute("disabled", ""); | |
261 | + //reset orders | |
262 | + this._resetOrders(); | |
263 | + }, 1); | |
264 | + }, | |
265 | + | |
266 | + _translate : function(){ | |
267 | + this.$.inputs.innerHTML = ln["inputs_" + ln["localization"]]; | |
268 | + this.$.groupBy.innerHTML = ln["expertGroupBy_" + ln["localization"]]; | |
269 | + | |
270 | + this.$.group_by.setAttribute("label", ln["groupBy_" + ln["localization"]]); | |
271 | + }, | |
272 | + | |
273 | + _showExpertMode : function() { | |
274 | + if(!this.expert) { | |
275 | + this.$.expert_header.style.color = "#000000"; | |
276 | + this.$.expert_header.style.background = "#B6B6B6"; | |
277 | + this.$.expert_container.style.display = "block"; | |
278 | + } | |
279 | + else { | |
280 | + this.$.expert_header.style.color = "#00BCD4"; | |
281 | + this.$.expert_header.style.background = "#FFFFFF"; | |
282 | + this.$.expert_container.style.display = "none"; | |
283 | + } | |
284 | + | |
285 | + this.expert = !this.expert; | |
286 | + }, | |
287 | + | |
288 | + _addInput : function(e){ | |
289 | + var selectedFields = this._copy(this.selectedFields); | |
290 | + | |
291 | + var ddl_index = $(e.target).parents("paper-dropdown-menu")[0].id; | |
292 | + var index = e.target.id; | |
293 | + selectedFields[ddl_index] = this.fields[index]; | |
294 | + | |
295 | + this.selectedFields = this._copy(selectedFields); | |
296 | + | |
297 | + if(this.selectedFields[0] == "" || this.selectedFields[1] == "") { | |
298 | + this.$.group_by.setAttribute("disabled", ""); | |
299 | + $("#calculate_0")[0].setAttribute("disabled", ""); | |
300 | + | |
301 | + this.groupableFields = []; | |
302 | + this.aggregateFields = [""]; | |
303 | + var menu = $("#calculate_0").find("paper-menu")[0]; | |
304 | + menu.select(-1); | |
305 | + } | |
306 | + else { | |
307 | + this.$.group_by.removeAttribute("disabled"); | |
308 | + $("#calculate_0")[0].removeAttribute("disabled"); | |
309 | + | |
310 | + var groupableFields = []; | |
311 | + for (var i = 0; i < this.fields.length; i++) { | |
312 | + if(this.fields[i] != this.selectedFields[1]) | |
313 | + groupableFields.push(this.fields[i]); | |
314 | + } | |
315 | + this.groupableFields = this._copy(groupableFields); | |
316 | + this.aggregateFields = [this.selectedFields[1]]; | |
317 | + | |
318 | + this.async(function () { | |
319 | + var menu = $(this.$.group_by).find("paper-menu")[0]; | |
320 | + menu.select(-1); | |
321 | + var menu = $("#calculate_0").find("paper-menu")[0]; | |
322 | + //var selected = menu.selected; | |
323 | + menu.select(-1); | |
324 | + //menu.select(selected); | |
325 | + }, 0); | |
326 | + } | |
327 | + this._setAggregators(); | |
328 | + }, | |
329 | + | |
330 | + _setAggregatorsFields : function(){ | |
331 | + this.async(function() { | |
332 | + var c_menu = $("#calculate_0").find("paper-menu")[0]; | |
333 | + var selected = c_menu.selected > 0 ? c_menu.selected : 0; | |
334 | + c_menu.select(-1); | |
335 | + c_menu.select(selected); | |
336 | + | |
337 | + this._setAggregators(); | |
338 | + }, 0); | |
339 | + }, | |
340 | + | |
341 | + _setAggregators : function(){ | |
342 | + this.async(function() { | |
343 | + this.aggregators = []; | |
344 | + | |
345 | + this._resetOrders(); | |
346 | + | |
347 | + $("#gb")[0].setAttribute("disabled", ""); | |
348 | + | |
349 | + var gb_menu = $(this.$.group_by).find("paper-menu")[0]; | |
350 | + var c_menu = $("#calculate_0").find("paper-menu")[0]; | |
351 | + | |
352 | + if(gb_menu.selectedItem && c_menu.selectedItem && gb_menu.selectedItem.id != 0) { | |
353 | + var groupByField = this.groupableFields[gb_menu.selected]; | |
354 | + var operationIndex = c_menu.selectedItem.id; | |
355 | + | |
356 | + if (groupByField == this.selectedFields[0]){// X Axis field | |
357 | + this.aggregators.push({"field": groupByField, "operation": "GROUP BY"}); | |
358 | + } | |
359 | + else{ | |
360 | + $("#gb")[0].removeAttribute("disabled"); | |
361 | + this.aggregators.push({"field": this.selectedFields[0], "operation": "GROUP BY"}); | |
362 | + this.aggregators.push({"field": groupByField, "operation": "GROUP BY"}); | |
363 | + } | |
364 | + | |
365 | + this.aggregators.push({"field": this.selectedFields[1], "operation": this.functions[operationIndex]}); | |
366 | + } | |
367 | + | |
368 | + this.fireReady(); | |
369 | + }, 0); | |
370 | + }, | |
371 | + | |
372 | + _setOrders : function(e){ | |
373 | + var t = e.target; | |
374 | + if(t.tagName.indexOf("IRON-ICON") > -1) | |
375 | + t = $(e.target).parents("paper-icon-button")[0]; | |
376 | + | |
377 | + var icon = t.getAttribute("icon"); | |
378 | + var id = t.getAttribute("id"); | |
379 | + var field; | |
380 | + | |
381 | + if(id == "gb"){ | |
382 | + var gb_menu = $(this.$.group_by).find("paper-menu")[0]; | |
383 | + field = this.groupableFields[gb_menu.selected]; | |
384 | + } | |
385 | + else { | |
386 | + field = this.selectedFields[id]; | |
387 | + } | |
388 | + | |
389 | + if(icon.indexOf("unfold-more") > -1){ | |
390 | + t.setAttribute("icon", "expand-less"); | |
391 | + t.setAttribute("title", ln["sortAscending_" + ln["localization"]]); | |
392 | + var orders = this.orders.filter(function (el) { return el.field !== field; }); | |
393 | + orders.unshift({"field": field, "operation": "ASC"}); | |
394 | + this.orders = this._copy(orders); | |
395 | + } | |
396 | + else if(icon.indexOf("expand-less") > -1){ | |
397 | + t.setAttribute("icon", "expand-more"); | |
398 | + t.setAttribute("title", ln["sortDescending_" + ln["localization"]]); | |
399 | + var orders = this.orders.filter(function (el) { return el.field !== field; }); | |
400 | + orders.unshift({"field": field, "operation": "DESC"}); | |
401 | + this.orders = this._copy(orders); | |
402 | + } | |
403 | + else if(icon.indexOf("expand-more") > -1){ | |
404 | + t.setAttribute("icon", "unfold-more"); | |
405 | + t.setAttribute("title", ln["unsort_" + ln["localization"]]); | |
406 | + var orders = this.orders.filter(function (el) { return el.field !== field; }); | |
407 | + this.orders = this._copy(orders); | |
408 | + } | |
409 | + | |
410 | + this.fireReady(); | |
411 | + }, | |
412 | + | |
413 | + _resetOrders : function(){ | |
414 | + var icons = this.$.inputs_series_container.querySelectorAll("paper-icon-button"); | |
415 | + for (var i = 0; i < icons.length; i++){ | |
416 | + icons[i].setAttribute("icon", "unfold-more"); | |
417 | + icons[i].setAttribute("title", ln["unsort_" + ln["localization"]]); | |
418 | + } | |
419 | + this.orders = []; | |
420 | + }, | |
421 | + | |
422 | + _fieldName : function(field) { | |
423 | + return field.substring(field.lastIndexOf(",")+1, field.length); | |
424 | + }, | |
425 | + | |
426 | + _getLabelName: function(key) { | |
427 | + return ln[key + "_" +ln["localization"]]; | |
428 | + }, | |
429 | + | |
430 | + _operationName: function(index) { | |
431 | + var key = this.functions[index]; | |
432 | + return ln[key + "_" +ln["localization"]]; | |
433 | + }, | |
434 | + | |
435 | + _calculateLabel: function() { | |
436 | + return ln["calculate" + "_" +ln["localization"]]; | |
437 | + }, | |
438 | + | |
439 | + _copy : function(o) { | |
440 | + var out, v, key; | |
441 | + out = Array.isArray(o) ? new Array(o.length) : {}; | |
442 | + for (key in o) { | |
443 | + v = o[key]; | |
444 | + out[key] = (typeof v === "object") ? this._copy(v) : v; | |
445 | + } | |
446 | + return out; | |
447 | + } | |
448 | + | |
449 | + }); | |
450 | + | |
451 | + </script> | |
452 | + | |
453 | +</dom-module> | |
0 | 454 | \ No newline at end of file | ... | ... |