Refactoring to watch WPT updates.

This commit is contained in:
Eric van der Vlist 2022-12-06 14:36:50 +01:00
parent 6465a371cb
commit 5829f93c91
5 changed files with 111 additions and 41 deletions

View File

@ -1,4 +1,9 @@
import { Component, createEffect, createResource } from 'solid-js'; import {
Component,
createEffect,
createResource,
createSignal,
} from 'solid-js';
import dispatch from '../../workers/dispatcher-main'; import dispatch from '../../workers/dispatcher-main';
import VectorSource from 'ol/source/Vector'; import VectorSource from 'ol/source/Vector';
@ -12,15 +17,27 @@ interface Props {
} }
export const Wpt: Component<Props> = ({ vectorSource, wptId: wptId }) => { export const Wpt: Component<Props> = ({ vectorSource, wptId: wptId }) => {
const [wpt] = createResource( const [wpt, setWpt] = createSignal<Wpt>();
wptId,
async () => const wptCallBack = (error: any, result: any) => {
await dispatch({ if (error) {
action: 'getWpt', console.error({ caller: 'wptCallBack', error });
params: { } else {
id: wptId, console.log({ caller: 'wptCallBack', result });
}, setWpt(result);
}) }
};
dispatch(
{
action: 'getAndWatch',
params: {
id: wptId,
method: 'getWpt',
},
},
wptCallBack,
true
); );
createEffect(() => { createEffect(() => {

View File

@ -1,6 +1,46 @@
import { getWpt } from '../db/wpt';
import { returnAgain } from '../workers/dispatcher-worker';
const changeHandler = (change: any) => { declare global {
console.log({caller: 'ChangeHandler', change}); var watches: Map<string, any>;
} }
const methods = {
getWpt,
};
const changeHandler = async (change: any) => {
console.log({ caller: 'ChangeHandler', change });
const { id } = change.id;
if (!globalThis.watches) {
globalThis.watches = new Map();
}
const params = globalThis.watches.get(id);
if (params) {
const { method, _dispatchId, id, ...otherParams } = params;
const returnValue = await methods[<keyof typeof methods>method](params);
if (false) {
returnAgain(_dispatchId, returnValue);
}
}
};
export default changeHandler; export default changeHandler;
export const getAndWatch = async (params: any) => {
const { method, _dispatchId, id, ...otherParams } = params;
if (!globalThis.watches) {
globalThis.watches = new Map();
}
globalThis.watches.set(id, params);
const returnValue = await methods[<keyof typeof methods>method](params);
return returnValue;
};
export const cancelWatch = (params: any) => {
if (!globalThis.watches) {
globalThis.watches = new Map();
}
const { id } = params;
globalThis.watches.delete(id);
};

View File

@ -99,12 +99,8 @@ export const initDb = async (params: any) => {
console.log({ caller: 'initDb / before db.changes' }); console.log({ caller: 'initDb / before db.changes' });
const changes = db const changes = db
.changes({ since: 'now', live: true, include_docs: true }) .changes({ since: 'now', live: true, include_docs: false })
.on('change', changeHandler) .on('change', changeHandler)
// .on('change', (info: any) => {
// console.log({ caller: 'changes / change', info });
// changeHandler(info);
// })
.on('complete', (info: any) => { .on('complete', (info: any) => {
console.log({ caller: 'changes / complete', info }); console.log({ caller: 'changes / complete', info });
}) })
@ -112,7 +108,7 @@ export const initDb = async (params: any) => {
console.log({ caller: 'changes / complete', error }); console.log({ caller: 'changes / complete', error });
}); });
console.log({ caller: 'initDb / back from db.changes', changes }); // console.log({ caller: 'initDb / back from db.changes', changes });
// changes.cancel(); // changes.cancel();

View File

@ -22,8 +22,10 @@ export const init = () => {
payload, payload,
dispatcherQueue: JSON.parse(JSON.stringify(dispatcherQueue)), dispatcherQueue: JSON.parse(JSON.stringify(dispatcherQueue)),
}); });
dispatcherQueue.queue.get(id)(null, payload); dispatcherQueue.queue.get(id).callBack(null, payload);
dispatcherQueue.queue.delete(id); if (!dispatcherQueue.queue.get(id).live) {
cancel(id);
}
}; };
dispatch({ action: 'initDb' }); dispatch({ action: 'initDb' });
@ -31,7 +33,8 @@ export const init = () => {
const dispatch = ( const dispatch = (
payload: any, payload: any,
callBack?: (error: any, result: any) => void callBack?: (error: any, result: any) => void,
live?: boolean
) => { ) => {
console.log({ caller: 'dispatcher-main / dispatch', payload }); console.log({ caller: 'dispatcher-main / dispatch', payload });
if (worker === undefined) { if (worker === undefined) {
@ -50,7 +53,7 @@ const dispatch = (
}); });
} }
/** Otherwise, use the callback function */ /** Otherwise, use the callback function */
dispatcherQueue.queue.set(dispatcherQueue.index, callBack); dispatcherQueue.queue.set(dispatcherQueue.index, { callBack, live });
const message = { const message = {
id: dispatcherQueue.index++, id: dispatcherQueue.index++,
payload: payload, payload: payload,
@ -63,4 +66,8 @@ const dispatch = (
}); });
}; };
export const cancel = (id: number) => {
dispatcherQueue.queue.delete(id);
};
export default dispatch; export default dispatch;

View File

@ -1,5 +1,6 @@
/// <reference lib="webworker" /> /// <reference lib="webworker" />
import { initDb } from '../db'; import { initDb } from '../db';
import { cancelWatch, getAndWatch } from '../db/change-handler';
import { import {
putNewGpx, putNewGpx,
existsGpx, existsGpx,
@ -14,34 +15,43 @@ import { getWpt } from '../db/wpt';
//const self = globalThis as unknown as WorkerGlobalScope; //const self = globalThis as unknown as WorkerGlobalScope;
const actions = { console.log({ caller: 'dispatcher-worker' });
initDb,
putNewGpx,
putNewTrk,
existsGpx,
pruneAndSaveImportedGpx,
getAllGpxes,
getGpxesForViewport,
getGpx,
getTrk,
getTrkseg,
getWpt
};
console.log({ caller: 'dispatcher-worker', actions });
onmessage = async function (e) { onmessage = async function (e) {
const actions = {
initDb,
putNewGpx,
putNewTrk,
existsGpx,
pruneAndSaveImportedGpx,
getAllGpxes,
getGpxesForViewport,
getGpx,
getTrk,
getTrkseg,
getWpt,
getAndWatch,
cancelWatch,
};
console.log({ caller: 'dispatcher-worker / onmessage', e }); console.log({ caller: 'dispatcher-worker / onmessage', e });
const { id, payload } = e.data; const { id, payload } = e.data;
var returnValue: any = 'unknownAction'; var returnValue: any = 'unknownAction';
if (payload.action in actions) { if (payload.action in actions) {
console.log({ caller: 'dispatcher-worker / awaiting', id, payload }); console.log({ caller: 'dispatcher-worker / awaiting', id, payload });
returnValue = await actions[<keyof typeof actions>payload.action]( returnValue = await actions[<keyof typeof actions>payload.action]({
payload.params ...payload.params,
); _dispatchId: id,
});
} }
postMessage({ id: id, payload: returnValue }); postMessage({ id: id, payload: returnValue });
console.log({ caller: 'dispatcher-worker / response sent', id, returnValue }); console.log({ caller: 'dispatcher-worker / response sent', id, returnValue });
}; };
export const returnAgain = (id: number, returnValue: any) => {
console.log({ caller: 'dispatcher-worker / returnAgain', id, returnValue });
postMessage({ id: id, payload: returnValue });
};
//export default self; //export default self;