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,56 +9,15 @@ | ||
| 9 | <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script> | 9 | <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script> |
| 10 | <link rel="stylesheet" href="../../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css"> | 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 | <link rel="import" href="../data-sevc-controllet.html" /> | 12 | <link rel="import" href="../data-sevc-controllet.html" /> |
| 19 | </head> | 13 | </head> |
| 20 | 14 | ||
| 21 | <body> | 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 | </body> | 22 | </body> |
| 64 | 23 |
controllets/select-dataset-controllet/select-dataset-controllet.html
| @@ -193,11 +193,31 @@ | @@ -193,11 +193,31 @@ | ||
| 193 | } | 193 | } |
| 194 | 194 | ||
| 195 | #select_dataset_container #header { | 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 | background-color: #B6B6B6; | 202 | background-color: #B6B6B6; |
| 197 | display: flex; | 203 | display: flex; |
| 198 | padding: 0px 4px; | 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 | #select_dataset_container #footer_list, | 221 | #select_dataset_container #footer_list, |
| 202 | #select_dataset_container #footer_treemap { | 222 | #select_dataset_container #footer_treemap { |
| 203 | width: 100%; | 223 | width: 100%; |
| @@ -250,7 +270,7 @@ | @@ -250,7 +270,7 @@ | ||
| 250 | <paper-tabs selected="{{selected}}" no-bar> | 270 | <paper-tabs selected="{{selected}}" no-bar> |
| 251 | <paper-tab noink on-tap="_refreshList"><span id="listView"></span></paper-tab> | 271 | <paper-tab noink on-tap="_refreshList"><span id="listView"></span></paper-tab> |
| 252 | <!--<paper-tab noink ><span id="listView"></span></paper-tab>--> | 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 | </paper-tabs> | 274 | </paper-tabs> |
| 255 | 275 | ||
| 256 | <div id="header"> | 276 | <div id="header"> |
| @@ -515,6 +535,12 @@ | @@ -515,6 +535,12 @@ | ||
| 515 | 535 | ||
| 516 | _refreshList : function() { | 536 | _refreshList : function() { |
| 517 | this.shownDatasets = this.filteredDatasets.slice(this.prev - 1, this.next); | 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 | _clearInput : function() { | 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 | \ No newline at end of file | 454 | \ No newline at end of file |