Merge pull request #203 from UDST/bug/ie-fixes

Fix IE issues with Promises and Typed Arrays

examples/basic/main.js

@@ -12,9 +12,9 @@ VIZI.Controls.orbit().addTo(world);
 // CartoDB basemap
 VIZI.imageTileLayer('http://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png', {
   attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
-}).addTo(world).then(() => {
+}).addTo(world).then(function() {
   console.log('Added image tile layer to world');
-});;
+});
 
 // Buildings from Mapzen
 VIZI.topoJSONTileLayer('https://tile.mapzen.com/mapzen/vector/v1/buildings/{z}/{x}/{y}.topojson?api_key=vector-tiles-NT5Emiw', {
@@ -37,6 +37,6 @@ VIZI.topoJSONTileLayer('https://tile.mapzen.com/mapzen/vector/v1/buildings/{z}/{
     return feature.geometry.type !== 'Point';
   },
   attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, <a href="http://whosonfirst.mapzen.com#License">Who\'s On First</a>.'
-}).addTo(world).then(() => {
+}).addTo(world).then(function() {
   console.log('Added TopoJSON layer to world');
 });

examples/tile-events/main.js

@@ -14,12 +14,12 @@ var imageTiles = VIZI.imageTileLayer('http://{s}.basemaps.cartocdn.com/light_nol
   attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
 });
 
-imageTiles.addTo(world).then(() => {
+imageTiles.addTo(world).then(function() {
   console.log('Added image tile layer to world');
 });
 
 // Will be emitted every time the image layer updates the tile list
 // All tiles in view are sent with each update
-imageTiles.on('tilesList', (tiles) => {
+imageTiles.on('tilesList', function(tiles) {
   console.log(tiles);
 });

examples/web-workers-all-the-things/main.js

@@ -13,7 +13,7 @@ world._environment._skybox.setInclination(0.3);
 VIZI.Controls.orbit().addTo(world);
 
 // Leave a single CPU for the main browser thread
-world.createWorkers(7).then(() => {
+world.createWorkers(7).then(function() {
   console.log('Workers ready');
 
   // CartoDB basemap

examples/web-workers-all-the-things/vizicities-worker.js

@@ -14,7 +14,7 @@ postMessage({
 });
 
 // Recieve message from main thread
-onmessage = (event) => {
+onmessage = function(event) {
   if (!event.data.method) {
     postMessage({
       type: 'error',
@@ -49,7 +49,7 @@ onmessage = (event) => {
   }
 
   // Call method with given arguments
-  _method.apply(this, event.data.args).then((result) => {
+  _method.apply(this, event.data.args).then(function(result) {
     if (DEBUG) { console.log('Message sent from worker', Date.now()); }
 
     // Return results

examples/web-workers-basic/main.js

@@ -10,13 +10,13 @@ var world = VIZI.world('world', {
 VIZI.Controls.orbit().addTo(world);
 
 // Leave a single CPU for the main browser thread
-world.createWorkers(7).then(() => {
+world.createWorkers(7).then(function() {
   console.log('Workers ready');
 
   // CartoDB basemap
   VIZI.imageTileLayer('http://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png', {
     attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
-  }).addTo(world).then(() => {
+  }).addTo(world).then(function() {
     console.log('Added image tile layer to world');
   });;
 
@@ -42,7 +42,7 @@ world.createWorkers(7).then(() => {
       return feature.geometry.type !== 'Point';
     },
     attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, <a href="http://whosonfirst.mapzen.com#License">Who\'s On First</a>.'
-  }).addTo(world).then(() => {
+  }).addTo(world).then(function() {
     console.log('Added TopoJSON layer to world');
   });
 });

examples/web-workers-basic/vizicities-worker.js

@@ -14,7 +14,7 @@ postMessage({
 });
 
 // Recieve message from main thread
-onmessage = (event) => {
+onmessage = function(event) {
   if (!event.data.method) {
     postMessage({
       type: 'error',
@@ -49,7 +49,7 @@ onmessage = (event) => {
   }
 
   // Call method with given arguments
-  _method.apply(this, event.data.args).then((result) => {
+  _method.apply(this, event.data.args).then(function(result) {
     if (DEBUG) { console.log('Message sent from worker', Date.now()); }
 
     // Return results

examples/web-workers-geojson/main.js

@@ -10,7 +10,7 @@ var world = VIZI.world('world', {
 VIZI.Controls.orbit().addTo(world);
 
 // Leave a single CPU for the main browser thread
-world.createWorkers(7).then(() => {
+world.createWorkers(7).then(function() {
   console.log('Workers ready');
 
   // CartoDB basemap

examples/web-workers-geojson/vizicities-worker.js

@@ -14,7 +14,7 @@ postMessage({
 });
 
 // Recieve message from main thread
-onmessage = (event) => {
+onmessage = function(event) {
   if (!event.data.method) {
     postMessage({
       type: 'error',
@@ -49,7 +49,7 @@ onmessage = (event) => {
   }
 
   // Call method with given arguments
-  _method.apply(this, event.data.args).then((result) => {
+  _method.apply(this, event.data.args).then(function(result) {
     if (DEBUG) { console.log('Message sent from worker', Date.now()); }
 
     // Return results

examples/web-workers-outlines/main.js

@@ -10,13 +10,13 @@ var world = VIZI.world('world', {
 VIZI.Controls.orbit().addTo(world);
 
 // Leave a single CPU for the main browser thread
-world.createWorkers(7).then(() => {
+world.createWorkers(7).then(function() {
   console.log('Workers ready');
 
   // CartoDB basemap
   VIZI.imageTileLayer('http://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png', {
     attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
-  }).addTo(world).then(() => {
+  }).addTo(world).then(function() {
     console.log('Added image tile layer to world');
   });
 
@@ -43,7 +43,7 @@ world.createWorkers(7).then(() => {
       return feature.geometry.type !== 'Point';
     },
     attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, <a href="http://whosonfirst.mapzen.com#License">Who\'s On First</a>.'
-  }).addTo(world).then(() => {
+  }).addTo(world).then(function() {
     console.log('Added TopoJSON layer to world');
   });
 });

examples/web-workers-outlines/vizicities-worker.js

@@ -14,7 +14,7 @@ postMessage({
 });
 
 // Recieve message from main thread
-onmessage = (event) => {
+onmessage = function(event) {
   if (!event.data.method) {
     postMessage({
       type: 'error',
@@ -49,7 +49,7 @@ onmessage = (event) => {
   }
 
   // Call method with given arguments
-  _method.apply(this, event.data.args).then((result) => {
+  _method.apply(this, event.data.args).then(function(result) {
     if (DEBUG) { console.log('Message sent from worker', Date.now()); }
 
     // Return results

gulpfile.babel.js

@@ -92,6 +92,11 @@ function build() {
           { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' }
         ]
       },
+      plugins: [
+        new webpack.ProvidePlugin({
+          Promise: 'promise-polyfill'
+        })
+      ],
       devtool: 'source-map'
     }))
     .pipe(gulp.dest(destinationFolder))
@@ -138,6 +143,11 @@ function buildWorker() {
           { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' },
         ]
       },
+      plugins: [
+        new webpack.ProvidePlugin({
+          Promise: 'promise-polyfill'
+        })
+      ],
       devtool: 'source-map'
     }))
     .pipe(gulp.dest(destinationFolder))

package.json

@@ -87,6 +87,7 @@
     "lodash.assign": "^4.0.2",
     "lodash.throttle": "^4.0.0",
     "lru-cache": "^4.0.0",
+    "promise-polyfill": "^6.0.2",
     "reqwest": "^2.0.5",
     "shortid": "^2.2.6",
     "text-encoding": "^0.6.1",

src/layer/GeoJSONWorkerLayer.js

@@ -225,7 +225,7 @@ class GeoJSONWorkerLayer extends Layer {
           pickingId = this.getPickingId();
 
           pickingIds = new Float32Array(splitPositions[i].length / 3);
-          pickingIds.fill(pickingId);
+          Buffer.fillTypedArray(pickingIds, pickingId);
 
           obj.attributes[0].pickingIds = pickingIds;
 
@@ -387,7 +387,7 @@ class GeoJSONWorkerLayer extends Layer {
           pickingId = this.getPickingId();
 
           pickingIds = new Float32Array(splitPositions[i].length / 3);
-          pickingIds.fill(pickingId);
+          Buffer.fillTypedArray(pickingIds, pickingId);
 
           obj.attributes[0].pickingIds = pickingIds;
 
@@ -498,7 +498,7 @@ class GeoJSONWorkerLayer extends Layer {
           pickingId = this.getPickingId();
 
           pickingIds = new Float32Array(splitPositions[i].length / 3);
-          pickingIds.fill(pickingId);
+          Buffer.fillTypedArray(pickingIds, pickingId);
 
           obj.attributes[0].pickingIds = pickingIds;
 

src/layer/tile/TileLayer.js

@@ -212,7 +212,7 @@ class TileLayer extends Layer {
     // Get list of tiles that were in the previous update but not the
     // current one (for aborting requests, etc)
     var missingTiles = this._tileList.filter((item) => {
-      return !tileList.includes(item);
+      return tileList.indexOf(item) < 0;
     });
 
     // Abort tiles that are no longer in view

src/util/Buffer.js

@@ -353,6 +353,12 @@ var Buffer = (function() {
     return textDecoder.decode(ab);
   };
 
+  var fillTypedArray = function(arr, value) {
+    for (var i = 0; i < arr.length; i++) {
+      arr[i] = value;
+    }
+  };
+
   return {
     mergeFloat32Arrays: mergeFloat32Arrays,
     splitFloat32Array: splitFloat32Array,
@@ -362,7 +368,8 @@ var Buffer = (function() {
     createLineGeometry: createLineGeometry,
     createGeometry: createGeometry,
     stringToUint8Array: stringToUint8Array,
-    uint8ArrayToString: uint8ArrayToString
+    uint8ArrayToString: uint8ArrayToString,
+    fillTypedArray: fillTypedArray
   };
 })();
 

src/util/WorkerPool.js

@@ -2,6 +2,33 @@ import WorkerPoolWorker from './WorkerPoolWorker';
 
 const DEBUG = false;
 
+// Polyfill for Array.find
+if (!Array.prototype.find) {
+  Object.defineProperty(Array.prototype, 'find', {
+    value: function(predicate) {
+      'use strict';
+      if (this == null) {
+        throw new TypeError('Array.prototype.find called on null or undefined');
+      }
+      if (typeof predicate !== 'function') {
+        throw new TypeError('predicate must be a function');
+      }
+      var list = Object(this);
+      var length = list.length >>> 0;
+      var thisArg = arguments[1];
+      var value;
+
+      for (var i = 0; i < length; i++) {
+        value = list[i];
+        if (predicate.call(thisArg, value, i, list)) {
+          return value;
+        }
+      }
+      return undefined;
+    }
+  });
+}
+
 class WorkerPool {
   constructor(options) {
     this.numThreads = options.numThreads || 2;