\
-
\
- {{#termFilters}} \
-
\
- {{/termFilters}} \
-
\
-
\
-
To add a filter use the column menu in the grid view.
\
-
\
+
\
+ {{/termFilters}} \
+ {{#termFilters.length}} \
+
\
+ {{/termFilters.length}} \
+ \
\
',
events: {
- 'click .js-hide': 'onHide',
'click .js-remove-filter': 'onRemoveFilter',
- 'submit form': 'onTermFiltersUpdate'
+ 'click .js-add-filter': 'onAddFilterShow',
+ 'submit form.js-edit': 'onTermFiltersUpdate',
+ 'submit form.js-add': 'onAddFilter'
},
initialize: function() {
this.el = $(this.el);
_.bindAll(this, 'render');
- this.model.bind('change', this.render);
- this.model.bind('change:filters:new-blank', this.render);
+ this.model.queryState.bind('change', this.render);
+ this.model.queryState.bind('change:filters:new-blank', this.render);
this.render();
},
render: function() {
- var tmplData = $.extend(true, {}, this.model.toJSON());
+ var tmplData = $.extend(true, {}, this.model.queryState.toJSON());
// we will use idx in list as there id ...
tmplData.filters = _.map(tmplData.filters, function(filter, idx) {
filter.id = idx;
@@ -68,29 +74,38 @@ my.FilterEditor = Backbone.View.extend({
value: filter.term[fieldId]
};
});
+ tmplData.fields = this.model.fields.toJSON();
var out = Mustache.render(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) {
+ onAddFilterShow: function(e) {
e.preventDefault();
- this.el.hide();
+ var $target = $(e.target);
+ $target.hide();
+ this.el.find('form.js-add').show();
+ },
+ onAddFilter: function(e) {
+ e.preventDefault();
+ var $target = $(e.target);
+ $target.hide();
+ var filterType = $target.find('select.filterType').val();
+ var field = $target.find('select.fields').val();
+ if (filterType === 'term') {
+ this.model.queryState.addTermFilter(field);
+ }
+ // trigger render explicitly as queryState change will not be triggered (as blank value for filter)
+ this.render();
},
onRemoveFilter: function(e) {
e.preventDefault();
var $target = $(e.target);
var filterId = $target.closest('.filter').attr('data-filter-id');
- this.model.removeFilter(filterId);
+ this.model.queryState.removeFilter(filterId);
},
onTermFiltersUpdate: function(e) {
var self = this;
e.preventDefault();
- var filters = self.model.get('filters');
+ var filters = self.model.queryState.get('filters');
var $form = $(e.target);
_.each($form.find('input'), function(input) {
var $input = $(input);
@@ -99,8 +114,8 @@ my.FilterEditor = Backbone.View.extend({
var fieldId = $input.attr('data-filter-field');
filters[filterIndex].term[fieldId] = value;
});
- self.model.set({filters: filters});
- self.model.trigger('change');
+ self.model.queryState.set({filters: filters});
+ self.model.queryState.trigger('change');
}
});
diff --git a/test/backend.elasticsearch.test.js b/test/backend/elasticsearch.test.js
similarity index 100%
rename from test/backend.elasticsearch.test.js
rename to test/backend/elasticsearch.test.js
diff --git a/test/base.js b/test/base.js
index 7163131b..bd279965 100644
--- a/test/base.js
+++ b/test/base.js
@@ -7,17 +7,17 @@ var Fixture = {
{id: 'y'},
{id: 'z'},
{id: 'country'},
- {id: 'label'},
+ {id: 'title'},
{id: 'lat'},
{id: 'lon'}
];
var documents = [
- {id: 0, date: '2011-01-01', x: 1, y: 2, z: 3, country: 'DE', label: 'first', lat:52.56, lon:13.40},
- {id: 1, date: '2011-02-02', x: 2, y: 4, z: 24, country: 'UK', label: 'second', lat:54.97, lon:-1.60},
- {id: 2, date: '2011-03-03', x: 3, y: 6, z: 9, country: 'US', label: 'third', lat:40.00, lon:-75.5},
- {id: 3, date: '2011-04-04', x: 4, y: 8, z: 6, country: 'UK', label: 'fourth', lat:57.27, lon:-6.20},
- {id: 4, date: '2011-05-04', x: 5, y: 10, z: 15, country: 'UK', label: 'fifth', lat:51.58, lon:0},
- {id: 5, date: '2011-06-02', x: 6, y: 12, z: 18, country: 'DE', label: 'sixth', lat:51.04, lon:7.9}
+ {id: 0, date: '2011-01-01', x: 1, y: 2, z: 3, country: 'DE', title: 'first', lat:52.56, lon:13.40},
+ {id: 1, date: '2011-02-02', x: 2, y: 4, z: 24, country: 'UK', title: 'second', lat:54.97, lon:-1.60},
+ {id: 2, date: '2011-03-03', x: 3, y: 6, z: 9, country: 'US', title: 'third', lat:40.00, lon:-75.5},
+ {id: 3, date: '2011-04-04', x: 4, y: 8, z: 6, country: 'UK', title: 'fourth', lat:57.27, lon:-6.20},
+ {id: 4, date: '2011-05-04', x: 5, y: 10, z: 15, country: 'UK', title: 'fifth', lat:51.58, lon:0},
+ {id: 5, date: '2011-06-02', x: 6, y: 12, z: 18, country: 'DE', title: 'sixth', lat:51.04, lon:7.9}
];
var dataset = recline.Backend.Memory.createDataset(documents, fields);
return dataset;
diff --git a/test/index.html b/test/index.html
index 26fed5dd..2e3aa91c 100644
--- a/test/index.html
+++ b/test/index.html
@@ -27,6 +27,7 @@
+
@@ -34,31 +35,34 @@
+
-
+
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
-
+
+
+
+
+
+
diff --git a/test/view-graph.test.js b/test/view.graph.test.js
similarity index 65%
rename from test/view-graph.test.js
rename to test/view.graph.test.js
index 3b015f12..13c48efc 100644
--- a/test/view-graph.test.js
+++ b/test/view.graph.test.js
@@ -8,7 +8,7 @@ test('basics', function () {
$('.fixtures').append(view.el);
equal(view.state.get('graphType'), 'lines-and-points');
// view will auto render ...
- assertPresent('.editor', view.el);
+ assertPresent('.editor', view.elSidebar);
view.remove();
});
@@ -27,9 +27,9 @@ test('initialize', function () {
deepEqual(view.state.get('series'), ['y', 'z']);
// check we have updated editor with state info
- equal(view.el.find('.editor-type select').val(), 'lines');
- equal(view.el.find('.editor-group select').val(), 'x');
- var out = _.map(view.el.find('.editor-series select'), function($el) {
+ equal(view.elSidebar.find('.editor-type select').val(), 'lines');
+ equal(view.elSidebar.find('.editor-group select').val(), 'x');
+ var out = _.map(view.elSidebar.find('.editor-series select'), function($el) {
return $($el).val();
});
deepEqual(out, ['y', 'z']);
@@ -51,3 +51,20 @@ test('dates in graph view', function () {
view.remove();
});
+
+test('GraphControls basics', function () {
+ var dataset = Fixture.getDataset();
+ var view = new recline.View.GraphControls({
+ model: dataset,
+ state: {
+ graphType: 'bars',
+ series: []
+ }
+ });
+ $('.fixtures').append(view.el);
+ equal(view.state.get('graphType'), 'bars');
+ // view will auto render ...
+ assertPresent('.editor', view.el);
+ view.remove();
+});
+
diff --git a/test/view-grid.test.js b/test/view.grid.test.js
similarity index 100%
rename from test/view-grid.test.js
rename to test/view.grid.test.js
diff --git a/test/view-map.test.js b/test/view.map.test.js
similarity index 86%
rename from test/view-map.test.js
rename to test/view.map.test.js
index 61e4d5a3..f5d26406 100644
--- a/test/view-map.test.js
+++ b/test/view.map.test.js
@@ -31,7 +31,7 @@ test('basics', function () {
//Fire query, otherwise the map won't be initialized
dataset.query();
- assertPresent('.editor',view.el);
+ assertPresent('.editor-field-type', view.elSidebar);
// Check that the Leaflet map was set up
assertPresent('.leaflet-container',view.el);
@@ -42,6 +42,21 @@ test('basics', function () {
view.remove();
});
+test('_setupGeometryField', function () {
+ var dataset = Fixture.getDataset();
+ var view = new recline.View.Map({
+ model: dataset
+ });
+ var exp = {
+ geomField: null,
+ lonField: 'lon',
+ latField: 'lat',
+ autoZoom: true
+ };
+ deepEqual(view.state.toJSON(), exp);
+ deepEqual(view.menu.state.toJSON(), exp);
+});
+
test('Lat/Lon geom fields', function () {
var dataset = Fixture.getDataset();
var view = new recline.View.Map({
@@ -138,6 +153,15 @@ test('Popup', function () {
view.remove();
});
+test('MapMenu', function () {
+ var dataset = Fixture.getDataset();
+ var controls = new recline.View.MapMenu({
+ model: dataset,
+ state: {}
+ });
+ assertPresent('.editor-field-type', controls.el);
+});
+
var _getFeaturesCount = function(features){
var cnt = 0;
features._iterateLayers(function(layer){
diff --git a/test/view-slickgrid.test.js b/test/view.slickgrid.test.js
similarity index 98%
rename from test/view-slickgrid.test.js
rename to test/view.slickgrid.test.js
index 6e5e7017..94d4d9d7 100644
--- a/test/view-slickgrid.test.js
+++ b/test/view.slickgrid.test.js
@@ -27,7 +27,7 @@ test('state', function () {
var view = new recline.View.SlickGrid({
model: dataset,
state: {
- hiddenColumns:['x','lat','label'],
+ hiddenColumns:['x','lat','title'],
columnsOrder:['lon','id','z','date', 'y', 'country'],
columnsSort:{column:'country',direction:'desc'},
columnsWidth:[
diff --git a/test/view-timeline.test.js b/test/view.timeline.test.js
similarity index 100%
rename from test/view-timeline.test.js
rename to test/view.timeline.test.js
diff --git a/test/widget.filtereditor.test.js b/test/widget.filtereditor.test.js
new file mode 100644
index 00000000..627db158
--- /dev/null
+++ b/test/widget.filtereditor.test.js
@@ -0,0 +1,41 @@
+module("Widget - Filter Editor");
+
+test('basics', function () {
+ var dataset = Fixture.getDataset();
+ var view = new recline.View.FilterEditor({
+ model: dataset
+ });
+ $('.fixtures').append(view.el);
+ assertPresent('.js-add-filter', view.elSidebar);
+ var $addForm = view.el.find('form.js-add');
+ ok(!$addForm.is(":visible"));
+ view.el.find('.js-add-filter').click();
+ ok(!view.el.find('.js-add-filter').is(":visible"));
+ ok($addForm.is(":visible"));
+
+ // submit the form
+ $addForm.find('select.fields').val('country');
+ $addForm.submit();
+
+ // now check we have new filter
+ ok(!$addForm.is(":visible"));
+ $editForm = view.el.find('form.js-edit');
+ equal($editForm.find('.filter-term').length, 1)
+ equal(_.keys(dataset.queryState.attributes.filters[0].term)[0], 'country');
+
+ // now set filter value and apply
+ $editForm.find('input').val('UK');
+ $editForm.submit();
+ equal(dataset.queryState.attributes.filters[0].term.country, 'UK');
+ equal(dataset.currentRecords.length, 3);
+
+ // now remove filter
+ $editForm.find('.js-remove-filter').click();
+ // hmmm, not working yet but works by eye!
+ // $editForm = view.el.find('form.js-edit');
+ // equal($editForm.find('.filter-term').length, 0)
+ // equal(dataset.currentRecords.length, 6);
+
+ view.remove();
+});
+