Refactor of how segments are added to the map (#24)

* refactor mapbox client

* reorder imports

* minor documentation

* unnecessary property for point

* fix tests

* and this

* additional refactoring for segments

* readme

* rename the instance too

* const here

* next up, localStorage

* comment

* whoops

* bump to latest action versions

* attempt composite actions to reduce duplication

* non-relative paths?

* maybe not in a subdirectory?

* another oof

* oh well

* can't believe you've done this

.github/workflows/ci.yml

@@ -10,7 +10,7 @@ jobs:
 
     steps:
     - name: Setup node
-      uses: actions/setup-node@v1.1.0
+      uses: actions/setup-node@v1.4.4
 
     - name: Checkout code
       uses: actions/checkout@v2
@@ -19,4 +19,4 @@ jobs:
       run: npm i
 
     - name: Run unit tests
-      run: npm run test
+      run: npm run test

.github/workflows/main.yml

@@ -10,7 +10,7 @@ jobs:
 
     steps:
     - name: Setup node
-      uses: actions/setup-node@v1.1.0
+      uses: actions/setup-node@v1.4.4
 
     - name: Checkout code
       uses: actions/checkout@v2
@@ -19,4 +19,4 @@ jobs:
       run: npm i
 
     - name: Run unit tests
-      run: npm run test
+      run: npm run test

README.md

@@ -32,6 +32,7 @@ Use it for planning a route, or getting a sense of your route after a workout.
 
 ## Changelog
 
+- 11/28/20: Refactored a bit to better abstract out mapbox API, localStorage interactions
 - 6/14/20: Updates to the testing experience, take advantage of existing libraries to simplify things
 - 3/28/20: Audits, enabled Github workflows, also added extra accessiblity/aria context
 - 8/13/19: Allowed selecting map visual style

src/animation-controller.ts → src/animation-service.ts

@@ -8,7 +8,7 @@ import { FeatureCollection, LineString } from 'geojson';
  * the length of the line. Requests while drawing will complete the
  * current animation, then kick off the next segment.
  */
-export class AnimationController {
+export class AnimationService {
   private map: Map;
 
   private animationFrame: number;

src/current-run.spec.ts

@@ -1,16 +1,16 @@
 import { CurrentRun, RunStart, RunSegment } from './current-run';
-import { LngLat, Point, Marker } from 'mapbox-gl';
+import { LngLat, Marker } from 'mapbox-gl';
 import { LineString } from 'geojson';
 
 describe('CurrentRun class', () => {
   it('should initialize with a run start', () => {
-    let start = new RunStart({} as LngLat, {} as Point);
+    let start = new RunStart({} as LngLat);
     let currentRun = new CurrentRun(start);
     expect(currentRun.distance).toBe(0, 'No segments should be added with just a run start.');
   });
 
   it('should allow setting and updating a marker', () => {
-    let start = new RunStart({} as LngLat, {} as Point);
+    let start = new RunStart({} as LngLat);
     let marker = getMockMarker();
     spyOn(marker, 'remove').and.stub();
     start.setMarker(marker);
@@ -21,38 +21,38 @@ describe('CurrentRun class', () => {
   });
 
   it('updates with a new RunSegment', () => {
-    let currentRun = new CurrentRun(new RunStart({} as LngLat, {} as Point));
+    let currentRun = new CurrentRun(new RunStart({} as LngLat));
 
     let initialExpectedDistance = 500;
-    let firstSegment = new RunSegment('some-uuid', {} as LngLat, {} as Point, initialExpectedDistance, {} as LineString);
+    let firstSegment = new RunSegment('some-uuid', {} as LngLat, initialExpectedDistance, {} as LineString);
     let marker = getMockMarker();
     currentRun.addSegment(firstSegment, marker);
 
     expect(currentRun.distance).toBe(initialExpectedDistance, 'Distance was not set correctly from the distance response.');
     expect(firstSegment.marker).toBe(marker);
 
     let secondDistance = 1337;
-    let secondSegment = new RunSegment('different-uuid', {} as LngLat, {} as Point, secondDistance, {} as LineString);
+    let secondSegment = new RunSegment('different-uuid', {} as LngLat, secondDistance, {} as LineString);
     currentRun.addSegment(secondSegment, getMockMarker());
     expect(currentRun.distance).toBe(initialExpectedDistance + secondDistance, 'Distance did not correctly add the incoming distance response value.');
   });
 
   it('gets the start\'s LngLat', () => {
     let expectedLngLat = { lng: 101, lat: 202 } as LngLat;
-    let runStart = new RunStart(expectedLngLat, {} as Point);
+    let runStart = new RunStart(expectedLngLat);
     let currentRun = new CurrentRun(runStart);
 
     let lastPosition = currentRun.getLastPosition();
     expect(lastPosition).toEqual(expectedLngLat, 'Run start LngLat was not correctly retrieved.');
   });
 
   it('removes the last run segment and decrements distance correctly', () => {
-    let runStart = new RunStart({} as LngLat, {} as Point);
+    let runStart = new RunStart({} as LngLat);
     let currentRun = new CurrentRun(runStart);
 
     let expectedLngLat = { lng: 101, lat: 202 } as LngLat;
     let expectedDistance = 100;
-    let segment = new RunSegment('some-uuid', expectedLngLat, {} as Point, expectedDistance, {} as LineString);
+    let segment = new RunSegment('some-uuid', expectedLngLat, expectedDistance, {} as LineString);
     let marker = getMockMarker();
     spyOn(marker, 'remove').and.stub();
     currentRun.addSegment(segment, marker);
@@ -71,7 +71,7 @@ describe('CurrentRun class', () => {
   });
 
   it('does not remove the run start', () => {
-    let currentRun = new CurrentRun(new RunStart({} as LngLat, {} as Point));
+    let currentRun = new CurrentRun(new RunStart({} as LngLat));
     let removed = currentRun.removeLastSegment();
     expect(removed).toBeUndefined('Removing the last point should return undefined (no segments to remove).');
   });

src/current-run.ts

@@ -1,14 +1,12 @@
-import { LngLat, Point, Marker } from 'mapbox-gl';
+import { LngLat, Marker } from 'mapbox-gl';
 import { LineString } from 'geojson';
 
 export class RunStart {
   public lngLat: LngLat;
-  public point: Point;
   public marker: Marker;
 
-  constructor(lngLat: LngLat, point: Point) {
+  constructor(lngLat: LngLat) {
     this.lngLat = lngLat;
-    this.point = point;
   }
 
   public setMarker(newMarker: Marker) {
@@ -25,8 +23,8 @@ export class RunSegment extends RunStart {
   public distance: number; // in meters
   public geometry: LineString;
 
-  constructor(id: string, lngLat: LngLat, point: Point, distance: number, geometry: LineString) {
-    super(lngLat, point);
+  constructor(id: string, lngLat: LngLat, distance: number, geometry: LineString) {
+    super(lngLat);
     this.id = id;
     this.distance = distance;
     this.geometry = geometry;