test(unit): add GlobeView, feature process, point clould, 3dtiles tes…

…t unit.

GlobeControls, TileMesh subdivision.

CODING.md

@@ -30,6 +30,7 @@ See the [node website](https://nodejs.org) to install node and npm.
 * To debug iTowns package on your side project. You can link iTowns package with `npm link ../path/iTowns/` in project folder and auto-transpile to `lib/` when iTowns sources are modified with command `npm run watch` in iTowns folder.
 
 ## Testing
+For unit test, defines `HTTPS_PROXY` if you launch test behind a proxy.
 
 In order to run the tests, [puppeteer](https://github.com/GoogleChrome/puppeteer)
 needs to be installed. If installing puppeteer behind a proxy, use `HTTP_PROXY`,

examples/3dtiles.html

@@ -22,7 +22,7 @@
         <script src="js/3dTilesHelper.js"></script>
         <script type="text/javascript">
             /* global itowns,document,GuiTools*/
-            var positionOnGlobe = { longitude: -75.61, latitude: 40.04, altitude: 50000 }
+            var positionOnGlobe = { longitude: -75.61, latitude: 40.04, altitude: 50000 };
             // iTowns namespace defined here
             var viewerDiv = document.getElementById('viewerDiv');
 

package.json

@@ -77,9 +77,11 @@
     "eslint-import-resolver-webpack": "^0.11.1",
     "eslint-loader": "^2.1.2",
     "eslint-plugin-import": "^2.17.3",
+    "https-proxy-agent": "^2.2.2",
     "jsdoc": "^3.6.2",
     "marked": "^0.6.3",
     "mocha": "^6.1.4",
+    "node-fetch": "^2.6.0",
     "nyc": "^14.1.1",
     "proj4": "^2.5.0",
     "puppeteer": "^1.18.1",

src/Controls/GlobeControls.js

@@ -543,7 +543,7 @@ function GlobeControls(view, targetCoordinate, range, globeRadius, options = {})
     const _onMouseUpListener = onMouseUp.bind(this);
     function onMouseDown(event) {
         CameraUtils.stop(view, this.camera);
-        player.stop().then(() => {
+        return player.stop().then(() => {
             if (this.enabled === false) { return; }
             event.preventDefault();
 
@@ -588,7 +588,7 @@ function GlobeControls(view, targetCoordinate, range, globeRadius, options = {})
 
     function ondblclick(event) {
         if (this.enabled === false || currentKey) { return; }
-        player.stop().then(() => {
+        return player.stop().then(() => {
             const point = view.getPickingPositionFromDepth(view.eventToViewCoords(event));
             const range = this.getRange();
             if (point && range > this.minDistance) {
@@ -673,7 +673,7 @@ function GlobeControls(view, targetCoordinate, range, globeRadius, options = {})
     }
 
     function onMouseWheel(event) {
-        player.stop().then(() => {
+        return player.stop().then(() => {
             if (!this.enabled || !states.DOLLY.enable) { return; }
             CameraUtils.stop(view, this.camera);
             event.preventDefault();
@@ -717,7 +717,7 @@ function GlobeControls(view, targetCoordinate, range, globeRadius, options = {})
     }
 
     function onKeyDown(event) {
-        player.stop().then(() => {
+        return player.stop().then(() => {
             if (this.enabled === false || this.enableKeys === false) { return; }
             currentKey = event.keyCode;
             switch (event.keyCode) {
@@ -748,7 +748,7 @@ function GlobeControls(view, targetCoordinate, range, globeRadius, options = {})
 
     function onTouchStart(event) {
         // CameraUtils.stop(view);
-        player.stop().then(() => {
+        return player.stop().then(() => {
             if (this.enabled === false) { return; }
 
             state = states.touchToState(event.touches.length);

src/Core/Scheduler/CancelledCommandException.js

@@ -6,6 +6,7 @@
 class CancelledCommandException {
     constructor(command) {
         this.command = command;
+        this.isCancelledCommandException = true;
     }
 
     toString() {

src/Layer/TiledGeometryLayer.js

@@ -311,6 +311,7 @@ class TiledGeometryLayer extends GeometryLayer {
      * @param {Object} context - The context of the update; see the {@link
      * MainLoop} for more informations.
      * @param {TileMesh} node - The node to subdivide.
+     * @return {Promise}  { description_of_the_return_value }
      */
     subdivideNode(context, node) {
         if (!node.pendingSubdivision && !node.children.some(n => n.layer == this)) {
@@ -329,7 +330,7 @@ class TiledGeometryLayer extends GeometryLayer {
                 redraw: false,
             };
 
-            context.scheduler.execute(command).then((children) => {
+            return context.scheduler.execute(command).then((children) => {
                 for (const child of children) {
                     node.add(child);
                     child.updateMatrixWorld(true);

src/Process/FeatureProcessing.js

@@ -112,7 +112,7 @@ export default {
             requester: node,
         };
 
-        context.scheduler.execute(command).then((result) => {
+        return context.scheduler.execute(command).then((result) => {
             // if request return empty json, WFSProvider.getFeatures return undefined
             result = result[0];
             if (result) {

src/Provider/PointCloudProvider.js

@@ -260,8 +260,6 @@ export default {
                 return parseOctree(layer, layer.metadata.hierarchyStepSize, { baseurl: `${layer.url}/${layer.metadata.octreeDir}/r`, name: '', bbox });
             })
             .then((root) => {
-                // eslint-disable-next-line no-console
-                console.log('LAYER metadata:', root);
                 layer.root = root;
                 root.findChildrenByName = findChildrenByName.bind(root, root);
                 layer.extent = Extent.fromBox3(view.referenceCrs, root.bbox);

test/unit/3dtilesprocess.js

@@ -0,0 +1,56 @@
+/* global process */
+import assert from 'assert';
+import { Group } from 'three';
+import GeometryLayer from 'Layer/GeometryLayer';
+import View from 'Core/View';
+import GlobeView from 'Core/Prefab/GlobeView';
+import HttpsProxyAgent from 'https-proxy-agent';
+import CameraUtils from 'Utils/CameraUtils';
+import Coordinates from 'Core/Geographic/Coordinates';
+import Renderer from './mock';
+
+const renderer = new Renderer();
+
+const coordinatesOnGlobe = new Coordinates('EPSG:4326', -75.6134910, 40.0442592, 0);
+const threedTilesLayer = new GeometryLayer('3d-tiles-discrete-lod', new Group());
+
+threedTilesLayer.name = 'DiscreteLOD';
+threedTilesLayer.url = 'https://raw.githubusercontent.com/AnalyticalGraphicsInc/3d-tiles-samples/master/tilesets/TilesetWithDiscreteLOD/tileset.json';
+threedTilesLayer.protocol = '3d-tiles';
+threedTilesLayer.overrideMaterials = true;  // custom cesium shaders are not functional
+
+if (process.env.HTTPS_PROXY) {
+    threedTilesLayer.networkOptions = { agent: new HttpsProxyAgent(process.env.HTTPS_PROXY) };
+}
+
+const viewer = new GlobeView('EPSG:4326', coordinatesOnGlobe, { renderer, noControls: true });
+
+const p = { coord: coordinatesOnGlobe, heading: -145, range: 200, tilt: 10 };
+CameraUtils.transformCameraToLookAtTarget(viewer, viewer.camera.camera3D, p);
+
+// viewer.controls.lookAtCoordinate({ range: 200, tilt: 10, heading: -145 }, false);
+const context = {
+    camera: viewer.camera,
+    engine: viewer.mainLoop.gfxEngine,
+    scheduler: viewer.mainLoop.scheduler,
+    geometryLayer: threedTilesLayer,
+    view: viewer,
+};
+
+describe('3Dtiles layer', function () {
+    it('Add 3dtiles layer', function (done) {
+        View.prototype.addLayer.call(viewer, threedTilesLayer).then((layer) => {
+            assert.equal(layer.root.children.length, 1);
+            done();
+        });
+    });
+    it('preUpdate 3dtiles layer', function () {
+        const elements = threedTilesLayer.preUpdate(context, new Set([threedTilesLayer]));
+        assert.equal(elements.length, 1);
+    });
+    it('update 3dtiles layer', function () {
+        const node = threedTilesLayer.root;
+        threedTilesLayer.update(context, threedTilesLayer, node);
+        assert.ok(node.pendingSubdivision);
+    });
+});

test/unit/featureprocess.js

@@ -0,0 +1,88 @@
+import * as THREE from 'three';
+import assert from 'assert';
+import GlobeView from 'Core/Prefab/GlobeView';
+import FeatureProcessing from 'Process/FeatureProcessing';
+import Feature2Mesh from 'Converter/Feature2Mesh';
+import GeometryLayer from 'Layer/GeometryLayer';
+import FileSource from 'Source/FileSource';
+import HttpsProxyAgent from 'https-proxy-agent';
+import Extent from 'Core/Geographic/Extent';
+import OBB from 'Renderer/OBB';
+import TileMesh from 'Core/TileMesh';
+import Renderer from './mock';
+
+const renderer = new Renderer();
+
+const positionOnGlobe = { longitude: 1.5, latitude: 43, altitude: 300000 };
+const div = {};
+const viewer = new GlobeView(div, positionOnGlobe, { renderer });
+
+function extrude() {
+    return 5000;
+}
+
+function color() {
+    return new THREE.Color(0xffcc00);
+}
+
+
+const ariege = new GeometryLayer('ariege', new THREE.Group());
+ariege.update = FeatureProcessing.update;
+ariege.convert = Feature2Mesh.convert({
+    color,
+    extrude,
+});
+
+ariege.source = new FileSource({
+    url: 'https://raw.githubusercontent.com/gregoiredavid/france-geojson/master/departements/09-ariege/departement-09-ariege.geojson',
+    projection: 'EPSG:4326',
+    format: 'application/json',
+    zoom: { min: 0, max: 0 },
+    // extent: new Extent('EPSG:4326', -90, -10, -900, 900),
+});
+
+ariege.source.zoom = 0;
+
+if (process.env.HTTPS_PROXY) {
+    ariege.source.networkOptions = { agent: new HttpsProxyAgent(process.env.HTTPS_PROXY) };
+}
+
+const context = {
+    camera: viewer.camera,
+    engine: viewer.mainLoop.gfxEngine,
+    scheduler: viewer.mainLoop.scheduler,
+    geometryLayer: ariege,
+    view: viewer,
+};
+
+const extent = new Extent('EPSG:4326', 1.40625, 2.8125, 42.1875, 42.1875);
+const geom = new THREE.Geometry();
+geom.OBB = new OBB(new THREE.Vector3(), new THREE.Vector3(1, 1, 1));
+const tile = new TileMesh(geom, new THREE.Material(), viewer.tileLayer, extent, 7);
+tile.parent = {};
+
+describe('Layer with Feature process', function () {
+    it('add layer', function (done) {
+        viewer.addLayer(ariege).then((layer) => {
+            assert.ok(layer);
+            done();
+        });
+    });
+    it('update', function (done) {
+        viewer.tileLayer.whenReady.then(() => {
+            tile.visible = true;
+            ariege.update(context, ariege, tile).then(() => {
+                // Hack to force add Mesh to tile
+                // Feature Processing needs refactoring to simplify it.
+                tile.layerUpdateState[ariege.id] = undefined;
+                ariege.source.parsedData.extent.crs = 'EPSG:4326';
+                ariege.source.parsedData.extent.set(0, 10, 40, 50);
+                ariege.update(context, ariege, tile).then(() => {
+                    assert.equal(tile.children.length, 1);
+                    done();
+                });
+            });
+        });
+    });
+});
+

test/unit/globecontrol.js

@@ -0,0 +1,78 @@
+import * as THREE from 'three';
+import assert from 'assert';
+import GlobeView from 'Core/Prefab/GlobeView';
+import Renderer from './mock';
+
+const renderer = new Renderer();
+
+const positionOnGlobe = { longitude: 2.351323, latitude: 48.856712, altitude: 250000 };
+const viewer = new GlobeView('EPSG:4326', positionOnGlobe, { renderer });
+
+const event = {
+    stopPropagation: () => {},
+    preventDefault: () => {},
+    button: THREE.MOUSE.LEFT,
+};
+
+describe('GlobeControls', function () {
+    it('instance GlobeControls', function () {
+        assert.ok(viewer.controls);
+    });
+    it('Set Tilt', function (done) {
+        viewer.controls.setTilt(10, false).then((e) => {
+            assert.equal(e.tilt, 10);
+            done();
+        });
+    });
+    it('update', function () {
+        viewer.controls._mouseToPan(10, 10);
+        viewer.controls.update();
+    });
+    it('mouse down', function (done) {
+        renderer.domElement.emitEvent('mousedown', event).then(() => {
+            renderer.domElement.emitEvent('mousemove', event);
+            renderer.domElement.emitEvent('mouseup', event);
+            done();
+        });
+    });
+    it('dolly', function () {
+        viewer.controls.dollyIn();
+        viewer.controls.dollyOut();
+    });
+    it('mouse down + crtl', function (done) {
+        event.keyCode = 17;
+        renderer.domElement.emitEvent('keydown', event).then(() => {
+            renderer.domElement.emitEvent('mousedown', event).then(() => {
+                renderer.domElement.emitEvent('mousemove', event);
+                renderer.domElement.emitEvent('mouseup', event);
+                renderer.domElement.emitEvent('keyup', event);
+                done();
+            });
+        });
+    });
+    it('mouse wheel', function (done) {
+        renderer.domElement.emitEvent('mousewheel', event).then(() => {
+            done();
+        });
+    });
+    it('mouse dblclick', function (done) {
+        renderer.domElement.emitEvent('dblclick', event).then(() => {
+            done();
+        });
+    });
+
+    event.touches = [1, 1];
+    it('touch start', function (done) {
+        renderer.domElement.emitEvent('touchstart', event).then(() => {
+            done();
+        });
+    });
+
+    it('touch move', function () {
+        renderer.domElement.emitEvent('touchmove', event);
+    });
+
+    it('touch end', function () {
+        renderer.domElement.emitEvent('touchend', event);
+    });
+});