Initial commit
This commit is contained in:
zhongjin
@@ -0,0 +1,343 @@
|
||||
var Backbone = require('backbone');
|
||||
var Map = require('../../../src/geo/map');
|
||||
var CartoDBLayer = require('../../../src/geo/map/cartodb-layer');
|
||||
var CartoDBLayerGroup = require('../../../src/geo/cartodb-layer-group');
|
||||
var TooltipModel = require('../../../src/geo/ui/tooltip-model');
|
||||
var InfowindowModel = require('../../../src/geo/ui/infowindow-model');
|
||||
var TooltipManager = require('../../../src/vis/tooltip-manager');
|
||||
var createEngine = require('../fixtures/engine.fixture.js');
|
||||
|
||||
var simulateFeatureOverEvent = function (layerView, data) {
|
||||
layerView.trigger('featureOver', {
|
||||
layer: layerView.model.getLayerInLayerGroupAt(data.layerIndex),
|
||||
layerIndex: data.layerIndex,
|
||||
latlng: [100, 200],
|
||||
position: data.position || { x: 20, y: 30 },
|
||||
feature: data.data
|
||||
});
|
||||
};
|
||||
|
||||
var simulateFeatureOutEvent = function (layerView, data) {
|
||||
layerView.trigger('featureOut', {
|
||||
layer: layerView.model.getLayerInLayerGroupAt(data.layerIndex),
|
||||
layerIndex: data.layerIndex
|
||||
});
|
||||
};
|
||||
|
||||
describe('src/vis/tooltip-manager.js', function () {
|
||||
var engineMock;
|
||||
|
||||
beforeEach(function () {
|
||||
this.map = new Map(null, { layersFactory: {} });
|
||||
this.layerView = new Backbone.View({
|
||||
model: new CartoDBLayerGroup({}, {
|
||||
layersCollection: this.map.layers
|
||||
})
|
||||
});
|
||||
|
||||
engineMock = createEngine();
|
||||
|
||||
this.tooltipModel = new TooltipModel();
|
||||
this.infowindowModel = new InfowindowModel();
|
||||
|
||||
this.tooltipManager = new TooltipManager({ // eslint-disable-line
|
||||
engine: engineMock,
|
||||
mapModel: this.map,
|
||||
tooltipModel: this.tooltipModel,
|
||||
infowindowModel: this.infowindowModel
|
||||
});
|
||||
});
|
||||
|
||||
it('should show the tooltip when a feature is hovered', function () {
|
||||
var layer1 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template1',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names1'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
var layer2 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template2',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'description',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names2'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
|
||||
this.tooltipManager.start(this.layerView);
|
||||
|
||||
this.map.layers.reset([ layer1, layer2 ]);
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
position: { x: 100, y: 200 },
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.get('position')).toEqual({ x: 100, y: 200 });
|
||||
expect(this.tooltipModel.get('fields')).toEqual([{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}]);
|
||||
expect(this.tooltipModel.get('template')).toEqual('template1');
|
||||
expect(this.tooltipModel.get('alternative_names')).toEqual('alternative_names1');
|
||||
expect(this.tooltipModel.isVisible()).toBeTruthy();
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 1,
|
||||
position: { x: 200, y: 300 },
|
||||
data: { cartodb_id: 10 }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.get('position')).toEqual({ x: 200, y: 300 });
|
||||
expect(this.tooltipModel.get('fields')).toEqual([{
|
||||
'name': 'description',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}]);
|
||||
expect(this.tooltipModel.get('template')).toEqual('template2');
|
||||
expect(this.tooltipModel.get('alternative_names')).toEqual('alternative_names2');
|
||||
expect(this.tooltipModel.isVisible()).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should NOT show the tooltip when a feature is hovered and infowindow is opened', function () {
|
||||
var layer1 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template1',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names1'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
|
||||
this.tooltipManager.start(this.layerView);
|
||||
|
||||
this.map.layers.reset([ layer1 ]);
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeTruthy();
|
||||
|
||||
simulateFeatureOutEvent(this.layerView, {
|
||||
layerIndex: 0
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeFalsy();
|
||||
|
||||
// Infowindow for layer1 is now visible
|
||||
this.infowindowModel.setInfowindowTemplate(layer1.infowindow);
|
||||
this.infowindowModel.setCurrentFeatureId(10);
|
||||
this.infowindowModel.show();
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should hide the tooltip when a feature is not hovered anymore', function () {
|
||||
var layer1 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template1',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names1'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
|
||||
this.tooltipManager.start(this.layerView);
|
||||
|
||||
this.map.layers.reset([ layer1 ]);
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeTruthy();
|
||||
|
||||
simulateFeatureOutEvent(this.layerView, {
|
||||
layerIndex: 0
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should hide the tooltip when the layer is hidden', function () {
|
||||
var layer1 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template1',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names1'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
|
||||
this.tooltipManager.start(this.layerView);
|
||||
|
||||
this.map.layers.reset([ layer1 ]);
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeTruthy();
|
||||
|
||||
layer1.hide();
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should NOT hide the tooltip when a feature is being featured over and other features are outered', function () {
|
||||
var layer1 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template1',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names1'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
var layer2 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template2',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names1'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
|
||||
this.tooltipManager.start(this.layerView);
|
||||
|
||||
this.map.layers.reset([ layer1, layer2 ]);
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeTruthy();
|
||||
|
||||
// A feature from a different layer is not overed anymore
|
||||
simulateFeatureOutEvent(this.layerView, {
|
||||
layerIndex: 1
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should NOT show the tooltip if popups are disabled', function () {
|
||||
var layer1 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template1',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names1'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
|
||||
this.tooltipManager.start(this.layerView);
|
||||
|
||||
this.map.layers.reset([ layer1 ]);
|
||||
this.map.disablePopups();
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
expect(this.tooltipModel.isVisible()).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should NOT show the tooltip if tooltip has no template', function () {
|
||||
var layer1 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: '',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'name',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names1'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
|
||||
this.tooltipManager.start(this.layerView);
|
||||
|
||||
this.map.layers.reset([ layer1 ]);
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should NOT show the tooltipView if the layerModel doesn\'t have tooltip data', function () {
|
||||
var layer1 = new CartoDBLayer({}, { engine: engineMock });
|
||||
var layer2 = new CartoDBLayer({
|
||||
tooltip: {
|
||||
template: 'template2',
|
||||
template_type: 'underscore',
|
||||
fields: [{
|
||||
'name': 'description',
|
||||
'title': true,
|
||||
'position': 1
|
||||
}],
|
||||
alternative_names: 'alternative_names2'
|
||||
}
|
||||
}, { engine: engineMock });
|
||||
|
||||
this.tooltipManager.start(this.layerView);
|
||||
|
||||
this.map.layers.reset([ layer1, layer2 ]);
|
||||
|
||||
simulateFeatureOverEvent(this.layerView, {
|
||||
layerIndex: 0,
|
||||
data: { cartodb_id: 10, name: 'CARTO' }
|
||||
});
|
||||
|
||||
expect(this.tooltipModel.isVisible()).toBeFalsy();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user