Initial commit

2020-06-13 18:34:34 +08:00
commit 52aaa9f15d
655 changed files with 96796 additions and 0 deletions
@@ -0,0 +1,139 @@
+/* global google */
+var GoogleCartoDBLayerGroupClass = require('../../../../src/geo/gmaps/gmaps-cartodb-layer-group-view');
+var cartoLayerGroupViewTests = require('../shared-tests-for-carto-layer-group');
+var CartoDBLayer = require('../../../../src/geo/map/cartodb-layer');
+var LayersCollection = require('../../../../src/geo/map/layers');
+var CartoDBLayerGroup = require('../../../../src/geo/cartodb-layer-group');
+
+describe('gmaps-cartodb-layer-group-view', function () {
+  /**
+   * Helper function used to get a google map in the shared tests.
+   */
+  function createNativeMap (container) {
+    // Create a leaflet map inside a container
+    container.setAttribute('id', 'map');
+    container.style.height = '200px';
+    document.body.appendChild(container);
+    var googleMap = new google.maps.Map(document.getElementById('map'), {
+      zoom: 4,
+      center: { lat: 47.84808037632246, lng: 14.2822265625 }
+    });
+    return googleMap;
+  }
+
+  /**
+   * Helper function used to get the tiles in the shared tests
+   */
+  function getTileUrl (layerGroupView) {
+    return layerGroupView.options.tiles[0].replace('{s}', '0');
+  }
+
+  /**
+   * Gmaps events and Leaflet events are different.
+   */
+  var event = {
+    da: { x: 121.8125, y: 94.56249999999997 },
+    data: { name: 'fakeCityName', cartodb_id: 123 },
+    e: { type: 'mousemove' },
+    latLng: { lat: function () { return 42.48830197960228; }, lng: function () { return -8.701171875; } },
+    layer: 0,
+    pixel: { x: 243, y: 274 }
+  };
+
+  // -- Shared tests for carto layer group
+  cartoLayerGroupViewTests(createNativeMap, GoogleCartoDBLayerGroupClass, getTileUrl, event);
+
+  // -- Google maps specific tests
+  describe('GMapsCartoDBLayerGroupView', function () {
+    var nativeMap;
+    var container;
+    var cartoDbLayer0;
+    var cartoDbLayer1;
+    var layerGroupView0;
+    var layerGroupView1;
+
+    var layerGroupModelMock;
+    var layersCollection;
+
+    var engineMock = {
+      on: jasmine.createSpy('on')
+    };
+
+    var mapModelMock = {
+      on: jasmine.createSpy('on'),
+      isFeatureInteractivityEnabled: jasmine.createSpy('isFeatureInteractivityEnabled').and.returnValue(false)
+    };
+
+    beforeEach(function () {
+      container = document.createElement('div');
+      nativeMap = createNativeMap(container);
+
+      cartoDbLayer0 = new CartoDBLayer({}, { engine: engineMock });
+      cartoDbLayer1 = new CartoDBLayer({}, { engine: engineMock });
+
+      layersCollection = new LayersCollection([cartoDbLayer0, cartoDbLayer1]);
+
+      layerGroupModelMock = new CartoDBLayerGroup({
+        urls: {
+          'subdomains': [0, 1, 2, 3],
+          'tiles': 'http://{s}.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/{layerIndexes}/{z}/{x}/{y}.png',
+          'grids': [
+            [
+              'http://0.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/0/{z}/{x}/{y}.grid.json',
+              'http://1.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/0/{z}/{x}/{y}.grid.json',
+              'http://2.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/0/{z}/{x}/{y}.grid.json',
+              'http://3.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/0/{z}/{x}/{y}.grid.json'
+            ],
+            [
+              'http://0.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/1/{z}/{x}/{y}.grid.json',
+              'http://1.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/1/{z}/{x}/{y}.grid.json',
+              'http://2.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/1/{z}/{x}/{y}.grid.json',
+              'http://3.ashbu.cartocdn.com/documentation/api/v1/map/0123456789/1/{z}/{x}/{y}.grid.json'
+            ]
+          ],
+          'attributes': [
+            'http://ashbu.cartocdn.com/documentation/api/v1/map/0123456789/0/attributes',
+            'http://ashbu.cartocdn.com/documentation/api/v1/map/0123456789/1/attributes'
+          ]
+        },
+        indexOfLayersInWindshaft: [1, 2]
+      }, {
+        layersCollection: layersCollection
+      });
+
+      layerGroupView0 = new GoogleCartoDBLayerGroupClass(layerGroupModelMock, { nativeMap: nativeMap, mapModel: mapModelMock });
+      layerGroupView1 = new GoogleCartoDBLayerGroupClass(layerGroupModelMock, { nativeMap: nativeMap, mapModel: mapModelMock });
+      nativeMap.overlayMapTypes.push(layerGroupView0);
+      nativeMap.overlayMapTypes.push(layerGroupView1);
+    });
+
+    describe('._getOverlayIndex', function () {
+      it('returns the index of the given layour group', function () {
+        expect(layerGroupView0._getOverlayIndex()).toEqual(0);
+        expect(layerGroupView1._getOverlayIndex()).toEqual(1);
+      });
+    });
+
+    describe('._refreshView', function () {
+      it('sets the layer group in the same position', function () {
+        layerGroupView0._refreshView();
+
+        expect(nativeMap.overlayMapTypes.getAt(0)).toEqual(layerGroupView0);
+        expect(nativeMap.overlayMapTypes.getAt(1)).toEqual(layerGroupView1);
+      });
+    });
+
+    describe('.remove', function () {
+      it('removes the correct layer group', function () {
+        layerGroupView0.remove();
+
+        expect(nativeMap.overlayMapTypes.getLength()).toEqual(1);
+        expect(nativeMap.overlayMapTypes.getAt(0)).toEqual(layerGroupView1);
+      });
+    });
+
+    afterEach(function () {
+      document.body.removeChild(container);
+    });
+  });
+});
@@ -0,0 +1,156 @@
+/* global google */
+var $ = require('jquery');
+var Backbone = require('backbone');
+var Map = require('../../../../src/geo/map');
+var GoogleMapsMapView = require('../../../../src/geo/gmaps/gmaps-map-view');
+
+describe('geo/gmaps/gmaps-map-view', function () {
+  var mapView;
+  var map;
+  var spy;
+  var container;
+
+  beforeEach(function () {
+    container = $('<div>').css('height', '200px');
+    map = new Map(null, {
+      layersFactory: {}
+    });
+
+    spyOn(map, 'setMapViewSize').and.callThrough();
+    spyOn(map, 'setPixelToLatLngConverter').and.callThrough();
+    spyOn(map, 'setLatLngToPixelConverter').and.callThrough();
+
+    mapView = new GoogleMapsMapView({
+      el: container,
+      mapModel: map,
+      engine: new Backbone.Model(),
+      layerGroupModel: new Backbone.Model()
+    });
+
+    mapView.render();
+
+    spy = jasmine.createSpyObj('spy', ['zoomChanged', 'centerChanged', 'scrollWheelChanged']);
+    map.bind('change:zoom', spy.zoomChanged);
+    map.bind('change:center', spy.centerChanged);
+    map.bind('change:scrollwheel', spy.scrollWheelChanged);
+  });
+
+  it('should change zoom', function () {
+    mapView._setZoom(null, 10);
+    expect(spy.zoomChanged).toHaveBeenCalled();
+  });
+
+  it('should disable gmaps dragging and double click zooming when the map has drag disabled', function () {
+    var container = $('<div>').css({
+      'height': '200px',
+      'width': '200px'
+    });
+    var map = new Map({
+      drag: false
+    }, {
+      layersFactory: {}
+    });
+    var mapView = new GoogleMapsMapView({
+      el: container,
+      mapModel: map,
+      engine: new Backbone.Model(),
+      layerGroupModel: new Backbone.Model()
+    });
+    mapView.render();
+
+    expect(mapView._gmapsMap.get('draggable')).toBeFalsy();
+    expect(mapView._gmapsMap.get('disableDoubleClickZoom')).toBeTruthy();
+  });
+
+  it('should change center and zoom when bounds are changed', function (done) {
+    var spy = jasmine.createSpy('change:center');
+    mapView.getSize = function () { return {x: 200, y: 200}; };
+    map.bind('change:center', spy);
+    spyOn(mapView, '_setCenter');
+    mapView._bindModel();
+
+    map.set({
+      'view_bounds_ne': [1, 1],
+      'view_bounds_sw': [-0.3, -1.2]
+    });
+
+    setTimeout(function () {
+      expect(mapView._setCenter).toHaveBeenCalled();
+      done();
+    }, 1000);
+  });
+
+  it('should "forward" a dragend event to the map model', function () {
+    var container = $('<div>').css({
+      'height': '200px',
+      'width': '200px'
+    });
+    var map = new Map({
+      drag: false
+    }, {
+      layersFactory: {}
+    });
+    var mapView = new GoogleMapsMapView({
+      el: container,
+      mapModel: map,
+      engine: new Backbone.Model(),
+      layerGroupModel: new Backbone.Model()
+    });
+    mapView.render();
+
+    spyOn(map, 'trigger');
+    spyOn(mapView, 'trigger');
+
+    google.maps.event.trigger(mapView._gmapsMap, 'dragend');
+
+    expect(map.trigger).toHaveBeenCalledWith('moveend', jasmine.any(Object));
+
+    map.trigger.calls.reset();
+    mapView.trigger.calls.reset();
+
+    google.maps.event.trigger(mapView._gmapsMap, 'zoom_changed');
+
+    expect(map.trigger).toHaveBeenCalledWith('moveend', jasmine.any(Object));
+
+    map.trigger.calls.reset();
+    mapView.trigger.calls.reset();
+  });
+
+  it('should set mapview size when bounds changes', function () {
+    google.maps.event.trigger(mapView._gmapsMap, 'bounds_changed');
+    expect(map.setMapViewSize).toHaveBeenCalled();
+  });
+
+  describe('converters', function () {
+    it('should set converters', function () {
+      expect(map.setPixelToLatLngConverter).toHaveBeenCalled();
+      expect(map.setLatLngToPixelConverter).toHaveBeenCalled();
+      expect(map._pixelToLatLngConverter).toBeDefined();
+      expect(map._latLngToPixelConverter).toBeDefined();
+    });
+
+    it('should call native methods', function () {
+      spyOn(mapView.projector, 'latLngToPixel').and.callThrough();
+      spyOn(mapView.projector, 'pixelToLatLng').and.callThrough();
+
+      var pixelToLatLng = map.pixelToLatLng();
+      pixelToLatLng({x: 0, y: 0});
+      expect(mapView.projector.pixelToLatLng).toHaveBeenCalled();
+
+      var latLngToPixel = map.latLngToPixel();
+      latLngToPixel([0, 0]);
+      expect(mapView.projector.latLngToPixel).toHaveBeenCalled();
+    });
+  });
+
+  describe('listeners', function () {
+    beforeEach(function (done) {
+      // Listen for the map to be ready
+      mapView.onReady(done);
+    });
+
+    it('sets isReady to true if idle event is triggered', function () {
+      expect(mapView._isReady).toBe(true);
+    });
+  });
+});
@@ -0,0 +1,69 @@
+var $ = require('jquery');
+var Backbone = require('backbone');
+var Map = require('../../../../src/geo/map');
+var GoogleMapsMapView = require('../../../../src/geo/gmaps/gmaps-map-view');
+var GMapsLayerViewFactory = require('../../../../src/geo/gmaps/gmaps-layer-view-factory');
+var TorqueLayer = require('../../../../src/geo/map/torque-layer');
+var MockFactory = require('../../../helpers/mockFactory');
+var SharedTestsForTorqueLayer = require('../shared-tests-for-torque-layer');
+var torque = require('torque.js');
+var createEngine = require('../../fixtures/engine.fixture.js');
+
+describe('geo/gmaps/gmaps-torque-layer-view', function () {
+  beforeEach(function () {
+    var container = $('<div>').css('height', '200px');
+    var engineMock = createEngine();
+    this.map = new Map(null, {
+      layersFactory: {}
+    });
+    spyOn(this.map, 'trigger');
+    this.view = new GoogleMapsMapView({
+      el: container,
+      mapModel: this.map,
+      engine: new Backbone.Model(),
+      layerViewFactory: new GMapsLayerViewFactory(),
+      layerGroupModel: new Backbone.Model(),
+      showLimitErrors: false
+    });
+
+    this.model = new TorqueLayer({
+      type: 'torque',
+      source: MockFactory.createAnalysisModel({ id: 'a0' }),
+      cartocss: '#test {}',
+      'torque-steps': 100
+    }, { engine: engineMock });
+    spyOn(torque, 'GMapsTorqueLayer').and.callThrough();
+    this.map.addLayer(this.model);
+    this.view = this.view._layerViews[this.model.cid];
+  });
+
+  SharedTestsForTorqueLayer.call(this);
+
+  it('should apply TorqueLayer initialize method on the extended view with a bunch of attrs', function () {
+    expect(torque.GMapsTorqueLayer).toHaveBeenCalled();
+
+    var attrs = torque.GMapsTorqueLayer.calls.argsFor(0)[0];
+    expect(attrs.cartocss).toEqual(jasmine.any(String));
+  });
+
+  describe('when GMapsTorqueLayer triggers tileError', function () {
+    it('should trigger error:limit in mapModel if showLimitErrors is true', function () {
+      this.view.showLimitErrors = true;
+      this.view.nativeTorqueLayer.fire('tileError');
+      var calls = this.map.trigger.calls.all();
+      var types = calls.map(function (call) {
+        return call.args[0];
+      });
+      expect(types).toContain('error:limit');
+    });
+
+    it('should not trigger error:limit in mapModel if showLimitErrors is false', function () {
+      this.view.nativeTorqueLayer.fire('tileError');
+      var calls = this.map.trigger.calls.all();
+      var types = calls.map(function (call) {
+        return call.args[0];
+      });
+      expect(types).not.toContain('error:limit');
+    });
+  });
+});