From 45e66e5c3fbcfc9c491f5cc6b5756c3c723ef138 Mon Sep 17 00:00:00 2001 From: Helmut Merz Date: Mon, 27 Mar 2023 09:33:33 +0200 Subject: [PATCH] first step of refactoring: separate backend- (API-) specific stuff from generic one --- assets/js/common.ts | 61 ++++++++++++++------------------ assets/js/comp-data.ts | 11 +++--- assets/js/comp-list.ts | 2 +- assets/js/main-xp-bootstrap.ts | 4 +-- assets/js/main-xp-mermaid.ts | 4 +-- assets/js/main.ts | 5 +-- assets/js/settings.ts | 15 ++++---- exampleSite/config.yaml | 1 - layouts/partials/js.html | 3 +- layouts/shortcodes/pv/debug.html | 4 --- 10 files changed, 48 insertions(+), 62 deletions(-) diff --git a/assets/js/common.ts b/assets/js/common.ts index 18d5733..de1f562 100644 --- a/assets/js/common.ts +++ b/assets/js/common.ts @@ -3,30 +3,26 @@ import { createApp } from 'petite-vue' import { Data } from './comp-data' -import { domain, nopoll } from '@params' +import { domain } from '@params' type Config = { - apiurl: string - pollurl: string domain: string itemid: string sid: string iid: string - nopoll: boolean + apiurl: string + pollurl: string } -export function config (api, polling): Config { - const pu = polling ? `${api.path}/${polling.msgbase.join('/')}` : '' - //const urlparams = new URL(location.href).searchParams +export function config (api): Config { + const pu = api.polling ? `${api.path}/${api.polling.msgbase.join('/')}` : '' return { - apiurl: api.path, - pollurl: pu, domain: domain, - //itemid: urlparams.get('id'), itemid: location.hash.substring(1), sid: getSid(), iid: createRandString(1), - nopoll: nopoll + apiurl: api.path, + pollurl: pu, } } @@ -36,8 +32,8 @@ export const pvapp = { for (const comp of components) { appdata[comp.name] = comp } - if (appdata.conf.pollurl && !appdata.conf.nopoll) { - appdata.poll() + if (appdata.conf.pollurl) { + poll(appdata) } createApp(appdata).mount() } @@ -47,22 +43,28 @@ const appdata = { $delimiters: ['{|', '|}'], conf: {} as Config, components: {}, - output: '', // debug output space register, - handle, - poll, - Data + sendMsg } -// App (appdata) methods +// generic App (appdata) methods function register(name: string, comp: any) { this.components[name] = comp } -function handle(msg) { +// specific App (appdata) methods + +export async function sendMsg(basemsg: string[], data: any) { + const url = `${this.conf.apiurl}/${basemsg.join('/')}` + await send(url, this.conf, data) +} + +// common functions + +function handle(app, msg) { const [ domain, action, class_, item ] = msg.path.split('/') - const comp = this.components[class_ || 'data'] + const comp = app.components[class_ || 'data'] if (domain && domain != comp.domain) { return } @@ -71,16 +73,7 @@ function handle(msg) { } } -function poll() { - dopoll(this) -} - -// basic functions - move to api.ts - -export async function sendMsg(conf: Config, basemsg: string[], data: any) { - const url = `${conf.apiurl}/${basemsg.join('/')}` - await send(url, conf, data) -} +// app-specific functions async function send(url: string, conf: Config, data: any) { data._interaction = conf.iid @@ -116,21 +109,21 @@ function getSid(): string { // TODO: clear sid - when? //localStorage.setItem('api.sessionid', '') -async function dopoll(app: typeof appdata) { +async function poll(app: typeof appdata) { const wait_time = 10000 while (true) { try { const res = await(send(app.conf.pollurl, app.conf, {})) const msg = await res.json() - console.log(msg) switch (msg.status) { case 'idle': break case 'data': - app.handle(msg) + console.log('--- poll', msg) + handle(app, msg) break default: - console.log('poll response: ', msg) + console.log('**** poll', msg) await sleep(wait_time) } } catch (error) { diff --git a/assets/js/comp-data.ts b/assets/js/comp-data.ts index 0cbb164..deb1533 100644 --- a/assets/js/comp-data.ts +++ b/assets/js/comp-data.ts @@ -25,7 +25,7 @@ export function Data(name: string, conf: any): object { } //this.components[name] = comp if (comp.state.id) { - sendMsg(this.conf, [domain, 'query', name, comp.state.id], {}) + this.sendMsg([domain, 'query', name, comp.state.id], {}) } return comp } @@ -40,14 +40,13 @@ function handle(domain, action, class_, item, payload: string) { } else if (action === 'response') { // && data.rc == 3) { this.state.id = item window.location.hash = item - sendMsg(this.conf, [this.domain, 'query', this.name, item], {}) + this.sendMsg([this.domain, 'query', this.name, item], {}) } } function exec(action: string) { action = action || this.action const data = this.data - const conf = this.conf let value = '' for (const k of Object.keys(data)) { value += `${k}: ${data[k]}, ` @@ -58,7 +57,7 @@ function exec(action: string) { if (this.state.mode !== 'new') { msgbase.push(this.state.id) } - sendMsg(conf, msgbase, data) + this.sendMsg(msgbase, data) } function initField(name: string, meta: any) { @@ -98,10 +97,12 @@ function setQuery(obj) { function setNew(obj) { for (const key in obj.data) { - obj.data[key] = '' + //obj.data[key] = '' const meta = obj.meta[key] if (meta) { obj.data[key] = meta.default || '' + } else { + delete obj.data[key] } } } diff --git a/assets/js/comp-list.ts b/assets/js/comp-list.ts index 360cb5f..2ac9276 100644 --- a/assets/js/comp-list.ts +++ b/assets/js/comp-list.ts @@ -21,7 +21,7 @@ export function List(name: string, conf: any): object { initField // initialize field (= @mounted) } this.components[name] = comp - sendMsg(this.conf, [domain, 'query', name], {}) + this.sendMsg([domain, 'query', name], {}) return comp } diff --git a/assets/js/main-xp-bootstrap.ts b/assets/js/main-xp-bootstrap.ts index db0f492..5037e79 100644 --- a/assets/js/main-xp-bootstrap.ts +++ b/assets/js/main-xp-bootstrap.ts @@ -1,7 +1,7 @@ import * as bootstrap from 'bootstrap' export { bootstrap } -import { api, polling } from './settings' +import { api } from './settings' import { config, pvapp } from './common' -pvapp.run(config(api, polling), []) +pvapp.run(config(api), []) diff --git a/assets/js/main-xp-mermaid.ts b/assets/js/main-xp-mermaid.ts index 2dcd367..827dca6 100644 --- a/assets/js/main-xp-mermaid.ts +++ b/assets/js/main-xp-mermaid.ts @@ -1,7 +1,7 @@ import mermaid from 'mermaid' -import { api, polling } from './settings' +import { api } from './settings' import { config, pvapp } from './common' mermaid.initialize({ startOnLoad: true }) -pvapp.run(config(api, polling), []) +pvapp.run(config(api), []) diff --git a/assets/js/main.ts b/assets/js/main.ts index 8fc1c03..709c21e 100644 --- a/assets/js/main.ts +++ b/assets/js/main.ts @@ -1,6 +1,7 @@ -import { api, polling } from './settings' +import { api } from './settings' import { config, pvapp } from './common' +import { Data } from './comp-data' import { List } from './comp-list' -pvapp.run(config(api, polling), [List]) +pvapp.run(config(api), [Data, List]) diff --git a/assets/js/settings.ts b/assets/js/settings.ts index 7ed65af..3fdf992 100644 --- a/assets/js/settings.ts +++ b/assets/js/settings.ts @@ -1,12 +1,9 @@ export const api = { - path: '/api' -} - -//export const polling = null // suppress polling - -export const polling = { - //msgbase: ['system', 'poll', 'service', 'pclt-0001'] - msgbase: ['system', 'poll', 'session'] - //msgbase: ['system', 'poll', 'interaction'] + path: '/api', + polling: { + //msgbase: ['system', 'poll', 'service', 'pclt-0001'] + msgbase: ['system', 'poll', 'session'] + //msgbase: ['system', 'poll', 'interaction'] + } } diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml index 2818b79..43e8051 100644 --- a/exampleSite/config.yaml +++ b/exampleSite/config.yaml @@ -28,7 +28,6 @@ params: api: domain: demo module: main.ts - nopoll: false taxonomies: domain: domains diff --git a/layouts/partials/js.html b/layouts/partials/js.html index ab140cb..506740f 100644 --- a/layouts/partials/js.html +++ b/layouts/partials/js.html @@ -1,6 +1,5 @@ {{- if $jsmod := $.Param "api.module" -}} - {{- $params := dict "domain" .Site.Params.api.domain - "nopoll" .Site.Params.api.nopoll | default false -}} +{{- $params := dict "domain" .Site.Params.api.domain -}} {{- $js := resources.Get (printf "js/%s" $jsmod) | js.Build ( dict "minify" false "params" $params) -}} diff --git a/layouts/shortcodes/pv/debug.html b/layouts/shortcodes/pv/debug.html index 1dd814e..941ea77 100644 --- a/layouts/shortcodes/pv/debug.html +++ b/layouts/shortcodes/pv/debug.html @@ -8,8 +8,4 @@
interaction id: {| conf.iid |}
-
-

-
-