diff --git a/css/data-explorer.css b/css/data-explorer.css index f0aa4dba..3023ebc1 100644 --- a/css/data-explorer.css +++ b/css/data-explorer.css @@ -60,8 +60,8 @@ clear: both; } -.recline-facet-viewer { - clear: both; +.recline-filter-editor .filter-term .input-append a { + margin-left: -5px; } .recline-facet-viewer .facet-summary label { diff --git a/demo b/demo deleted file mode 120000 index f83b1b63..00000000 --- a/demo +++ /dev/null @@ -1 +0,0 @@ -app/ \ No newline at end of file diff --git a/demo/index.html b/demo/index.html new file mode 100644 index 00000000..a5dec198 --- /dev/null +++ b/demo/index.html @@ -0,0 +1,8 @@ + diff --git a/src/model.js b/src/model.js index a9c5270d..67a9141c 100644 --- a/src/model.js +++ b/src/model.js @@ -217,6 +217,15 @@ my.Query = Backbone.Model.extend({ // change does not seem to be triggered ... this.trigger('change'); }, + // ### removeFilter + // + // Remove a filter from filters at index filterIndex + removeFilter: function(filterIndex) { + var filters = this.get('filters'); + filters.splice(filterIndex, 1); + this.set({filters: filters}); + this.trigger('change'); + }, // ### addFacet // // Add a Facet to this query diff --git a/src/util.js b/src/util.js index e207faa1..ab2acbef 100644 --- a/src/util.js +++ b/src/util.js @@ -1,3 +1,5 @@ +/*jshint multistr:true */ + var util = function() { var templates = { transformActions: '
  • Global transform...
  • ' diff --git a/src/view-flot-graph.js b/src/view-flot-graph.js index 3e308336..cb47f441 100644 --- a/src/view-flot-graph.js +++ b/src/view-flot-graph.js @@ -1,3 +1,5 @@ +/*jshint multistr:true */ + this.recline = this.recline || {}; this.recline.View = this.recline.View || {}; diff --git a/src/view-grid.js b/src/view-grid.js index 1f42546e..31a4ac20 100644 --- a/src/view-grid.js +++ b/src/view-grid.js @@ -1,3 +1,5 @@ +/*jshint multistr:true */ + this.recline = this.recline || {}; this.recline.View = this.recline.View || {}; diff --git a/src/view-map.js b/src/view-map.js index 81a09fc2..1d985a6e 100644 --- a/src/view-map.js +++ b/src/view-map.js @@ -1,3 +1,5 @@ +/*jshint multistr:true */ + this.recline = this.recline || {}; this.recline.View = this.recline.View || {}; diff --git a/src/view-transform-dialog.js b/src/view-transform-dialog.js index 7d80cd4f..191e6811 100644 --- a/src/view-transform-dialog.js +++ b/src/view-transform-dialog.js @@ -1,3 +1,5 @@ +/*jshint multistr:true */ + this.recline = this.recline || {}; this.recline.View = this.recline.View || {}; diff --git a/src/view.js b/src/view.js index 93dcbf6c..601b73ff 100644 --- a/src/view.js +++ b/src/view.js @@ -1,3 +1,4 @@ +/*jshint multistr:true */ this.recline = this.recline || {}; this.recline.View = this.recline.View || {}; @@ -65,6 +66,8 @@ my.DataExplorer = Backbone.View.extend({
    \ Results found {{docCount}} \
    \ +
    \ +
    \ \
    \ \ @@ -167,11 +170,15 @@ my.DataExplorer = Backbone.View.extend({ var queryEditor = new my.QueryEditor({ model: this.model.queryState }); - this.el.find('.header').append(queryEditor.el); - var queryFacetEditor = new my.FacetViewer({ + this.el.find('.query-editor-here').append(queryEditor.el); + var filterEditor = new my.FilterEditor({ + model: this.model.queryState + }); + this.el.find('.header').append(filterEditor.el); + var facetViewer = new my.FacetViewer({ model: this.model }); - this.el.find('.header').append(queryFacetEditor.el); + this.el.find('.header').append(facetViewer.el); }, setupRouting: function() { @@ -204,7 +211,6 @@ my.DataExplorer = Backbone.View.extend({ } }); - my.QueryEditor = Backbone.View.extend({ className: 'recline-query-editor', template: ' \ @@ -279,6 +285,80 @@ my.QueryEditor = Backbone.View.extend({ } }); +my.FilterEditor = Backbone.View.extend({ + className: 'recline-filter-editor well', + template: ' \ + × \ +
    \ +
    \ +

    Filters

    \ +
    \ +
    \ +
    \ + {{#termFilters}} \ +
    \ + \ +
    \ +
    \ + \ + \ +
    \ +
    \ +
    \ + {{/termFilters}} \ +
    \ +
    \ +
    \ + ', + events: { + 'click .js-hide': 'onHide', + 'click .js-remove-filter': 'onRemoveFilter' + }, + initialize: function() { + this.el = $(this.el); + _.bindAll(this, 'render'); + this.model.bind('change', this.render); + this.render(); + }, + render: function() { + var tmplData = this.model.toJSON(); + // we will use idx in list as there id ... + tmplData.filters = _.map(tmplData.filters, function(filter, idx) { + filter.id = idx; + return filter; + }); + tmplData.termFilters = _.filter(tmplData.filters, function(filter) { + return filter.term !== undefined; + }); + tmplData.termFilters = _.map(tmplData.termFilters, function(filter) { + var fieldId = _.keys(filter.term)[0]; + return { + fieldId: fieldId, + label: fieldId, + value: filter.term[fieldId] + } + }); + var out = $.mustache(this.template, tmplData); + this.el.html(out); + // are there actually any facets to show? + if (this.model.get('filters').length > 0) { + this.el.show(); + } else { + this.el.hide(); + } + }, + onHide: function(e) { + e.preventDefault(); + this.el.hide(); + }, + onRemoveFilter: function(e) { + e.preventDefault(); + var $target = $(e.target); + var filterId = $target.closest('.filter').attr('data-filter-id'); + this.model.removeFilter(filterId); + } +}); + my.FacetViewer = Backbone.View.extend({ className: 'recline-facet-viewer well', template: ' \