Commit 57ef9bf428219b7e5a47439389b05458f2654811
1 parent
0ff13705
labels + info
Showing
3 changed files
with
99 additions
and
308 deletions
controllets/datalet-selection-controllet/datalet-selection-controllet.html
| ... | ... | @@ -14,6 +14,8 @@ |
| 14 | 14 | |
| 15 | 15 | <link rel="import" href="../../bower_components/paper-button/paper-button.html"> |
| 16 | 16 | |
| 17 | +<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html"> | |
| 18 | + | |
| 17 | 19 | <link rel="import" href="../items-vslider-controllet/items-vslider-controllet.html" /> |
| 18 | 20 | |
| 19 | 21 | <script src="../../../DEEPCLIENT/js/deepClient.js"></script> |
| ... | ... | @@ -169,6 +171,11 @@ |
| 169 | 171 | paper-button[disabled] { |
| 170 | 172 | background-color: #B6B6B6; |
| 171 | 173 | } |
| 174 | + | |
| 175 | + #dialog_info { | |
| 176 | + border: 2px solid #2196F3; | |
| 177 | + background-color: #E0E0E0; | |
| 178 | + } | |
| 172 | 179 | </style> |
| 173 | 180 | |
| 174 | 181 | <iron-ajax id="selectedDatalet_request" on-response="_handleSelectedDatalet"></iron-ajax> |
| ... | ... | @@ -239,6 +246,11 @@ |
| 239 | 246 | |
| 240 | 247 | </div> |
| 241 | 248 | |
| 249 | + <paper-dialog id="dialog_info"> | |
| 250 | + <h2 id="dialog_name"></h2> | |
| 251 | + <p id="dialog_description"></p> | |
| 252 | + </paper-dialog> | |
| 253 | + | |
| 242 | 254 | </div> |
| 243 | 255 | |
| 244 | 256 | </template> |
| ... | ... | @@ -301,6 +313,11 @@ |
| 301 | 313 | value : undefined |
| 302 | 314 | }, |
| 303 | 315 | |
| 316 | + params:{ | |
| 317 | + type: Object, | |
| 318 | + value: undefined | |
| 319 | + }, | |
| 320 | + | |
| 304 | 321 | modify : { |
| 305 | 322 | type : Boolean, |
| 306 | 323 | value : false |
| ... | ... | @@ -325,6 +342,8 @@ |
| 325 | 342 | this._preselectDatalet(); |
| 326 | 343 | this.preselectedDatalet = undefined; |
| 327 | 344 | } |
| 345 | + | |
| 346 | + this.params = {'data-url' : this.dataUrl}; | |
| 328 | 347 | }, |
| 329 | 348 | |
| 330 | 349 | attached : function() { |
| ... | ... | @@ -440,6 +459,14 @@ |
| 440 | 459 | } |
| 441 | 460 | |
| 442 | 461 | if(load){ |
| 462 | + var labels = this.$.datalet_selection_labels.querySelectorAll("paper-textarea"); | |
| 463 | + console.log(labels); | |
| 464 | + for (var i = 0; i < labels.length; i++) { | |
| 465 | + if (labels[i].innerHTML.trim() != "") { | |
| 466 | + this.params[labels[i].label] = labels[i].value; | |
| 467 | + } | |
| 468 | + } | |
| 469 | + | |
| 443 | 470 | this._loadDatalet(selectedFields); |
| 444 | 471 | } |
| 445 | 472 | |
| ... | ... | @@ -451,11 +478,11 @@ |
| 451 | 478 | }, |
| 452 | 479 | |
| 453 | 480 | _loadDatalet : function(selectedFields){ |
| 454 | - var params = {'data-url' : this.dataUrl}; | |
| 481 | +// var params = {'data-url' : this.dataUrl}; | |
| 455 | 482 | |
| 456 | 483 | var dataletParams ={ |
| 457 | 484 | component : this.selectedDatalet+"-datalet", |
| 458 | - params : params, | |
| 485 | + params : this.params, | |
| 459 | 486 | fields : selectedFields, |
| 460 | 487 | placeHolder : this.$.datalet_selection_datalet_placeholder |
| 461 | 488 | }; |
| ... | ... | @@ -475,8 +502,8 @@ |
| 475 | 502 | |
| 476 | 503 | var data = { |
| 477 | 504 | dataUrl : this.dataUrl, |
| 478 | -// params : this.paramsFields, | |
| 479 | - params : {'data-url' : this.dataUrl}, | |
| 505 | + params : this.params, | |
| 506 | +// params : {'data-url' : this.dataUrl}, | |
| 480 | 507 | fields : selectedFields, |
| 481 | 508 | datalet : this.selectedDatalet+"-datalet", |
| 482 | 509 | comment : this.$.comment.value, |
| ... | ... | @@ -487,6 +514,26 @@ |
| 487 | 514 | |
| 488 | 515 | }, |
| 489 | 516 | |
| 517 | + _showInfo : function(e){ | |
| 518 | + var t = e.target; | |
| 519 | + if(t.tagName.indexOf("IRON-ICON") != -1) | |
| 520 | + t = $(e.target).parents("paper-icon-button")[0]; | |
| 521 | + | |
| 522 | + var name = t.getAttribute("title").replace(" info", ""); | |
| 523 | + | |
| 524 | + var dataset = $.grep(this.inputs, function(e){ return e.name == name; })[0]; | |
| 525 | + if(!dataset) | |
| 526 | + dataset = $.grep(this.labels, function(e){ return e.name == name; })[0]; | |
| 527 | + | |
| 528 | + this.$.dialog_name.innerHTML = dataset.name; | |
| 529 | + this.$.dialog_description.innerHTML = dataset.description; | |
| 530 | + this.$.dialog_info.open(); | |
| 531 | + | |
| 532 | + var pos = t.getBoundingClientRect(); | |
| 533 | + $("#dialog_info").css("top", pos.top - 4); | |
| 534 | + $("#dialog_info").css("left", pos.left - 4); | |
| 535 | + }, | |
| 536 | + | |
| 490 | 537 | _copy : function(o) { |
| 491 | 538 | var out, v, key; |
| 492 | 539 | out = Array.isArray(o) ? new Array(o.length) : {}; | ... | ... |
controllets/dataset-selection-controllet/dataset-selection-controllet.html
| ... | ... | @@ -20,12 +20,9 @@ |
| 20 | 20 | <link rel="import" href="../../bower_components/iron-icon/iron-icon.html"> |
| 21 | 21 | |
| 22 | 22 | <link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html"> |
| 23 | -<link rel="import" href="../../bower_components/paper-dialog-scrollable/paper-dialog-scrollable.html"> | |
| 24 | 23 | |
| 25 | 24 | <link rel="import" href="../../datalets/datasetexplorer-datalet/datasetexplorer-datalet.html"> |
| 26 | 25 | |
| 27 | -<!--<script src="../../datalets/shared_js/d3.js"></script>--> | |
| 28 | - | |
| 29 | 26 | <link rel="import" href="paper-input-search.html"> |
| 30 | 27 | |
| 31 | 28 | <dom-module id="dataset-selection-controllet"> |
| ... | ... | @@ -63,7 +60,6 @@ |
| 63 | 60 | } |
| 64 | 61 | |
| 65 | 62 | paper-dropdown-menu { |
| 66 | - /*display: block;*/ | |
| 67 | 63 | width: 45%; |
| 68 | 64 | margin-bottom: 32px; |
| 69 | 65 | --paper-input-container-focus-color: #2196F3; |
| ... | ... | @@ -93,20 +89,11 @@ |
| 93 | 89 | } |
| 94 | 90 | |
| 95 | 91 | .info_button { |
| 96 | - /*background-color: red;*/ | |
| 97 | 92 | position: absolute; |
| 98 | 93 | top: 18px; |
| 99 | 94 | left: 45%; |
| 100 | 95 | } |
| 101 | 96 | |
| 102 | - /*paper-menu{*/ | |
| 103 | - /*/!*visibility: visible ! important;*!/*/ | |
| 104 | - /*}*/ | |
| 105 | - | |
| 106 | - /*paper-item[focused] {*/ | |
| 107 | - /*background: #FFFFFF;*/ | |
| 108 | - /*}*/ | |
| 109 | - | |
| 110 | 97 | paper-textarea { |
| 111 | 98 | width: 90%; |
| 112 | 99 | margin-bottom: 32px; |
| ... | ... | @@ -124,27 +111,16 @@ |
| 124 | 111 | |
| 125 | 112 | #material_container { |
| 126 | 113 | margin-top: 8px; |
| 127 | - /*height: 55vh;*/ | |
| 128 | 114 | } |
| 129 | 115 | |
| 130 | 116 | #div_selection { |
| 131 | 117 | padding-left: 10%; |
| 132 | 118 | padding-top: 64px; |
| 133 | - /*padding-bottom: 64px;*/ | |
| 134 | 119 | } |
| 135 | 120 | |
| 136 | 121 | #dialog_info { |
| 137 | 122 | border: 2px solid #2196F3; |
| 138 | 123 | background-color: #E0E0E0; |
| 139 | - position: fixed; | |
| 140 | - top: 232px; | |
| 141 | - width: 60%; | |
| 142 | - height: auto; | |
| 143 | - /*overflow: auto;*/ | |
| 144 | - } | |
| 145 | - | |
| 146 | - #div_datasetexplorer { | |
| 147 | - /*padding-top: 48px;*/ | |
| 148 | 124 | } |
| 149 | 125 | </style> |
| 150 | 126 | |
| ... | ... | @@ -162,11 +138,10 @@ |
| 162 | 138 | |
| 163 | 139 | <div id="div_selection"> |
| 164 | 140 | <div class="ddl_container"> |
| 165 | - <paper-input-search id="input_search" label="Available datasets"> | |
| 141 | + <paper-input-search id="_datasets" label="Available datasets"> | |
| 166 | 142 | <paper-menu class="dropdown-content"> |
| 167 | 143 | <template is="dom-repeat" items={{filteredDatasets}} as="dataset"> |
| 168 | 144 | <paper-item id={{index}} on-tap="_selectDataUrl">{{dataset.name}}</paper-item> |
| 169 | - <!--<paper-item id={{index}} on-tap="_selectDataUrl">{{_addHTMLSpace(dataset.name)}}</paper-item>--> | |
| 170 | 145 | </template> |
| 171 | 146 | </paper-menu> |
| 172 | 147 | </paper-input-search> |
| ... | ... | @@ -177,12 +152,12 @@ |
| 177 | 152 | </div> |
| 178 | 153 | |
| 179 | 154 | <template is="dom-if" if={{isSuggested}}> |
| 155 | + | |
| 180 | 156 | <div class="ddl_container"> |
| 181 | - <paper-dropdown-menu label="Suggested datasets"> | |
| 157 | + <paper-dropdown-menu id="s_datasets" label="Suggested datasets"> | |
| 182 | 158 | <paper-menu class="dropdown-content"> |
| 183 | 159 | <template is="dom-repeat" items={{suggestedDatasets}} as="dataset"> |
| 184 | 160 | <paper-item id={{index}} on-tap="_selectSuggestedDataUrl">{{dataset.name}}</paper-item> |
| 185 | - <!--<paper-item id={{index}} on-tap="_selectDataUrl">{{_addHTMLSpace(dataset.name)}}</paper-item>--> | |
| 186 | 161 | </template> |
| 187 | 162 | </paper-menu> |
| 188 | 163 | </paper-dropdown-menu> |
| ... | ... | @@ -196,7 +171,6 @@ |
| 196 | 171 | |
| 197 | 172 | <paper-textarea id="selected_url" label="Selected url" value={{dataUrl}}></paper-textarea> |
| 198 | 173 | |
| 199 | - <!--aggiustami anche dialog...--> | |
| 200 | 174 | <paper-dialog id="dialog_info"> |
| 201 | 175 | <h2 id="dialog_name"></h2> |
| 202 | 176 | <p id="dialog_description"></p> |
| ... | ... | @@ -207,9 +181,6 @@ |
| 207 | 181 | |
| 208 | 182 | <neon-animatable> |
| 209 | 183 | <div id="div_datasetexplorer"></div> |
| 210 | - <!--<datasetexplorer-datalet class="datasetexplorer" data-url="/openwall/api/datasetTree" fields='["result,provider_name","result,organization_name","result,package_name","result,resource_name","result,url","result,w"]'></datasetexplorer-datalet>--> | |
| 211 | - <!--<datasetexplorer-datalet id="datasetexplorer" data-url="/oxwall_x.y.z/openwall/api/datasetTree" fields='["result,provider_name","result,organization_name","result,package_name","result,resource_name","result,url","result,w"]'></datasetexplorer-datalet>--> | |
| 212 | - <!--</div>--> | |
| 213 | 184 | </neon-animatable> |
| 214 | 185 | |
| 215 | 186 | <neon-animatable> |
| ... | ... | @@ -286,12 +257,6 @@ |
| 286 | 257 | this._loadTreeMap(); |
| 287 | 258 | }, |
| 288 | 259 | |
| 289 | -// _isSuggested : function(){ | |
| 290 | -// if(this.suggestedDatasets) | |
| 291 | -// return true; | |
| 292 | -// return false; | |
| 293 | -// }, | |
| 294 | - | |
| 295 | 260 | _filterDatasets : function(e){ |
| 296 | 261 | var filter = e.detail.inputValue; |
| 297 | 262 | var filteredDatasets = []; |
| ... | ... | @@ -306,68 +271,79 @@ |
| 306 | 271 | _loadTreeMap : function(){ |
| 307 | 272 | var h = $("#material_container").height() - 48; |
| 308 | 273 | var w = $("#material_container").width(); |
| 309 | - | |
| 310 | -// if(this.selected != 1 && this.$.div_datasetexplorer.innerHTML == "") | |
| 274 | + // /oxwall_x.y.z | |
| 311 | 275 | this.$.div_datasetexplorer.innerHTML = "<datasetexplorer-datalet width=\""+w+"\" height=\""+h+"\" data-url=\"/openwall/api/datasetTree\" fields='[\"result,provider_name\",\"result,organization_name\",\"result,package_name\",\"result,resource_name\",\"result,url\",\"result,w\"]'></datasetexplorer-datalet>"; |
| 312 | 276 | }, |
| 313 | 277 | |
| 314 | - _selectDataUrl_treeMap : function(e){ | |
| 315 | - var url = e.detail.url; | |
| 316 | - url = url.split('/'); | |
| 317 | - var index = url.indexOf('resource') | |
| 318 | - if (index != -1) { // ckan | |
| 319 | - var resourceId = url[index + 1]; | |
| 320 | - url = "http://ckan.routetopa.eu/api/action/datastore_search?resource_id=" + resourceId; | |
| 278 | + _selectDataUrl_treeMap : function(e) { | |
| 279 | + $("#_datasets")[0]._setSelectedItem(null); | |
| 280 | + $("#_datasets")[0].inputValue = ""; | |
| 281 | + $("#info_dataset")[0].setAttribute("disabled", "true"); | |
| 321 | 282 | |
| 322 | - } else | |
| 323 | - url = "sorry, data provider not supported yet"; | |
| 283 | + if (this.isSuggested) { | |
| 284 | + $("#s_datasets")[0]._setSelectedItem(null); | |
| 285 | + $("#s_datasets")[0].contentElement.select(-1); | |
| 286 | + $("#info_s_dataset")[0].setAttribute("disabled", "true"); | |
| 287 | + } | |
| 324 | 288 | |
| 325 | - this.dataUrl = url; | |
| 289 | + this.dataUrl = e.detail.url; | |
| 326 | 290 | this.selected=0; |
| 327 | 291 | }, |
| 328 | 292 | |
| 329 | 293 | _selectDataUrl : function(e){ |
| 330 | - console.log(e.target); | |
| 294 | + if (this.isSuggested) { | |
| 295 | + $("#s_datasets")[0]._setSelectedItem(null); | |
| 296 | + $("#s_datasets")[0].contentElement.select(-1); | |
| 297 | + $("#info_s_dataset")[0].setAttribute("disabled", "true"); | |
| 298 | + } | |
| 299 | + | |
| 331 | 300 | var dataset = this.filteredDatasets[parseInt(e.target.id)] |
| 332 | 301 | |
| 333 | 302 | this.dataUrl = dataset.url; |
| 334 | 303 | |
| 335 | -// if(dataset.description != ""){ | |
| 336 | -// this.$.info_button.removeAttribute("disabled"); | |
| 337 | -// this.$.dialog_name.innerHTML = dataset.name; | |
| 338 | -// this.$.dialog_description.innerHTML = dataset.description; | |
| 339 | -// } | |
| 340 | -// else | |
| 341 | -// this.$.info_button.setAttribute("disabled", "true"); | |
| 304 | + if(dataset.description != ""){ | |
| 305 | + $("#info_dataset")[0].removeAttribute("disabled"); | |
| 306 | + this.$.dialog_name.innerHTML = dataset.name; | |
| 307 | + this.$.dialog_description.innerHTML = dataset.description; | |
| 308 | + } | |
| 309 | + else | |
| 310 | + $("#info_dataset")[0].setAttribute("disabled", "true"); | |
| 342 | 311 | }, |
| 343 | 312 | |
| 344 | 313 | _selectSuggestedDataUrl : function(e){ |
| 345 | - console.log(e.target); | |
| 314 | + $("#_datasets")[0]._setSelectedItem(null); | |
| 315 | + $("#_datasets")[0].inputValue = ""; | |
| 316 | + $("#info_dataset")[0].setAttribute("disabled", "true"); | |
| 317 | + | |
| 346 | 318 | var dataset = this.suggestedDatasets[parseInt(e.target.id)] |
| 347 | 319 | |
| 348 | 320 | this.dataUrl = dataset.url; |
| 349 | 321 | |
| 350 | -// if(dataset.description != ""){ | |
| 351 | -// this.$.info_button.removeAttribute("disabled"); | |
| 352 | -// this.$.dialog_name.innerHTML = dataset.name; | |
| 353 | -// this.$.dialog_description.innerHTML = dataset.description; | |
| 354 | -// } | |
| 355 | -// else | |
| 356 | -// this.$.info_button.setAttribute("disabled", "true"); | |
| 322 | + if(dataset.description != ""){ | |
| 323 | + $("#info_s_dataset")[0].removeAttribute("disabled"); | |
| 324 | + this.$.dialog_name.innerHTML = dataset.name; | |
| 325 | + this.$.dialog_description.innerHTML = dataset.description; | |
| 326 | + } | |
| 327 | + else | |
| 328 | + $("#info_s_dataset")[0].setAttribute("disabled", "true"); | |
| 357 | 329 | }, |
| 358 | 330 | |
| 359 | - _showInfo : function(){ | |
| 331 | + _showInfo : function(e){ | |
| 332 | + var t = e.target; | |
| 333 | + if(t.tagName.indexOf("IRON-ICON") != -1) | |
| 334 | + t = $(e.target).parents("paper-icon-button")[0]; | |
| 335 | + | |
| 360 | 336 | this.$.dialog_info.open(); |
| 337 | + | |
| 338 | + var pos = t.getBoundingClientRect(); | |
| 339 | + $("#dialog_info").css("top", pos.top - 4); | |
| 340 | + $("#dialog_info").css("left", pos.left - 4); | |
| 361 | 341 | }, |
| 362 | 342 | |
| 363 | 343 | _fireDataUrl : function(){ |
| 364 | 344 | this.fire('dataset-selection-controllet_data-url', {url: this.dataUrl}); |
| 365 | 345 | }, |
| 366 | 346 | |
| 367 | -// _addHTMLSpace : function(name){ | |
| 368 | -// return name.replace(/ /g, ' '); | |
| 369 | -// }, | |
| 370 | - | |
| 371 | 347 | _resize : function(){ |
| 372 | 348 | var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0) - 16; |
| 373 | 349 | h = h - 64 - 8; //height with page scroller | ... | ... |
controllets/dataset-selection-controllet/paper-input-search.html
| ... | ... | @@ -441,236 +441,4 @@ respectively. |
| 441 | 441 | } |
| 442 | 442 | }); |
| 443 | 443 | })(); |
| 444 | -</script> | |
| 445 | - | |
| 446 | - | |
| 447 | - | |
| 448 | - | |
| 449 | -<!--<link rel="import" href="../../bower_components/polymer/polymer.html">--> | |
| 450 | - | |
| 451 | -<!--<link rel="import" href="../../bower_components/paper-tabs/paper-tabs.html">--> | |
| 452 | -<!--<link rel="import" href="../../bower_components/paper-tabs/paper-tab.html">--> | |
| 453 | - | |
| 454 | -<!--<link rel="import" href="../../bower_components/neon-animation/neon-animation.html">--> | |
| 455 | -<!--<link rel="import" href="../../bower_components/neon-animation/neon-animatable.html">--> | |
| 456 | -<!--<link rel="import" href="../../bower_components/neon-animation/neon-animations.html">--> | |
| 457 | - | |
| 458 | -<!--<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">--> | |
| 459 | -<!--<link rel="import" href="../../bower_components/paper-menu/paper-menu.html">--> | |
| 460 | -<!--<link rel="import" href="../../bower_components/paper-item/paper-item.html">--> | |
| 461 | - | |
| 462 | -<!--<link rel="import" href="../../bower_components/paper-input/paper-textarea.html">--> | |
| 463 | - | |
| 464 | -<!--<link rel="import" href="../../bower_components/paper-material/paper-material.html" />--> | |
| 465 | - | |
| 466 | -<!--<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">--> | |
| 467 | -<!--<link rel="import" href="../../bower_components/iron-icons/iron-icons.html">--> | |
| 468 | -<!--<link rel="import" href="../../bower_components/iron-icon/iron-icon.html">--> | |
| 469 | - | |
| 470 | -<!--<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html">--> | |
| 471 | -<!--<link rel="import" href="../../bower_components/paper-dialog-scrollable/paper-dialog-scrollable.html">--> | |
| 472 | - | |
| 473 | -<!--<link rel="import" href="../../datalets/datasetexplorer-datalet/datasetexplorer-datalet.html">--> | |
| 474 | - | |
| 475 | -<!--<!–<script src="../../datalets/shared_js/d3.js"></script>–>--> | |
| 476 | - | |
| 477 | -<!--<link rel="import" href="../../bower_components/paper-input/paper-input.html">--> | |
| 478 | -<!--<link rel="import" href="demo/paper-autocomplete.html">--> | |
| 479 | - | |
| 480 | -<!--<dom-module id="paper-input-search">--> | |
| 481 | - | |
| 482 | - <!--<template>--> | |
| 483 | - | |
| 484 | - <!--<!–<paper-dropdown-menu label="Available datasets">–>--> | |
| 485 | - <!--<!–<paper-menu class="dropdown-content">–>--> | |
| 486 | - <!--<!–<template is="dom-repeat" items={{datasets}} as="dataset">–>--> | |
| 487 | - <!--<!–<paper-item id={{index}} on-tap="_selectDataUrl">{{dataset.name}}</paper-item>–>--> | |
| 488 | - <!--<!–</template>–>--> | |
| 489 | - <!--<!–</paper-menu>–>--> | |
| 490 | - <!--<!–</paper-dropdown-menu>–>--> | |
| 491 | - | |
| 492 | - <!--<!–<paper-icon-button id="info_button" disabled on-click="_showInfo" icon="info-outline" title="dataset info"></paper-icon-button>–>--> | |
| 493 | - | |
| 494 | - <!--<!–<paper-textarea id="selected_url" label="Selected url" value={{dataUrl}}></paper-textarea>–>--> | |
| 495 | - | |
| 496 | - <!--<!–<paper-dialog id="dialog_info">–>--> | |
| 497 | - <!--<!–<h2 id="dialog_name"></h2>–>--> | |
| 498 | - <!--<!–<p id="dialog_description"></p>–>--> | |
| 499 | - <!--<!–</paper-dialog>–>--> | |
| 500 | - | |
| 501 | - <!--<style is="custom-style">--> | |
| 502 | - <!--paper-input {--> | |
| 503 | - <!--width: 200px;--> | |
| 504 | - <!--}--> | |
| 505 | - <!--</style>--> | |
| 506 | - | |
| 507 | - <!--<paper-input list="filtered_datasets" bind-value="{{filter::input}}"></paper-input><!– is="iron-input" type="search"–>--> | |
| 508 | - | |
| 509 | - <!--<datalist id="filtered_datasets">--> | |
| 510 | - <!--<template is="dom-repeat" items={{_filteredDatasets}}>--> | |
| 511 | - <!--<option value={{item.name}}></option>--> | |
| 512 | - <!--</template>--> | |
| 513 | - <!--</datalist>--> | |
| 514 | - | |
| 515 | - <!--</template>--> | |
| 516 | - | |
| 517 | - <!--<script>--> | |
| 518 | - | |
| 519 | - <!--Polymer({--> | |
| 520 | - | |
| 521 | - <!--is : 'paper-input-search',--> | |
| 522 | - | |
| 523 | - <!--properties : {--> | |
| 524 | - | |
| 525 | - <!--datasets : {--> | |
| 526 | - <!--type : Array,--> | |
| 527 | - <!--value : undefined,--> | |
| 528 | -<!--// observer : '_ciao'--> | |
| 529 | - <!--},--> | |
| 530 | - | |
| 531 | - <!--_filteredDatasets : {--> | |
| 532 | - <!--type : Array,--> | |
| 533 | - <!--value: undefined--> | |
| 534 | - <!--},--> | |
| 535 | - | |
| 536 | - <!--filter: {--> | |
| 537 | - <!--type: String,--> | |
| 538 | - <!--value: "",--> | |
| 539 | - <!--observer: "_filterChanged"--> | |
| 540 | - <!--}--> | |
| 541 | - <!--},--> | |
| 542 | - | |
| 543 | - <!--attached : function(){--> | |
| 544 | - <!--this._filteredDatasets = this.datasets;--> | |
| 545 | - <!--console.log(this._filteredDatasets);--> | |
| 546 | - <!--},--> | |
| 547 | - | |
| 548 | - <!--_filterChanged : function(){--> | |
| 549 | -<!--// this.filteredDatalist = this.datalist;--> | |
| 550 | - <!--console.log(this.filter);--> | |
| 551 | - <!--},--> | |
| 552 | - | |
| 553 | - <!--});--> | |
| 554 | - | |
| 555 | - <!--</script>--> | |
| 556 | - | |
| 557 | -<!--</dom-module>--> | |
| 558 | - | |
| 559 | - | |
| 560 | -<!--paper-autocomplete!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!--> | |
| 561 | -<!--//http://stackoverflow.com/questions/31030583/polymer-paper-input-html-datalist-autocomplete-suggestions-list--> | |
| 562 | - | |
| 563 | -<!--<link rel="import" href="../../../bower_components/paper-input/paper-input.html">--> | |
| 564 | -<!--<link rel="import" href="../../../bower_components/paper-input/paper-input-container.html">--> | |
| 565 | -<!--<link rel="import" href="../../../bower_components/iron-collapse/iron-collapse.html">--> | |
| 566 | -<!--<link rel="import" href="../../../bower_components/paper-material/paper-material.html">--> | |
| 567 | -<!--<link rel="import" href="../../../bower_components/paper-button/paper-button.html">--> | |
| 568 | - | |
| 569 | -<!--<!–<link rel="import" href="../../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">–>--> | |
| 570 | -<!--<!–<link rel="import" href="../../../bower_components/paper-menu/paper-menu.html">–>--> | |
| 571 | -<!--<!–<link rel="import" href="../../../bower_components/paper-item/paper-item.html">–>--> | |
| 572 | - | |
| 573 | - | |
| 574 | -<!--<dom-module id="paper-autocomplete">--> | |
| 575 | - <!--<style>--> | |
| 576 | - <!--iron-collapse {--> | |
| 577 | - <!--box-shadow: 6px;--> | |
| 578 | - <!--}--> | |
| 579 | - | |
| 580 | - <!--paper-button {--> | |
| 581 | - <!--width: 100%;--> | |
| 582 | - <!--text-transform: none;--> | |
| 583 | - <!--}--> | |
| 584 | - | |
| 585 | - <!--paper-input-container {--> | |
| 586 | - <!--width: 200px;--> | |
| 587 | - <!--}--> | |
| 588 | - <!--</style>--> | |
| 589 | - <!--<template>--> | |
| 590 | - <!--<paper-input-container>--> | |
| 591 | - <!--<label>{{label}}</label>--> | |
| 592 | - <!--<content select=".content"></content>--> | |
| 593 | - <!--<input id="searchBox" class="paper-input-input" is="iron-input" bind-value="{{searchValue::input}}"></input>--> | |
| 594 | - <!--</paper-input-container>--> | |
| 595 | - | |
| 596 | - <!--<iron-collapse id="collapse">--> | |
| 597 | - | |
| 598 | - <!--<paper-material>--> | |
| 599 | - <!--<div>--> | |
| 600 | - <!--<template id="resultList" is="dom-repeat" items="{{choices}}" filter="_listFilter">--> | |
| 601 | - <!--<paper-item>--> | |
| 602 | - <!--<paper-button on-tap="_selectItem">{{item.name}}</paper-button>--> | |
| 603 | - <!--</paper-item>--> | |
| 604 | - <!--</template>--> | |
| 605 | - <!--</div>--> | |
| 606 | - <!--</paper-material>--> | |
| 607 | - <!--</iron-collapse>--> | |
| 608 | - | |
| 609 | - <!--<!–<iron-collapse id="collapse">–>--> | |
| 610 | - <!--<!–<paper-menu>–>--> | |
| 611 | - <!--<!–<template id="resultList" is="dom-repeat" items="{{choices}}" filter="_listFilter">–>--> | |
| 612 | - <!--<!–<paper-item>–>--> | |
| 613 | - <!--<!–<!–<paper-button on-tap="_selectItem">{{item.name}}</paper-button>–>–>--> | |
| 614 | - <!--<!–<paper-item on-tap="_selectItem">{{item.name}}</paper-item>–>--> | |
| 615 | - <!--<!–</paper-item>–>--> | |
| 616 | - <!--<!–</template>–>--> | |
| 617 | - <!--<!–</paper-menu>–>--> | |
| 618 | - <!--<!–</iron-collapse>–>--> | |
| 619 | - | |
| 620 | - <!--</template>--> | |
| 621 | -<!--</dom-module>--> | |
| 622 | -<!--<script>--> | |
| 623 | - <!--(function() {--> | |
| 624 | - <!--Polymer({--> | |
| 625 | - <!--is: "paper-autocomplete",--> | |
| 626 | - <!--properties: {--> | |
| 627 | -<!--// choices: Array,--> | |
| 628 | - <!--label: String,--> | |
| 629 | - <!--value: {--> | |
| 630 | - <!--type: Object,--> | |
| 631 | - <!--},--> | |
| 632 | - | |
| 633 | - <!--choices: {--> | |
| 634 | - <!--type: Array,--> | |
| 635 | - <!--value: undefined--> | |
| 636 | - <!--},--> | |
| 637 | - | |
| 638 | - <!--searchValue: {--> | |
| 639 | - <!--type: String,--> | |
| 640 | - <!--value: '',--> | |
| 641 | - <!--observer: "_valueChanged"--> | |
| 642 | - <!--}--> | |
| 643 | - <!--},--> | |
| 644 | - <!--ready: function() {--> | |
| 645 | - <!--this.$.resultList.render();--> | |
| 646 | - <!--},--> | |
| 647 | - | |
| 648 | - <!--attached: function() {--> | |
| 649 | - <!--this.$.resultList.render();--> | |
| 650 | - <!--console.log(this.choices);--> | |
| 651 | - <!--},--> | |
| 652 | - | |
| 653 | - <!--_valueChanged: function(e) {console.log("we");--> | |
| 654 | - <!--var collapse = this.$.collapse--> | |
| 655 | - <!--if (e != '' && !collapse.opened) {--> | |
| 656 | - <!--this.$.resultList.render()--> | |
| 657 | - <!--collapse.toggle()--> | |
| 658 | - <!--} else--> | |
| 659 | - <!--if (e == '' && collapse.opened) {--> | |
| 660 | - <!--collapse.toggle()--> | |
| 661 | - <!--}--> | |
| 662 | - <!--},--> | |
| 663 | - <!--_listFilter: function(item) {--> | |
| 664 | - <!--return item.name.toLowerCase().includes(--> | |
| 665 | - <!--this.searchValue.toLowerCase()--> | |
| 666 | - <!--)--> | |
| 667 | - <!--},--> | |
| 668 | - <!--_selectItem: function(event) {--> | |
| 669 | - <!--this.set('searchValue', event.model.item.name)--> | |
| 670 | - <!--this.set('value', event.model.item)--> | |
| 671 | - <!--collapse.toggle()--> | |
| 672 | - <!--}--> | |
| 673 | - <!--})--> | |
| 674 | - <!--})()--> | |
| 675 | -<!--</script>--> | |
| 676 | - | |
| 444 | +</script> | |
| 677 | 445 | \ No newline at end of file | ... | ... |