Release 0.0.1

.circleci/config.yml

@@ -7,15 +7,16 @@ aliases:
   # https://github.com/CircleCI-Public/circleci-dockerfiles/tree/master/node/images
   - &use_docker_node
     docker:
-      - image: circleci/node:13.2.0-stretch
+      - image: circleci/node:13.4.0-stretch
 
   - &use_docker_node_browsers
     docker:
-      - image: circleci/node:13.2.0-stretch-browsers
+      - image: circleci/node:13.4.0-stretch-browsers
 
   # https://github.com/cypress-io/cypress-docker-images/tree/master/included
   - &use_docker_cypress_included
     docker:
+      # 3.8.0 fails with `Error: write EPIPE` when running `benchmark`!?
       - image: cypress/included:3.7.0
 
   - &workspace ~/talus

.github/delete-merged-branch-config.yml

@@ -0,0 +1,3 @@
+exclude:
+  - master
+  - develop

README.md

@@ -53,11 +53,18 @@ This project was generated using [Nx](https://nx.dev) with the following command
    - https://github.com/nvm-sh/nvm#installation-and-update
 2. Install (latest) `node`
    - `nvm install node`
-   - or add a version `nvm install 12.3.1`
-   - set a version as default `nvm alias default 12.3.1`
+   - or add a version `nvm install 13.4.0`
+   - set a version as default `nvm alias default 13.4.0`
 
 ### Yarn
 
+#### Manually
+
+1. Install `yarn`
+   - https://yarnpkg.com/lang/en/docs/install/#debian-stable
+
+#### With brew
+
 1. Install `yarn`
    - `brew install yarn`
 2. Update
@@ -94,17 +101,33 @@ Setting up a macro which will fix all the linting issues, optimizes the imports
      - Working Dir: `$FileDir$`
      - Advanced Options: None, all deactivated
 
-2. Record macro in this order
+2. Record macro (Edit > Macros > Start Macro Recording) in this order
 
-   - Action: TsLintFileFixAction
+   - Action: TsLintFileFixAction (with opened \*.ts file)
    - Action: OptimizeImports
    - Action: ReformatWithPrettierAction
-   - Action: FileWatcher.runForFiles
+   - Action: FileWatcher.runForFiles (with opened \*.scss file)
    - Action: SaveAll
 
 3. Save macro as e.g. `Fix & Save`
 
-4. Assign Keyboard shortcut `Ctrl` + `S` to macro `Fix & Save`
+4. Assign Keyboard shortcut `Ctrl` + `S` to macro `Fix & Save` (search for macro)
+
+### Git
+
+1. Make sure that `git-completion` is working, otherwise run:
+   `sudo apt-get install git-core bash-completion`
+
+2. Add branch name to shell
+   - Download & save
+     [git-prompt.sh](https://github.com/git/git/blob/master/contrib/completion/git-prompt.sh)
+   - Add in `.bashrc`:
+     ```
+     # GIT prompt
+     . ~/Projects/git-prompt.sh
+     export GIT_PS1_SHOWDIRTYSTATE=1
+     export PS1='\[\e[1;32m\]\u\[\e[m\]@\[\e[33m\]\h\[\e[m\]:\[\e[34m\]\w\[\e[m\]$(__git_ps1 " (%s)")\$ '
+     ```
 
 ## Build
 
@@ -126,6 +149,9 @@ Setting up a macro which will fix all the linting issues, optimizes the imports
   installed in order to be able to run Cypress locally.
 - `yarn e2e <frontend-e2e>`
 
+When updating Cypress version in `package.json` the version in `.circleci/config.yml` needs to be
+updated as well.
+
 ## Nx
 
 ### Update

apps/frontend/jest.config.js

@@ -19,4 +19,8 @@ module.exports = {
     'jest-preset-angular/AngularSnapshotSerializer.js',
     'jest-preset-angular/HTMLCommentSerializer.js',
   ],
+  // https://github.com/nrwl/nx/issues/1439#issuecomment-561268656
+  // When using `Run test` directly in WebStorm, change the used config to
+  // this file i.e. `./frontend/jest.config.js` and not `<rootDir>/jest.config.js`.
+  setupFilesAfterEnv: ['./src/test-setup.ts'],
 };

apps/frontend/src/app/scene-viewer-container/grid.service.ts

@@ -20,7 +20,7 @@ export class GridService {
     this.accessor.setValueOff(xyz, this.grid.background);
   }
 
-  computeMesh(): MeshData {
+  computeMesh(): MeshData | undefined {
     return gridToMesh(this.grid);
   }
 }

apps/frontend/src/app/scene-viewer-container/scene-viewer-container.component.spec.ts

@@ -4,6 +4,7 @@ import { By } from '@angular/platform-browser';
 import { MemoizedSelector, Store } from '@ngrx/store';
 import { MockStore, provideMockStore } from '@ngrx/store/testing';
 import { PointerButton, PointerPickInfo } from '@talus/ui';
+import { Coord } from '@talus/vdb';
 import { Subject } from 'rxjs';
 import * as fromApp from '../app.reducer';
 import { Tool } from '../tools-panel/tool.model';
@@ -68,31 +69,114 @@ describe('SceneViewerContainerComponent', () => {
     expect(mockStore.dispatch).not.toHaveBeenCalled();
   });
 
-  it('should dispatch `addVoxel` action', () => {
-    const action = addVoxel({ position: [1, 1, 1], value: 42 });
-
-    stubComponent.pointerPick.next({
-      pickedPoint: [1, 1, 1],
-      pointerButton: PointerButton.Main,
-      normal: [0, 0, 1],
-    });
-
-    expect(mockStore.dispatch).toHaveBeenCalledWith(action);
-  });
-
-  it('should dispatch `removeVoxel` action', () => {
-    mockSelectedToolIdSelector.setResult(Tool.RemoveVoxel);
-    mockStore.refreshState();
-    fixture.detectChanges();
-
-    const action = removeVoxel({ position: [1, 1, 1] });
-
-    stubComponent.pointerPick.next({
-      pickedPoint: [1, 1, 1],
-      pointerButton: PointerButton.Main,
-      normal: [0, 0, 1],
-    });
-
-    expect(mockStore.dispatch).toHaveBeenCalledWith(action);
-  });
+  it.each([
+    [
+      [1, 0.2, 0.9],
+      [1, 0.2, 0.9],
+      [1, 0, 0],
+    ],
+    [
+      [0.99999999, 0.2, 0.9],
+      [1, 0.2, 0.9],
+      [1, 0, 0],
+    ],
+    [
+      [0.2, 0.99999999, 0.9],
+      [0.2, 1, 0.9],
+      [0, 1, 0],
+    ],
+    [
+      [0.2, 0.9, 0.0000000001],
+      [0.2, 0.9, 0],
+      [0, 0, 1],
+    ],
+    [
+      [0, 0, -0.999999],
+      [0, 0, -1],
+      [0, 0, 1],
+    ],
+    [
+      [0, -2, -0.999999],
+      [0, -3, -2],
+      [0, 0, -1],
+    ],
+    [
+      [-0, -2, 3],
+      [-0, -3, 2],
+      [0, 0, -1],
+    ],
+    [
+      [0.5, 1.4, -1],
+      [0.5, 1.4, -1],
+      [0, 0, 1],
+    ],
+  ])(
+    'should dispatch `addVoxel` action for %j',
+    (pickedPoint: Coord, position: Coord, normal: Coord) => {
+      const action = addVoxel({ position, value: 42 });
+
+      stubComponent.pointerPick.next({
+        pickedPoint,
+        pointerButton: PointerButton.Main,
+        normal,
+      });
+
+      expect(mockStore.dispatch).toHaveBeenCalledWith(action);
+    },
+  );
+
+  it.each([
+    [
+      [1.0000000000001, 0.5, 0.5],
+      [0, 0.5, 0.5],
+      [1, 0, 0],
+    ],
+    [
+      [0.999999999999, 0.5, 0.5],
+      [1, 0.5, 0.5],
+      [-1, 0, 0],
+    ],
+    [
+      [1.0000000000001, -0.5, 0.5],
+      [1, -1.5, 0.5],
+      [-1, 0, 0],
+    ],
+    [
+      [-0.999999999999, -0.5, 0.5],
+      [-1, -1.5, 0.5],
+      [-1, 0, 0],
+    ],
+    [
+      [-2.0000000000001, -0.5, 0.5],
+      [-3, -1.5, 0.5],
+      [1, 0, 0],
+    ],
+    [
+      [0.5, 0.999999999999, 0.5],
+      [0.5, 0, 0.5],
+      [0, 1, 0],
+    ],
+    [
+      [0.5461420538559825, 0.4841910809236776, -2],
+      [0.5461420538559825, 0.4841910809236776, -2],
+      [0, 0, -1],
+    ],
+  ])(
+    'should dispatch `removeVoxel` action for %j',
+    (pickedPoint: Coord, position: Coord, normal: Coord) => {
+      mockSelectedToolIdSelector.setResult(Tool.RemoveVoxel);
+      mockStore.refreshState();
+      fixture.detectChanges();
+
+      const action = removeVoxel({ position });
+
+      stubComponent.pointerPick.next({
+        pickedPoint,
+        pointerButton: PointerButton.Main,
+        normal,
+      });
+
+      expect(mockStore.dispatch).toHaveBeenCalledWith(action);
+    },
+  );
 });

apps/frontend/src/app/scene-viewer-container/scene-viewer-container.component.ts

@@ -3,7 +3,7 @@ import { ChangeDetectionStrategy, Component, ViewChild } from '@angular/core';
 // import '@babylonjs/core/Rendering/outlineRenderer';
 import { select, Store } from '@ngrx/store';
 import { PointerButton, PointerPickInfo, SceneViewerComponent } from '@talus/ui';
-import { add, Coord } from '@talus/vdb';
+import { Coord } from '@talus/vdb';
 import { Observable } from 'rxjs';
 import * as fromApp from '../app.reducer';
 import { Tool } from '../tools-panel/tool.model';
@@ -44,15 +44,70 @@ export class SceneViewerContainerComponent {
 
     switch (selectedToolId) {
       case Tool.AddVoxel:
-        this.store.dispatch(addVoxel({ position: pickInfo.pickedPoint, value: 42 }));
+        this.store.dispatch(
+          addVoxel({ position: this.calcVoxelToAddPosition(pickInfo), value: 42 }),
+        );
         break;
       case Tool.RemoveVoxel:
-        this.store.dispatch(removeVoxel({ position: pickInfo.pickedPoint }));
+        this.store.dispatch(removeVoxel({ position: this.calcVoxelToRemovePosition(pickInfo) }));
         break;
     }
   }
 
-  private calcNewVoxelPosition(pickInfo: PointerPickInfo): Coord {
-    return add(pickInfo.pickedPoint, pickInfo.normal);
+  private calcVoxelToAddPosition(pickInfo: PointerPickInfo): Coord {
+    const pickedIntegerPoint = this.roundDimensionAlongNormal(pickInfo);
+
+    // VDB removes fractional-part of the coordinate, i.e. 0.54 -> 0.
+    // Therefore, positive numbers are getting rounded down (1.9 -> 1) and
+    // negative numbers are getting rounded up (-0.2 -> 0).
+    // Hence, the subtraction of 1 is needed.
+    const newPoint: Coord = [
+      pickInfo.normal[0] < 0 || (pickInfo.normal[0] === 0 && pickedIntegerPoint[0] < 0)
+        ? pickedIntegerPoint[0] - 1
+        : pickedIntegerPoint[0],
+      pickInfo.normal[1] < 0 || (pickInfo.normal[1] === 0 && pickedIntegerPoint[1] < 0)
+        ? pickedIntegerPoint[1] - 1
+        : pickedIntegerPoint[1],
+      pickInfo.normal[2] < 0 || (pickInfo.normal[2] === 0 && pickedIntegerPoint[2] < 0)
+        ? pickedIntegerPoint[2] - 1
+        : pickedIntegerPoint[2],
+    ];
+
+    return newPoint;
+  }
+
+  private calcVoxelToRemovePosition(pickInfo: PointerPickInfo): Coord {
+    const pickedIntegerPoint = this.roundDimensionAlongNormal(pickInfo);
+
+    const newPoint: Coord = [
+      pickInfo.normal[0] > 0 || (pickInfo.normal[0] === 0 && pickedIntegerPoint[0] < 0)
+        ? pickedIntegerPoint[0] - 1
+        : pickedIntegerPoint[0],
+      pickInfo.normal[1] > 0 || (pickInfo.normal[1] === 0 && pickedIntegerPoint[1] < 0)
+        ? pickedIntegerPoint[1] - 1
+        : pickedIntegerPoint[1],
+      pickInfo.normal[2] > 0 || (pickInfo.normal[2] === 0 && pickedIntegerPoint[2] < 0)
+        ? pickedIntegerPoint[2] - 1
+        : pickedIntegerPoint[2],
+    ];
+
+    return newPoint;
+  }
+
+  /**
+   * Babylon.js returns sometimes a floating instead of integer number for the dimension of
+   * the normal vector of the picked point.
+   * E.g. Click on [1, 0.5, 0.6] on voxel at [0, 0, 0] on its site which has the x-axis as its
+   * normal vector [1, 0, 0], could result in a picking point of something like [0.99999, 0.5, 0.6].
+   * Where in fact it should be [1, 0.5, 0.6].
+   * Since all the voxels are placed on integer positions the dimension of the picked point
+   * needs to be rounded.
+   */
+  private roundDimensionAlongNormal(pickInfo: PointerPickInfo): Coord {
+    return [
+      pickInfo.normal[0] !== 0 ? Math.round(pickInfo.pickedPoint[0]) : pickInfo.pickedPoint[0],
+      pickInfo.normal[1] !== 0 ? Math.round(pickInfo.pickedPoint[1]) : pickInfo.pickedPoint[1],
+      pickInfo.normal[2] !== 0 ? Math.round(pickInfo.pickedPoint[2]) : pickInfo.pickedPoint[2],
+    ];
   }
 }

jest.config.js

@@ -1,5 +1,3 @@
-// const ignoreLibs = ['@babylonjs/core'];
-
 module.exports = {
   testMatch: ['**/+(*.)+(spec|test).+(ts|js)?(x)'],
   transform: {
@@ -11,5 +9,4 @@ module.exports = {
   moduleNameMapper: {
     '@babylonjs': 'babylonjs',
   },
-  // transformIgnorePatterns: [`/node_modules/(?!(${ignoreLibs.join('|')})/)`],
 };

libs/ui/jest.config.js

@@ -19,4 +19,23 @@ module.exports = {
     'jest-preset-angular/AngularSnapshotSerializer.js',
     'jest-preset-angular/HTMLCommentSerializer.js',
   ],
+  // https://github.com/nrwl/nx/issues/1439#issuecomment-561268656
+  // When using `Run test` directly in WebStorm, change the used config to
+  // this file i.e. `./ui/jest.config.js` and not `<rootDir>/jest.config.js`.
+  // Otherwise, following error might occur:
+  // - Cannot find module '@talus/ui'
+  // - Zone is needed for the async() test helper but could not be found.
+  setupFilesAfterEnv: ['./src/test-setup.ts'],
+
+  // https://github.com/thymikee/jest-preset-angular/issues/293#issuecomment-513544717
+  // When using `Run test` directly in WebStorm, the scss couldn't be loaded.
+  // - Error: connect ECONNREFUSED 127.0.0.1:80
+  // - Error: Uncaught (in promise): Failed to load *.component.scss
+  globals: {
+    'ts-jest': {
+      tsConfig: '<rootDir>/tsconfig.spec.json',
+      // stringifyContentPathRegex: '\\.html$',
+      // astTransformers: [require.resolve('jest-preset-angular/InlineHtmlStripStylesTransformer')],
+    },
+  },
 };