update filters

Renato De Donato
1 parent 7a8b7446
Showing 5 changed files with 11 additions and 193 deletions
controllets/datalet-selection-controllet/datalet-selection-controllet.html
controllets/filters-controllet/filters-controllet.html
controllets/select-data-controllet/demo/index.html
controllets/tree-view-multi-table-controllet/demo/index.html
controllets/tree-view-multi-table-controllet/tree-view-multi-table-controllet.html
@@ -219,7 +219,7 @@
  
                 <!-- EXPERT MODE EXPERT MODE EXPERT MODE EXPERT MODE EXPERT MODE EXPERT MODE EXPERT MODE EXPERT MODE -->
  
-                <div id="expert_header" on-click="_showExpertMode"><span id="expert">ADVANCED: GROUP BY</span></div>
+                <div id="expert_header" on-click="_showExpertMode"><span id="expert">GROUP BY</span></div>
  
                 <div id="expert_container">
  
@@ -106,7 +106,7 @@
  
         <div id="filters_container">
  
-            <div id="filters_header" class="filters_header" on-click="_showFiltersPanel"><span id="filters">ADVANCED: FILTERS</span></div>
+            <div id="filters_header" class="filters_header" on-click="_showFiltersPanel"><span id="filters">ADD FILTERS</span></div>
  
             <div id="filters_panel">
  
@@ -114,7 +114,7 @@
                     <tr>
                         <th>
                             <paper-dropdown-menu id="filter_field" label="Field">
-                                <paper-menu class="dropdown-content">
+                                <paper-menu id="filter_field_menu" class="dropdown-content">
                                     <template is="dom-repeat" items={{fields}}>
                                         <paper-item id={{index}} on-tap="">{{_fieldName(item)}}</paper-item>
                                     </template>
@@ -123,7 +123,7 @@
                         </th>
                         <th>
                             <paper-dropdown-menu id="filter_operation" label="Operation">
-                                <paper-menu class="dropdown-content">
+                                <paper-menu id="filter_operation_menu" class="dropdown-content">
                                     <template is="dom-repeat" items={{operations}}>
                                         <paper-item id={{index}} on-tap="">{{item}}</paper-item>
                                     </template>
@@ -131,7 +131,7 @@
                             </paper-dropdown-menu>
                         </th>
                         <th>
-                            <paper-input id="filter_value" class="base_input"></paper-input>
+                            <paper-input id="filter_value" label="Value" class="base_input" maxlength="16" auto-validate pattern="^[_a-zA-Z0-9]*" error-message="Invalid value!"></paper-input>
                         </th>
                         <th class="filters_cell_button">
                             <paper-icon-button on-click="_addFilter" icon="add-circle" class="add"></paper-icon-button>
@@ -187,10 +187,6 @@
                 $(this.$.filters_panel).perfectScrollbar();
             },
  
-            attached : function() {
-//                this.fire('filters-controllet_filters', {filters: this.filters});
-            },
-
             setFields : function(fields) {
                 this.fields = this._copy(fields);
             },
@@ -219,7 +215,6 @@
             },
  
             _addFilter : function() {
-//                var field = "["+this.$.filter_field.value+"]";
                 var field = this.$.filter_field.value;
                 var operation = this.$.filter_operation.value;
                 var value = this.$.filter_value.value;
@@ -228,6 +223,10 @@
                 filters.push({"field": field, "operation": operation, "value": value});
                 this.filters = this._copy(filters);
  
+                this.$.filter_field_menu.select(-1);
+                this.$.filter_operation_menu.select(-1);
+                this.$.filter_value.value = "";
+
                 this.fire('filters-controllet_filters', {filters: this.filters});
             },
  
@@ -13,8 +13,8 @@
  
 <body>
  
-    <select-data-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"></select-data-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>-->
+    <!--<select-data-controllet id="tvmt" root-name="data" opened-path="records,geometry" preselected-fields='["nhits", "records,datasetid", "records,recordid"]' data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=73e02092-85a1-434e-85fe-0c9a43aa9a52&limit=5"></select-data-controllet>-->
+    <select-data-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"></select-data-controllet>
  
     <script>
         var tvmt = document.getElementById('tvmt');
-<html>
-
-<head>
-    <script src="../../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
-
-    <script src="../../shared_js/jquery-1.11.2.min.js"></script>
-
-    <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="../../tree-view-multi-table-controllet/tree-view-multi-table-controllet.html" />
-</head>
-
-<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 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');
-
-        tvmt.addEventListener("tree-view-controllet_selected-fields", function (e) {
-            console.log(tvmt.getFlatFields());
-            console.log(tvmt.getFields());
-        });
-
-    </script>
-
-</body>
-
-</html>
-
-<!--urls:-->
-<!--http://dati.lazio.it/catalog/api/action/datastore_search?resource_id=114baf3d-6d4f-42ff-b4af-481beef59ae1-->
-<!--url: 'http://ckan.routetopa.eu/api/action/datastore_search?resource_id=73e02092-85a1-434e-85fe-0c9a43aa9a52&limit=5',-->
-<!--url: 'https://data.issy.com/api/records/1.0/search?dataset=liste-des-restaurants-a-issy-les-moulineaux&sort=type&facet=type&facet=terrasse',-->
-<!--url: 'https://data.issy.com/api/records/1.0/search?dataset=flux-rss-des-offres-demplois-a-issy-les-moulineaux&sort=published&facet=published&refine.published=2015',-->
 \ No newline at end of file
-<link rel="import" href="../../bower_components/polymer/polymer.html" />
-
-<link rel="import" href="../../bower_components/paper-material/paper-material.html" />
-
-<link rel="import" href="../tree-view-controllet/tree-view-controllet.html" />
-<link rel="import" href="../multi-table-controllet/multi-table-controllet.html" />
-
-<dom-module id="tree-view-multi-table-controllet">
-
-    <style is="custom-style">
-        .div_container {
-            display: flex;
-            flex-direction: row;
-        }
-        #material_tree_view {
-            position: relative;
-            width: 25%;
-            min-width: 200px;
-            height: 100vh;
-        }
-        #material_multi_table {
-            position: relative;
-            width: 75%;
-
-            margin-left: 64px;
-            margin-top: 8px;
-        }
-    </style>
-
-    <template>
-
-        <div class="div_container">
-            <paper-material id="material_tree_view" elevation="5">
-                <tree-view-controllet id="tree_view" root-name={{rootName}} opened-path={{openedPath}} preselected-fields={{preselectedFields}}></tree-view-controllet>
-            </paper-material>
-            <paper-material id="material_multi_table" elevation="5">
-                <multi-table-controllet id="multi_table" data-url={{dataUrl}}></multi-table-controllet>
-            </paper-material>
-        </div>
-
-    </template>
-
-    <script>
-        Polymer({
-
-            is : 'tree-view-multi-table-controllet',
-
-            properties : {
-
-                rootName : {
-                    type  : String,
-                    value : "root"
-                },
-
-                preselectedFields : {
-                    type : Array,
-                    value : []
-                },
-
-                openedPath : {
-                    type : String,
-                    value : undefined
-                },
-
-                dataUrl : {
-                    type  : String,
-                    value : undefined,
-                    observer : '_init'
-                }
-
-            },
-
-            listeners: {
-                'tree-view-controllet_selected-fields': '_updateSelectedFields'
-            },
-
-            ready : function() {
-//                if(this.dataUrl)
-//                    this._init();
-
-                $(this.$.material_tree_view).perfectScrollbar();
-                $(this.$.material_multi_table).perfectScrollbar();
-            },
-
-            attached : function(){
-                this._resize();
-                var that = this;
-                window.addEventListener("resize", function() { that._resize(); });
-            },
-
-            getFields : function() {
-                return this.$.tree_view.getFields();
-            },
-
-            getFlatFields : function() {
-                return this.$.tree_view.getFlatFields();
-            },
-
-            _init : function() {
-                var tree = document.getElementById('tree_view');
-                var that = this;
-
-                $.ajax({
-                    url: this.dataUrl,
-                    dataType: "json",
-                    success: function(data){
-                        that.rootName = "data"
-                        data = that._filterJson(data);
-                        tree.setAttribute("json-data", JSON.stringify(data));
-                        tree.selectedFields = [];
-                        that._updateSelectedFields();
-                        tree.ready();
-                    }
-                });
-
-                this.$.multi_table.ready();
-            },
-
-            _filterJson : function(data){
-//                console.log(data);
-//                console.log(this.dataUrl);
-                if(data.result != undefined && data.result.resource_id != undefined) {
-                    this.rootName = "result,records"
-                    return data.result.records;
-                }
-                return data;
-            },
-
-            _updateSelectedFields : function() {
-                var fields = this.$.tree_view.getFields();
-                this.$.multi_table.setSelectedFields(fields);
-            },
-
-            _resize : function(){
-                var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0) - 16;
-                h = h - 64; //height with page scroller
-                $("#material_tree_view").height(h);
-            }
-
-        });
-
-    </script>
-
-</dom-module>
 \ No newline at end of file