From 4bf5f658fc794f4a390435721c5e138e88c1d071 Mon Sep 17 00:00:00 2001
From: root <root@isislab01.isis.lab>
Date: Fri, 20 Nov 2015 11:23:22 +0100
Subject: [PATCH] update tree map, tree view ckan-spec

---
 controllets/data-sevc-controllet/data-sevc-controllet.html                         |  18 +++++++++---------
 controllets/data-sevc-controllet/demo/index.html                                   |   2 +-
 controllets/dataset-selection-controllet/dataset-selection-controllet.html         |  10 ++++++++--
 controllets/dataset-selection-controllet/paper-input-search.html                   | 637 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 controllets/tree-view-multi-table-controllet/demo/index.html                       |   2 +-
 controllets/tree-view-multi-table-controllet/tree-view-multi-table-controllet.html |  19 +++++++++++++++++--
 6 files changed, 673 insertions(+), 15 deletions(-)
 create mode 100755 controllets/dataset-selection-controllet/paper-input-search.html

diff --git a/controllets/data-sevc-controllet/data-sevc-controllet.html b/controllets/data-sevc-controllet/data-sevc-controllet.html
index bba43b4..6b30d62 100755
--- a/controllets/data-sevc-controllet/data-sevc-controllet.html
+++ b/controllets/data-sevc-controllet/data-sevc-controllet.html
@@ -339,7 +339,7 @@ Example:
                         <paper-material elevation="2" class="area_container">
                             <paper-tabs selected="{{DatasourceTabSelected}}">
                                 <paper-tab>Select data source</paper-tab>
-                                <paper-tab>Tree Map Search</paper-tab>
+                                <paper-tab>Tree Map view</paper-tab>
                                 <paper-tab>Most popular</paper-tab>
                             </paper-tabs>
                             <iron-pages selected="{{DatasourceTabSelected}}">
@@ -1096,14 +1096,14 @@ Example:
             //tree map
             _selectDataUrl_treeMap : function(e){
                 var url = e.detail.url;
-                url = url.split('/');
-                var index = url.indexOf('resource')
-                if (index != -1) { // ckan
-                    var resourceId = url[index + 1];
-                    url = "http://ckan.routetopa.eu/api/action/datastore_search?resource_id=" + resourceId;
-
-                } else
-                    url = "sorry, data provider not supported yet";
+//                url = url.split('/');
+//                var index = url.indexOf('resource')
+//                if (index != -1) { // ckan
+//                    var resourceId = url[index + 1];
+//                    url = "http://ckan.routetopa.eu/api/action/datastore_search?resource_id=" + resourceId;
+//
+//                } else
+//                    url = "sorry, data provider not supported yet";
 
                 this.dataUrl = url;
                 this.DatasourceTabSelected=0;
diff --git a/controllets/data-sevc-controllet/demo/index.html b/controllets/data-sevc-controllet/demo/index.html
index 0ca6e75..38b5160 100755
--- a/controllets/data-sevc-controllet/demo/index.html
+++ b/controllets/data-sevc-controllet/demo/index.html
@@ -9,7 +9,7 @@
     <script src="../../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script>
     <link rel="stylesheet" href="../../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css">
 
-    <link rel="import" href="../data-sevc-controllet_ddr.html" />
+    <link rel="import" href="../data-sevc-controllet.html" />
 </head>
 
 <body>
diff --git a/controllets/dataset-selection-controllet/dataset-selection-controllet.html b/controllets/dataset-selection-controllet/dataset-selection-controllet.html
index f46774b..d014364 100755
--- a/controllets/dataset-selection-controllet/dataset-selection-controllet.html
+++ b/controllets/dataset-selection-controllet/dataset-selection-controllet.html
@@ -26,6 +26,8 @@
 
 <!--<script src="../../datalets/shared_js/d3.js"></script>-->
 
+<link rel="import" href="paper-input-search.html">
+
 <dom-module id="dataset-selection-controllet">
 
     <template>
@@ -65,6 +67,10 @@
                 color: #FFFFFF;
             }
 
+            paper-menu{
+                /*visibility: visible ! important;*/
+            }
+
             /*paper-item[focused] {*/
                 /*background: #FFFFFF;*/
             /*}*/
@@ -123,13 +129,13 @@
                 <neon-animatable>
 
                     <div id="div_selection">
-                        <paper-dropdown-menu label="Available datasets">
+                        <paper-input-search label="Available datasets">
                             <paper-menu class="dropdown-content">
                                 <template is="dom-repeat" items={{datasets}} as="dataset">
                                     <paper-item id={{index}} on-tap="_selectDataUrl">{{dataset.name}}</paper-item>
                                 </template>
                             </paper-menu>
-                        </paper-dropdown-menu>
+                        </paper-input-search>
 
                         <paper-icon-button id="info_button" disabled on-click="_showInfo" icon="info-outline" title="dataset info"></paper-icon-button>
 
diff --git a/controllets/dataset-selection-controllet/paper-input-search.html b/controllets/dataset-selection-controllet/paper-input-search.html
new file mode 100755
index 0000000..744cdbe
--- /dev/null
+++ b/controllets/dataset-selection-controllet/paper-input-search.html
@@ -0,0 +1,637 @@
+<!--
+@license
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<link rel="import" href="../../bower_components/polymer/polymer.html">
+<link rel="import" href="../../bower_components/paper-styles/default-theme.html">
+<link rel="import" href="../../bower_components/paper-input/paper-input.html">
+<link rel="import" href="../../bower_components/paper-menu-button/paper-menu-button.html">
+<link rel="import" href="../../bower_components/paper-ripple/paper-ripple.html">
+<link rel="import" href="../../bower_components/iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
+<link rel="import" href="../../bower_components/iron-behaviors/iron-control-state.html">
+<link rel="import" href="../../bower_components/iron-behaviors/iron-button-state.html">
+<link rel="import" href="../../bower_components/iron-icons/iron-icons.html">
+<link rel="import" href="../../bower_components/iron-icon/iron-icon.html">
+<link rel="import" href="../../bower_components/iron-selector/iron-selectable.html">
+<link rel="import" href="../../bower_components/iron-form-element-behavior/iron-form-element-behavior.html">
+<link rel="import" href="../../bower_components/iron-validatable-behavior/iron-validatable-behavior.html">
+
+<!--
+Material design: [Dropdown menus](https://www.google.com/design/spec/components/buttons.html#buttons-dropdown-buttons)
+
+`paper-dropdown-menu` is similar to a native browser select element.
+`paper-dropdown-menu` works with selectable content. The currently selected
+item is displayed in the control. If no item is selected, the `label` is
+displayed instead.
+
+The child element with the class `dropdown-content` will be used as the dropdown
+menu. It could be a `paper-menu` or element that triggers `iron-select` when
+selecting its children.
+
+Example:
+
+    <paper-dropdown-menu label="Your favourite pastry">
+      <paper-menu class="dropdown-content">
+        <paper-item>Croissant</paper-item>
+        <paper-item>Donut</paper-item>
+        <paper-item>Financier</paper-item>
+        <paper-item>Madeleine</paper-item>
+      </paper-menu>
+    </paper-dropdown-menu>
+
+This example renders a dropdown menu with 4 options.
+
+Similarly to using `iron-select`, `iron-deselect` events will cause the
+current selection of the `paper-dropdown-menu` to be cleared.
+
+### Styling
+
+The following custom properties and mixins are also available for styling:
+
+Custom property | Description | Default
+----------------|-------------|----------
+`--paper-dropdown-menu` | A mixin that is applied to the element host | `{}`
+`--paper-dropdown-menu-disabled` | A mixin that is applied to the element host when disabled | `{}`
+`--paper-dropdown-menu-ripple` | A mixin that is applied to the internal ripple | `{}`
+`--paper-dropdown-menu-button` | A mixin that is applied to the internal menu button | `{}`
+`--paper-dropdown-menu-input` | A mixin that is applied to the internal paper input | `{}`
+`--paper-dropdown-menu-icon` | A mixin that is applied to the internal icon | `{}`
+
+You can also use any of the `paper-input-container` and `paper-menu-button`
+style mixins and custom properties to style the internal input and menu button
+respectively.
+
+@group Paper Elements
+@element paper-dropdown-menu
+@hero hero.svg
+@demo demo/index.html
+-->
+
+<dom-module id="paper-input-search">
+    <style>
+        :host {
+            display: inline-block;
+            position: relative;
+            text-align: left;
+            /*cursor: pointer;*/
+
+            /* NOTE(cdata): Both values are needed, since some phones require the
+             * value to be `transparent`.
+             */
+            -webkit-tap-highlight-color: rgba(0,0,0,0);
+            -webkit-tap-highlight-color: transparent;
+
+        --paper-input-container-input: {
+             overflow: hidden;
+             white-space: nowrap;
+             text-overflow: ellipsis;
+             max-width: 100%;
+             box-sizing: border-box;
+             /*cursor: pointer;*/
+         };
+
+        @apply(--paper-dropdown-menu);
+        }
+
+        :host([disabled]) {
+        @apply(--paper-dropdown-menu-disabled);
+        }
+
+        :host([noink]) paper-ripple {
+            display: none;
+        }
+
+        :host([no-label-float]) paper-ripple {
+            top: 8px;
+        }
+
+        paper-ripple {
+            top: 12px;
+            left: 0px;
+            bottom: 8px;
+            right: 0px;
+
+        @apply(--paper-dropdown-menu-ripple);
+        }
+
+        paper-menu-button {
+            display: block;
+            padding: 0;
+        @apply(--paper-dropdown-menu-button);
+        }
+
+        paper-input {
+        @apply(--paper-dropdown-menu-input);
+        }
+
+        iron-icon {
+            color: var(--disabled-text-color);
+
+        @apply(--paper-dropdown-menu-icon);
+        }
+
+    </style>
+    <template>
+        <paper-menu-button
+                id="menuButton"
+                vertical-align="top"
+                horizontal-align="right"
+                vertical-offset="[[_computeMenuVerticalOffset(noLabelFloat)]]"
+                disabled="[[disabled]]"
+                no-animations="[[noAnimations]]"
+                on-iron-select="_onIronSelect"
+                on-iron-deselect="_onIronDeselect"
+                opened="{{opened}}">
+            <div class="dropdown-trigger">
+                <paper-ripple></paper-ripple>
+                <paper-input
+                        invalid="[[invalid]]"
+                        value="[[selectedItemLabel]]"
+                        placeholder="[[placeholder]]"
+                        always-float-label="[[alwaysFloatLabel]]"
+                        no-label-float="[[noLabelFloat]]"
+                        label="[[label]]">
+                    <iron-icon icon="arrow-drop-down" suffix></iron-icon>
+                </paper-input>
+            </div>
+            <content id="content" select=".dropdown-content"></content>
+        </paper-menu-button>
+    </template>
+</dom-module>
+<script>
+    (function() {
+        'use strict';
+
+        Polymer({
+            is: 'paper-input-search',
+
+            /**
+             * Fired when the dropdown opens.
+             *
+             * @event paper-dropdown-open
+             */
+
+            /**
+             * Fired when the dropdown closes.
+             *
+             * @event paper-dropdown-close
+             */
+
+            behaviors: [
+                Polymer.IronControlState,
+                Polymer.IronButtonState,
+                Polymer.IronFormElementBehavior,
+                Polymer.IronValidatableBehavior
+            ],
+
+            properties: {
+                /**
+                 * The derived "label" of the currently selected item. This value
+                 * is the `label` property on the selected item if set, or else the
+                 * trimmed text content of the selected item.
+                 */
+                selectedItemLabel: {
+                    type: String,
+                    notify: true,
+                    readOnly: true,
+                },
+
+                /**
+                 * The last selected item. An item is selected if the dropdown menu has
+                 * a child with class `dropdown-content`, and that child triggers an
+                 * `iron-select` event with the selected `item` in the `detail`.
+                 *
+                 * @type {?Object}
+                 */
+                selectedItem: {
+                    type: Object,
+                    notify: true,
+                    readOnly: true
+                },
+
+                /**
+                 * The value for this element that will be used when submitting in
+                 * a form. It is read only, and will always have the same value
+                 * as `selectedItemLabel`.
+                 */
+                value: {
+                    type: String,
+                    notify: true,
+                    readOnly: true
+                },
+
+                /**
+                 * The label for the dropdown.
+                 */
+                label: {
+                    type: String
+                },
+
+                /**
+                 * The placeholder for the dropdown.
+                 */
+                placeholder: {
+                    type: String
+                },
+
+                /**
+                 * True if the dropdown is open. Otherwise, false.
+                 */
+                opened: {
+                    type: Boolean,
+                    notify: true,
+                    value: false
+                },
+
+                /**
+                 * Set to true to disable the floating label. Bind this to the
+                 * `<paper-input-container>`'s `noLabelFloat` property.
+                 */
+                noLabelFloat: {
+                    type: Boolean,
+                    value: false,
+                    reflectToAttribute: true
+                },
+
+                /**
+                 * Set to true to always float the label. Bind this to the
+                 * `<paper-input-container>`'s `alwaysFloatLabel` property.
+                 */
+                alwaysFloatLabel: {
+                    type: Boolean,
+                    value: false
+                },
+
+                /**
+                 * Set to true to disable animations when opening and closing the
+                 * dropdown.
+                 */
+                noAnimations: {
+                    type: Boolean,
+                    value: false
+                }
+            },
+
+            listeners: {
+                'tap': '_onTap'
+            },
+
+            keyBindings: {
+                'up down': 'open',
+                'esc': 'close'
+            },
+
+            hostAttributes: {
+                role: 'group',
+                'aria-haspopup': 'true'
+            },
+
+            observers: [
+                '_selectedItemChanged(selectedItem)'
+            ],
+
+            attached: function() {
+                // NOTE(cdata): Due to timing, a preselected value in a `IronSelectable`
+                // child will cause an `iron-select` event to fire while the element is
+                // still in a `DocumentFragment`. This has the effect of causing
+                // handlers not to fire. So, we double check this value on attached:
+                var contentElement = this.contentElement;
+                if (contentElement && contentElement.selectedItem) {
+                    this._setSelectedItem(contentElement.selectedItem);
+                }
+            },
+
+            /**
+             * The content element that is contained by the dropdown menu, if any.
+             */
+            get contentElement() {
+                return Polymer.dom(this.$.content).getDistributedNodes()[0];
+            },
+
+            /**
+             * Show the dropdown content.
+             */
+            open: function() {
+                this.$.menuButton.open();
+            },
+
+            /**
+             * Hide the dropdown content.
+             */
+            close: function() {
+                this.$.menuButton.close();
+            },
+
+            /**
+             * A handler that is called when `iron-select` is fired.
+             *
+             * @param {CustomEvent} event An `iron-select` event.
+             */
+            _onIronSelect: function(event) {
+                this._setSelectedItem(event.detail.item);
+            },
+
+            /**
+             * A handler that is called when `iron-deselect` is fired.
+             *
+             * @param {CustomEvent} event An `iron-deselect` event.
+             */
+            _onIronDeselect: function(event) {
+                this._setSelectedItem(null);
+            },
+
+            /**
+             * A handler that is called when the dropdown is tapped.
+             *
+             * @param {CustomEvent} event A tap event.
+             */
+            _onTap: function(event) {
+                if (Polymer.Gestures.findOriginalTarget(event) === this) {
+                    this.open();
+                }
+            },
+
+            /**
+             * Compute the label for the dropdown given a selected item.
+             *
+             * @param {Element} selectedItem A selected Element item, with an
+             * optional `label` property.
+             */
+            _selectedItemChanged: function(selectedItem) {
+                var value = '';
+                if (!selectedItem) {
+                    value = '';
+                } else {
+                    value = selectedItem.label || selectedItem.textContent.trim();
+                }
+
+                this._setValue(value);
+                this._setSelectedItemLabel(value);
+            },
+
+            /**
+             * Compute the vertical offset of the menu based on the value of
+             * `noLabelFloat`.
+             *
+             * @param {boolean} noLabelFloat True if the label should not float
+             * above the input, otherwise false.
+             */
+            _computeMenuVerticalOffset: function(noLabelFloat) {
+                // NOTE(cdata): These numbers are somewhat magical because they are
+                // derived from the metrics of elements internal to `paper-input`'s
+                // template. The metrics will change depending on whether or not the
+                // input has a floating label.
+//                return noLabelFloat ? -4 : 8;
+                return 64;
+            },
+
+            /**
+             * Returns false if the element is required and does not have a selection,
+             * and true otherwise.
+             * @return {Boolean} true if `required` is false, or if `required` is true
+             * and the element has a valid selection.
+             */
+            _getValidity: function() {
+                return this.disabled || !this.required || (this.required && this.value);
+            }
+        });
+    })();
+</script>
+
+
+
+
+<!--<link rel="import" href="../../bower_components/polymer/polymer.html">-->
+
+<!--<link rel="import" href="../../bower_components/paper-tabs/paper-tabs.html">-->
+<!--<link rel="import" href="../../bower_components/paper-tabs/paper-tab.html">-->
+
+<!--<link rel="import" href="../../bower_components/neon-animation/neon-animation.html">-->
+<!--<link rel="import" href="../../bower_components/neon-animation/neon-animatable.html">-->
+<!--<link rel="import" href="../../bower_components/neon-animation/neon-animations.html">-->
+
+<!--<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">-->
+<!--<link rel="import" href="../../bower_components/paper-menu/paper-menu.html">-->
+<!--<link rel="import" href="../../bower_components/paper-item/paper-item.html">-->
+
+<!--<link rel="import" href="../../bower_components/paper-input/paper-textarea.html">-->
+
+<!--<link rel="import" href="../../bower_components/paper-material/paper-material.html" />-->
+
+<!--<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">-->
+<!--<link rel="import" href="../../bower_components/iron-icons/iron-icons.html">-->
+<!--<link rel="import" href="../../bower_components/iron-icon/iron-icon.html">-->
+
+<!--<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html">-->
+<!--<link rel="import" href="../../bower_components/paper-dialog-scrollable/paper-dialog-scrollable.html">-->
+
+<!--<link rel="import" href="../../datalets/datasetexplorer-datalet/datasetexplorer-datalet.html">-->
+
+<!--&lt;!&ndash;<script src="../../datalets/shared_js/d3.js"></script>&ndash;&gt;-->
+
+<!--<link rel="import" href="../../bower_components/paper-input/paper-input.html">-->
+<!--<link rel="import" href="demo/paper-autocomplete.html">-->
+
+<!--<dom-module id="paper-input-search">-->
+
+    <!--<template>-->
+
+        <!--&lt;!&ndash;<paper-dropdown-menu label="Available datasets">&ndash;&gt;-->
+            <!--&lt;!&ndash;<paper-menu class="dropdown-content">&ndash;&gt;-->
+                <!--&lt;!&ndash;<template is="dom-repeat" items={{datasets}} as="dataset">&ndash;&gt;-->
+                    <!--&lt;!&ndash;<paper-item id={{index}} on-tap="_selectDataUrl">{{dataset.name}}</paper-item>&ndash;&gt;-->
+                <!--&lt;!&ndash;</template>&ndash;&gt;-->
+            <!--&lt;!&ndash;</paper-menu>&ndash;&gt;-->
+        <!--&lt;!&ndash;</paper-dropdown-menu>&ndash;&gt;-->
+
+        <!--&lt;!&ndash;<paper-icon-button id="info_button" disabled on-click="_showInfo" icon="info-outline" title="dataset info"></paper-icon-button>&ndash;&gt;-->
+
+        <!--&lt;!&ndash;<paper-textarea id="selected_url" label="Selected url" value={{dataUrl}}></paper-textarea>&ndash;&gt;-->
+
+        <!--&lt;!&ndash;<paper-dialog id="dialog_info">&ndash;&gt;-->
+            <!--&lt;!&ndash;<h2 id="dialog_name"></h2>&ndash;&gt;-->
+            <!--&lt;!&ndash;<p id="dialog_description"></p>&ndash;&gt;-->
+        <!--&lt;!&ndash;</paper-dialog>&ndash;&gt;-->
+
+        <!--<style is="custom-style">-->
+            <!--paper-input {-->
+                <!--width: 200px;-->
+            <!--}-->
+        <!--</style>-->
+
+        <!--<paper-input list="filtered_datasets" bind-value="{{filter::input}}"></paper-input>&lt;!&ndash; is="iron-input" type="search"&ndash;&gt;-->
+
+        <!--<datalist id="filtered_datasets">-->
+            <!--<template is="dom-repeat" items={{_filteredDatasets}}>-->
+                <!--<option value={{item.name}}></option>-->
+            <!--</template>-->
+        <!--</datalist>-->
+
+    <!--</template>-->
+
+    <!--<script>-->
+
+        <!--Polymer({-->
+
+            <!--is : 'paper-input-search',-->
+
+            <!--properties : {-->
+
+                <!--datasets : {-->
+                    <!--type : Array,-->
+                    <!--value : undefined,-->
+<!--//                    observer : '_ciao'-->
+                <!--},-->
+
+                <!--_filteredDatasets : {-->
+                    <!--type  : Array,-->
+                    <!--value: undefined-->
+                <!--},-->
+
+                <!--filter: {-->
+                    <!--type: String,-->
+                    <!--value: "",-->
+                    <!--observer: "_filterChanged"-->
+                <!--}-->
+            <!--},-->
+
+            <!--attached : function(){-->
+                <!--this._filteredDatasets = this.datasets;-->
+                <!--console.log(this._filteredDatasets);-->
+            <!--},-->
+
+            <!--_filterChanged : function(){-->
+<!--//                this.filteredDatalist = this.datalist;-->
+                <!--console.log(this.filter);-->
+            <!--},-->
+
+        <!--});-->
+
+    <!--</script>-->
+
+<!--</dom-module>-->
+
+
+<!--paper-autocomplete!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!-->
+<!--//http://stackoverflow.com/questions/31030583/polymer-paper-input-html-datalist-autocomplete-suggestions-list-->
+
+<!--<link rel="import" href="../../../bower_components/paper-input/paper-input.html">-->
+<!--<link rel="import" href="../../../bower_components/paper-input/paper-input-container.html">-->
+<!--<link rel="import" href="../../../bower_components/iron-collapse/iron-collapse.html">-->
+<!--<link rel="import" href="../../../bower_components/paper-material/paper-material.html">-->
+<!--<link rel="import" href="../../../bower_components/paper-button/paper-button.html">-->
+
+<!--&lt;!&ndash;<link rel="import" href="../../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">&ndash;&gt;-->
+<!--&lt;!&ndash;<link rel="import" href="../../../bower_components/paper-menu/paper-menu.html">&ndash;&gt;-->
+<!--&lt;!&ndash;<link rel="import" href="../../../bower_components/paper-item/paper-item.html">&ndash;&gt;-->
+
+
+<!--<dom-module id="paper-autocomplete">-->
+    <!--<style>-->
+        <!--iron-collapse {-->
+            <!--box-shadow: 6px;-->
+        <!--}-->
+
+        <!--paper-button {-->
+            <!--width: 100%;-->
+            <!--text-transform: none;-->
+        <!--}-->
+
+        <!--paper-input-container {-->
+            <!--width: 200px;-->
+        <!--}-->
+    <!--</style>-->
+    <!--<template>-->
+        <!--<paper-input-container>-->
+            <!--<label>{{label}}</label>-->
+            <!--<content select=".content"></content>-->
+            <!--<input id="searchBox" class="paper-input-input" is="iron-input" bind-value="{{searchValue::input}}"></input>-->
+        <!--</paper-input-container>-->
+
+        <!--<iron-collapse id="collapse">-->
+
+            <!--<paper-material>-->
+                <!--<div>-->
+                    <!--<template id="resultList" is="dom-repeat" items="{{choices}}" filter="_listFilter">-->
+                        <!--<paper-item>-->
+                            <!--<paper-button on-tap="_selectItem">{{item.name}}</paper-button>-->
+                        <!--</paper-item>-->
+                    <!--</template>-->
+                <!--</div>-->
+            <!--</paper-material>-->
+        <!--</iron-collapse>-->
+
+        <!--&lt;!&ndash;<iron-collapse id="collapse">&ndash;&gt;-->
+        <!--&lt;!&ndash;<paper-menu>&ndash;&gt;-->
+        <!--&lt;!&ndash;<template id="resultList" is="dom-repeat" items="{{choices}}" filter="_listFilter">&ndash;&gt;-->
+        <!--&lt;!&ndash;<paper-item>&ndash;&gt;-->
+        <!--&lt;!&ndash;&lt;!&ndash;<paper-button on-tap="_selectItem">{{item.name}}</paper-button>&ndash;&gt;&ndash;&gt;-->
+        <!--&lt;!&ndash;<paper-item on-tap="_selectItem">{{item.name}}</paper-item>&ndash;&gt;-->
+        <!--&lt;!&ndash;</paper-item>&ndash;&gt;-->
+        <!--&lt;!&ndash;</template>&ndash;&gt;-->
+        <!--&lt;!&ndash;</paper-menu>&ndash;&gt;-->
+        <!--&lt;!&ndash;</iron-collapse>&ndash;&gt;-->
+
+    <!--</template>-->
+<!--</dom-module>-->
+<!--<script>-->
+    <!--(function() {-->
+        <!--Polymer({-->
+            <!--is: "paper-autocomplete",-->
+            <!--properties: {-->
+<!--//                choices: Array,-->
+                <!--label: String,-->
+                <!--value: {-->
+                    <!--type: Object,-->
+                <!--},-->
+
+                <!--choices: {-->
+                    <!--type: Array,-->
+                    <!--value: undefined-->
+                <!--},-->
+
+                <!--searchValue: {-->
+                    <!--type: String,-->
+                    <!--value: '',-->
+                    <!--observer: "_valueChanged"-->
+                <!--}-->
+            <!--},-->
+            <!--ready: function() {-->
+                <!--this.$.resultList.render();-->
+            <!--},-->
+
+            <!--attached: function() {-->
+                <!--this.$.resultList.render();-->
+                <!--console.log(this.choices);-->
+            <!--},-->
+
+            <!--_valueChanged: function(e) {console.log("we");-->
+                <!--var collapse = this.$.collapse-->
+                <!--if (e != '' && !collapse.opened) {-->
+                    <!--this.$.resultList.render()-->
+                    <!--collapse.toggle()-->
+                <!--} else-->
+                <!--if (e == '' && collapse.opened) {-->
+                    <!--collapse.toggle()-->
+                <!--}-->
+            <!--},-->
+            <!--_listFilter: function(item) {-->
+                <!--return item.name.toLowerCase().includes(-->
+                        <!--this.searchValue.toLowerCase()-->
+                <!--)-->
+            <!--},-->
+            <!--_selectItem: function(event) {-->
+                <!--this.set('searchValue', event.model.item.name)-->
+                <!--this.set('value', event.model.item)-->
+                <!--collapse.toggle()-->
+            <!--}-->
+        <!--})-->
+    <!--})()-->
+<!--</script>-->
+
diff --git a/controllets/tree-view-multi-table-controllet/demo/index.html b/controllets/tree-view-multi-table-controllet/demo/index.html
index 3710eef..fad3cd8 100755
--- a/controllets/tree-view-multi-table-controllet/demo/index.html
+++ b/controllets/tree-view-multi-table-controllet/demo/index.html
@@ -14,7 +14,7 @@
 <body>
 
     <tree-view-multi-table-controllet id="tvmt" root-name="data" opened-path="records,geometry" preselected-fields='["nhits", "records,datasetid", "records,recordid"]' data-url="https://data.issy.com/api/records/1.0/search?dataset=liste-des-restaurants-a-issy-les-moulineaux&sort=type&facet=type&facet=terrasse"></tree-view-multi-table-controllet>
-    <!--<tree-view-multi-table-controllet root-name="Data" opened-path="records,geometry" data-url="https://data.issy.com/api/records/1.0/search?dataset=liste-des-restaurants-a-issy-les-moulineaux&sort=type&facet=type&facet=terrasse"></tree-view-multi-table-controllet>-->
+    <!--<tree-view-multi-table-controllet id="tvmt" root-name="data" data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=73e02092-85a1-434e-85fe-0c9a43aa9a52&limit=5"></tree-view-multi-table-controllet>-->
 
     <script>
         var tvmt = document.getElementById('tvmt');
diff --git a/controllets/tree-view-multi-table-controllet/tree-view-multi-table-controllet.html b/controllets/tree-view-multi-table-controllet/tree-view-multi-table-controllet.html
index 9069a58..4bad4c9 100755
--- a/controllets/tree-view-multi-table-controllet/tree-view-multi-table-controllet.html
+++ b/controllets/tree-view-multi-table-controllet/tree-view-multi-table-controllet.html
@@ -98,18 +98,33 @@
 
             _init : function() {
                 var tree = document.getElementById('tree_view');
-                var t = this;
+                var that = this;
 
                 $.ajax({
                     url: this.dataUrl,
                     dataType: "json",
                     success: function(data){
+                        data = that._filterJson(data);
                         tree.setAttribute("json-data", JSON.stringify(data));
                         tree.selectedFields = [];
-                        t._updateSelectedFields();
+                        that._updateSelectedFields();
                         tree.ready();
                     }
                 });
+
+
+            },
+
+            _filterJson : function(data){
+                console.log(data);
+                console.log(this.dataUrl);
+//                if(this.dataUrl.indexOf("ckan") != -1)
+                if(data.result != undefined && data.result.resource_id != undefined) {
+                    this.rootName = "ckan"
+                    this.openedPath = "result,records";
+                    return {result: {records: data.result.records}};
+                }
+                return data;
             },
 
             _updateSelectedFields : function() {
--
libgit2 0.21.4