SGH / COMPONENTS

Commit a0614e29c1f1c6d73468f5059fe02a6c88e7de05

Authored by Luigi Serra
2 parents 478a3abe 20799010

Merge branch 'master' of http://service.routetopa.eu:7480/WebCompDev/COMPONENTS

Inline Side-by-side
Showing 3 changed files with 486 additions and 47 deletions
controllets/data-sevc-controllet/demo/index.html
  View file @a0614e2
... ... @@ -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   - <!--&lt;!&ndash;<meta name="defaultLanguage" content="en">&ndash;&gt;-->
13   - <meta name="availableLanguages" content="en, it">
14   - <!--&lt;!&ndash;<link rel="localization" href="../../../locales/{locale}.l20n">&ndash;&gt;-->
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
  View file @a0614e2
... ... @@ -129,6 +129,7 @@
129 129 display: flex;
130 130 padding: 11px;
131 131 border: 1px solid #B6B6B6;
  132 + border-radius: 4px;
132 133 cursor: pointer;
133 134 margin-bottom: 8px;
134 135 background-color: #E0E0E0;
... ... @@ -193,11 +194,31 @@
193 194 }
194 195  
195 196 #select_dataset_container #header {
  197 + position: relative;
  198 + z-index: 1;
  199 + -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);
  200 + -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);
  201 + 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);
  202 +
196 203 background-color: #B6B6B6;
197 204 display: flex;
198 205 padding: 0px 4px;
199 206 }
200 207  
  208 + #select_dataset_container #footer_list {
  209 + position: relative;
  210 + z-index: 1;
  211 + -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);
  212 + -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);
  213 + 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);
  214 + }
  215 +
  216 + .noshadow {
  217 + -webkit-box-shadow: none !important;
  218 + -moz-box-shadow: none !important;
  219 + box-shadow: none !important;
  220 + }
  221 +
201 222 #select_dataset_container #footer_list,
202 223 #select_dataset_container #footer_treemap {
203 224 width: 100%;
... ... @@ -250,7 +271,7 @@
250 271 <paper-tabs selected="{{selected}}" no-bar>
251 272 <paper-tab noink on-tap="_refreshList"><span id="listView"></span></paper-tab>
252 273 <!--<paper-tab noink ><span id="listView"></span></paper-tab>-->
253   - <paper-tab noink><span id="treeMapView"></span></paper-tab>
  274 + <paper-tab on-tap="_noShadow" noink><span id="treeMapView"></span></paper-tab>
254 275 </paper-tabs>
255 276  
256 277 <div id="header">
... ... @@ -408,7 +429,7 @@
408 429 attached: function() {
409 430 this._resize();
410 431 var that = this;
411   - window.addEventListener("resize", function() { that._resize(); });
  432 + window.addEventListener("resize", function() { that._resize(); that._loadTreeMap();});
412 433  
413 434 this.providers = this.datasets["result"]["providers"];
414 435 this.datasets = this.datasets["result"]["datasets"];
... ... @@ -515,6 +536,12 @@
515 536  
516 537 _refreshList : function() {
517 538 this.shownDatasets = this.filteredDatasets.slice(this.prev - 1, this.next);
  539 + this.$.header.className = this.$.header.className.replace(" noshadow", "");
  540 + },
  541 +
  542 + _noShadow : function() {
  543 + console.log(this.$.header);
  544 + this.$.header.className += " noshadow";
518 545 },
519 546  
520 547 _clearInput : function() {
... ...
controllets/select-visualization-controllet/select-datalet-inputs_series_original.html 0 → 100644
  View file @a0614e2
  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
... ...