<!--
@group ROUTETOPA Polymer Core Elements

The `select-visualization-form-controllet` is a slider container of elements.
Pass to this component an array of components, a data url(CKAN api uri) and a string with one or multiple query in JsonPath format(separated by spaces) and it'll show a
slider with all components initialized with data and query attributes

### Code

Example

@class select-visualization-form-controllet

-->
<link rel="import" href="../../bower_components/polymer/polymer.html">
<!--<link rel="import" href="../../bower_components/iron-ajax/iron-request.html">
<link rel="import" href="../../bower_components/iron-ajax/iron-ajax.html">-->

<dom-module id="datalet-selection-controllet">
    <template>
        <!--<link rel="stylesheet" href="../shared_js/bootstrap-3.3.4-dist/css/bootstrap.paper.style.min.css">
        <link rel="stylesheet" href="../shared_js/bootstrap-toggle-master/css/bootstrap-toggle.min.css">-->
        <style>
            body {
                font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
                font-size: 14px;
                margin: 0;
                padding: 24px;
                -webkit-tap-highlight-color: rgba(0,0,0,0);
                -webkit-touch-callout: none;
            }

            paper-input {
                width: 80%;
            }

            paper-checkbox {
                display: block;
                margin-bottom: 40px;
            }

        </style>

        <!--<iron-ajax
                auto
                id="data_request"
                url={{dataUrl}}
                handle-as="json"
                verbose="true"
                on-response="this.handleResponseData"
                debounce-duration="300">
        </iron-ajax>

        <iron-ajax
                auto
                url="http://service.routetopa.eu/WebComponentsDEV/DEEP/datalets-list"
                handle-as="json"
                on-response="handleResponseDatalets"
                debounce-duration="300">
        </iron-ajax>

        <iron-request id="xhr"></iron-request>-->
    </template>

    <script>

        DataletSelectionControllet = Polymer({
            is: 'datalet-selection-controllet',
            properties: {
                /**
                 * It represent the data url from CKAN api
                 *
                 * @attribute dataUrl
                 * @type string
                 * @default 'null'
                 */
                dataUrl: {
                    type: String,
                    value: "http://demo.ckan.org/api/action/datastore_search?resource_id=8324a4c9-66d6-47bf-a898-94237cc39b9f&limit=50",
                    observer: '_data_urlChanged'
                },
                /**
                 * It stores all tools available in WebComponent server
                 *
                 * @attribute tools
                 * @type array
                 * @default 'null'
                 */
                tools:{
                   type: Array,
                   value: []
                },
                /**
                 * It stores all fields related to data retrieved from CKAN api url
                 *
                 * @attribute fields
                 * @type array
                 * @default 'null'
                 */
                fields:{
                   type: Array,
                   value: []
                },
                fieldsMap: {
                    type: Map,
                    value: null
                }
            }
        });
    </script>
</dom-module>