270 lines
7.8 KiB
JavaScript
270 lines
7.8 KiB
JavaScript
describe('cdb.geo.ui.Search', function() {
|
|
|
|
beforeEach(function() {
|
|
this.$el = $("<div>")
|
|
.attr('id', 'map')
|
|
.height(500)
|
|
.width(500);
|
|
$('body').append(this.$el);
|
|
this.map = new cdb.geo.Map();
|
|
var template = cdb.core.Template.compile(
|
|
'\
|
|
<form>\
|
|
<span class="loader"></span>\
|
|
<input type="text" class="text" value="" />\
|
|
<input type="submit" class="submit" value="" />\
|
|
</form>\
|
|
',
|
|
'mustache'
|
|
);
|
|
this.mapView = new cdb.geo.LeafletMapView({
|
|
el: this.$el,
|
|
map: this.map
|
|
});
|
|
|
|
this.view = new cdb.geo.ui.Search({
|
|
template: template,
|
|
model: this.map,
|
|
mapView: this.mapView
|
|
});
|
|
this.view.render();
|
|
});
|
|
|
|
it('should render properly', function() {
|
|
expect(this.view.$('form').length).toBe(1);
|
|
expect(this.view.$('input[type="text"]').length).toBe(1);
|
|
expect(this.view.$('input[type="submit"]').length).toBe(1);
|
|
expect(this.view.$('span.loader').length).toBe(1);
|
|
});
|
|
|
|
describe('onSubmit', function() {
|
|
beforeEach(function(){
|
|
var self = this;
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
boundingbox: {
|
|
south: 6.0,
|
|
north: 4.0,
|
|
west: 6.0,
|
|
east: 4.0
|
|
},
|
|
type: undefined
|
|
};
|
|
cdb.geo.geocoder[this.view.GEOCODER_SERVICE].geocode = function(address, callback) {
|
|
callback([ self.result ]);
|
|
};
|
|
|
|
this.view.$('input.text').val('Madrid, Spain');
|
|
});
|
|
|
|
it('should search with geocoder when form is submit', function() {
|
|
spyOn(cdb.geo.geocoder[this.view.GEOCODER_SERVICE], 'geocode');
|
|
this.view.$('form').submit();
|
|
expect(cdb.geo.geocoder[this.view.GEOCODER_SERVICE].geocode).toHaveBeenCalled();
|
|
});
|
|
|
|
it('should change map center when geocoder returns any result', function() {
|
|
var onBoundsChanged = jasmine.createSpy("onBoundsChange");
|
|
this.map.bind('change:view_bounds_sw', onBoundsChanged, this.view);
|
|
this.view.$('form').submit();
|
|
expect(onBoundsChanged).toHaveBeenCalled();
|
|
this.map.unbind('change:view_bounds_sw', onBoundsChanged, this.view);
|
|
});
|
|
|
|
it('should center map to lat,lon when bbox is not defined', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0
|
|
};
|
|
this.view.$('form').submit();
|
|
var center = this.map.get('center');
|
|
expect(center[0]).toBe(43.0);
|
|
expect(center[1]).toBe(-3.0);
|
|
});
|
|
|
|
it('should center map whith bbox when it is defined', function() {
|
|
this.view.$('form').submit();
|
|
var ne = this.map.get('view_bounds_ne');
|
|
var sw = this.map.get('view_bounds_sw');
|
|
expect(ne[0].toFixed(0)).toBe('6');
|
|
expect(ne[1].toFixed(0)).toBe('6');
|
|
expect(sw[0].toFixed(0)).toBe('4');
|
|
expect(sw[1].toFixed(0)).toBe('4');
|
|
var center = this.map.get('center');
|
|
expect(center[0]).not.toBe(43.0);
|
|
expect(center[1]).not.toBe(-3.0);
|
|
});
|
|
|
|
describe('result zoom', function() {
|
|
|
|
it('should zoom to 18 when search result is building type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'building'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(18);
|
|
});
|
|
|
|
it('should zoom to 15 when search result is postal-area type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'postal-area'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(15);
|
|
});
|
|
|
|
it('should zoom to 18 when search result is venue type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'venue'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(18);
|
|
});
|
|
|
|
it('should zoom to 8 when search result is region type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'region'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(8);
|
|
});
|
|
|
|
it('should zoom to 5 when search result is country type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'country'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(5);
|
|
});
|
|
|
|
it('should zoom to 8 when search result is county type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'county'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(8);
|
|
});
|
|
|
|
it('should zoom to 18 when search result is address type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'address'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(18);
|
|
});
|
|
|
|
it('should zoom to 12 when search result is locality type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'locality'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(12);
|
|
});
|
|
|
|
it('should zoom to 11 when search result is localadmin type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'localadmin'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(11);
|
|
});
|
|
|
|
it('should zoom to 15 when search result is neighbourhood type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'neighbourhood'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(15);
|
|
});
|
|
|
|
it('should zoom to 12 when search result is unknown type', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0,
|
|
type: 'whatever'
|
|
};
|
|
this.view.$('form').submit();
|
|
expect(this.map.get('zoom')).toBe(12);
|
|
});
|
|
});
|
|
|
|
describe('searchPin', function() {
|
|
beforeEach(function() {
|
|
this.view.options.searchPin = true;
|
|
this.view.$('form').submit();
|
|
});
|
|
|
|
it('should add a pin and an infowindow when search is completed', function() {
|
|
expect(this.view._searchPin).toBeDefined();
|
|
expect(this.view._searchInfowindow).toBeDefined();
|
|
});
|
|
|
|
it('should place pin in the lat,lon if it is provided', function() {
|
|
this.result = {
|
|
lat: 43.0,
|
|
lon: -3.0
|
|
};
|
|
var center = this.view._searchPin.model.get('geojson').coordinates;
|
|
expect(center[0]).toBe(-3.0);
|
|
expect(center[1]).toBe(43.0);
|
|
});
|
|
|
|
it('should place pin in the middle of the bbox if lat,lon is not provided', function() {
|
|
this.result = {
|
|
boundingbox: {
|
|
south: 6.0,
|
|
north: 4.0,
|
|
west: 6.0,
|
|
east: 4.0
|
|
}
|
|
};
|
|
this.view.$('form').submit();
|
|
var center = this.view._searchPin.model.get('geojson').coordinates;
|
|
expect(center[0]).toBe(5.0);
|
|
expect(center[1]).toBe(5.0);
|
|
});
|
|
|
|
it('should display address in the search infowindow', function() {
|
|
expect(this.view._searchInfowindow.$('.cartodb-popup-content-wrapper p').text()).toBe('Madrid, Spain');
|
|
});
|
|
|
|
it('should destroy/hide search pin when map is clicked', function(done) {
|
|
expect(this.view._searchPin).toBeDefined();
|
|
expect(this.view._searchInfowindow).toBeDefined();
|
|
this.mapView.trigger('click');
|
|
setTimeout(function() {
|
|
expect(this.view._searchPin).toBeUndefined();
|
|
expect(this.view._searchInfowindow).toBeUndefined();
|
|
done();
|
|
}, 1500);
|
|
});
|
|
});
|
|
});
|
|
|
|
afterEach(function() {
|
|
this.$el.remove();
|
|
});
|
|
|
|
});
|