Storing track points independently from their tracks (#3). Also adding some basic tests for gpx database operations.

src/App.tsx

@@ -3,7 +3,7 @@ import { IonApp, setupIonicReact } from '@ionic/react';
 import store from './store/index';
 import { Provider } from 'react-redux';
 import { Suspense } from 'react';
-import { PouchDB, Find } from 'react-pouchdb';
+import { PouchDB } from 'react-pouchdb';
 
 /* Core CSS required for Ionic components to work properly */
 import '@ionic/react/css/core.css';

src/db/gpx.test.ts

@@ -0,0 +1,50 @@
+import { initDb } from '.';
+import PouchDB from 'pouchdb';
+import { appendTrkpt } from './gpx';
+
+import PouchDBFind from 'pouchdb-find';
+import { mkdtempSync, rmdirSync } from 'fs';
+import { join } from 'path';
+import { tmpdir } from 'os';
+PouchDB.plugin(PouchDBFind);
+//PouchDB.plugin(require('pouchdb-find'));
+
+// export class PouchService {
+//     constructor() {
+//         PouchDB.plugin(PouchDBFind);
+//     }
+// }
+
+// jest.useFakeTimers();
+
+const tmpDir = mkdtempSync(join(tmpdir(), 'dyomedea-testDB'));
+
+var db: PouchDB.Database;
+
+beforeEach(async () => {
+  db = new PouchDB(tmpDir);
+  await initDb(db, () => {});
+});
+
+afterEach(async () => {
+//  await db.close();
+  await db.destroy();
+});
+
+describe('Checking that trkpts are beeing inserted', () => {
+  test('and that we have two documents after the first call', async () => {
+    await appendTrkpt(db, {});
+    const results = await db.find({ selector: {} });
+    const docs = results.docs;
+    //        console.log(`docs: ${JSON.stringify(docs)}`);
+    expect(docs.length).toBe(2);
+  });
+  test('and that we have three documents after the second call', async () => {
+    await appendTrkpt(db, {});
+    await appendTrkpt(db, {});
+    const results = await db.find({ selector: {} });
+    const docs = results.docs;
+    console.log(`docs: ${JSON.stringify(docs)}`);
+    expect(docs.length).toBe(3);
+  });
+});

src/db/gpx.ts

@@ -3,6 +3,7 @@ import {
   string_to_bytes,
   bytes_to_base64,
 } from '@openpgp/asmcrypto.js';
+import { documentSharp } from 'ionicons/icons';
 
 export const pushGpx = async (db: any, payload: any) => {
   const gpxString = JSON.stringify(payload.gpx);
@@ -41,7 +42,7 @@ export const pushGpx = async (db: any, payload: any) => {
 
   prune(gpx);
 
-  const doc = { ...payload, _id, type: 'gpx', gpx };
+  const doc = { ...payload, _id, type: 'gpx', subtype: 'other', gpx };
   console.log(JSON.stringify(doc));
   await db.put(doc);
 
@@ -55,10 +56,10 @@ export const pushGpx = async (db: any, payload: any) => {
 
 const CURRENT_GPX = '---current gpx---';
 
-const initialTrack = {
-  _id: CURRENT_GPX,
-  type: 'GPX',
-  track: {
+const initialGpx = {
+  type: 'gpx',
+  subtype: 'current',
+  gpx: {
     $: {
       version: '1.1',
       creator: 'dyomedea version 0.000001',
@@ -92,29 +93,28 @@ const initialTrack = {
 };
 
 export const appendTrkpt = async (db: any, trkpt: any) => {
-  var track: any;
-  await db
-    .get(CURRENT_GPX)
-    .then((result: any) => {
-      track = result;
-    })
-    .catch((error: any) => {
-      if ((error.status = '404')) {
-        track = initialTrack;
-      } else {
-        console.log(`db.get(CURRENT_TRACK), ERROR: ${JSON.stringify(error)}`);
-        alert(`db.get(CURRENT_TRACK), ERROR: ${JSON.stringify(error)}`);
-      }
-    });
-  track.metadata.lastModified = trkpt.time;
-  const currentTrkseg = track.track.trk.at(-1).trkseg.at(-1);
-  currentTrkseg.trkpt.push(trkpt);
-  db.put(track)
-    .then((response: any) => {
-      console.log(`db.put(track), response: ${JSON.stringify(response)}`);
-    })
-    .catch((error: any) => {
-      console.log(`db.put(CURRENT_TRACK), ERROR: ${JSON.stringify(error)}`);
-      alert(`db.put(CURRENT_TRACK), ERROR: ${JSON.stringify(error)}`);
-    });
+
+
+  const currents = await db.find({
+    selector: {
+      type: 'gpx',
+      subtype: 'current',
+    },
+    fields: ['_id'],
+  });
+  console.log(`appendTrkpt - db.find() : ${JSON.stringify(currents)}`);
+
+  var currentId;
+  if (currents.docs.length > 0) {
+    currentId = currents.docs[0]._id;
+  } else {
+    initialGpx.metadata.lastModified = trkpt.time;
+    initialGpx.gpx.metadata.time = trkpt.time;
+    const response = await db.post(initialGpx);
+    currentId = response.id;
+  }
+  console.log(`currentId: ${currentId}`);
+  const docPoint = { type: 'trkpt', gpx: currentId, trkpt: trkpt };
+  await db.post(docPoint);
+  console.log(JSON.stringify(docPoint));
 };

src/db/index.ts

@@ -21,12 +21,12 @@ export const initDb = async (db: any, setDbReady: any) => {
     }
   }
 
-  // WARNING: defs must use the canonical form andbe identical to what will be returned by db.getIndexes
+  // WARNING: defs must use the canonical form and be identical to what will be returned by db.getIndexes
   const requiredIndexes: any = [
     {
-      name: 'type',
+      name: 'type-subtype',
       def: {
-        fields: [{ type: 'asc' }],
+        fields: [{ type: 'asc' }, { subtype: 'asc' }],
       },
     },
     {
@@ -73,7 +73,7 @@ export const initDb = async (db: any, setDbReady: any) => {
   const indexes = await db.getIndexes();
   console.log(`indexes: ${JSON.stringify(indexes)}`);
 
-  const explain = await db.explain({
+  const explain1 = await db.explain({
     selector: {
       type: 'trkpt',
       gpx: 'xxxx',
@@ -81,5 +81,13 @@ export const initDb = async (db: any, setDbReady: any) => {
     //   sort: ['trkpt.time'],
     // use_index: 'type-trkpt-gpx-time',
   });
-  console.log(`explain: ${JSON.stringify(explain)}`);
+  console.log(`explain1: ${JSON.stringify(explain1)}`);
+  const explain2 = await db.explain({
+    selector: {
+      type: 'gpx',
+    },
+    //   sort: ['trkpt.time'],
+    // use_index: 'type-trkpt-gpx-time',
+  });
+  console.log(`explain2: ${JSON.stringify(explain2)}`);
 };

src/theme/variables.css

@@ -1,12 +1,11 @@
 /* Ionic Variables and Theming. For more info, please see:
 http://ionicframework.com/docs/theming/ */
 
-#background-content {
-  background: transparent;
-}
 
 /** Ionic CSS Variables **/
 :root {
+
+  /** Transparent background so that underlying tiles and whiteboard can be seen **/
   --ion-background-color: transparent;