Blog/Components/Pages/Query.razor.js 1.9 K · 69 lines · raw · history

1 import {getById, writeError, h, span, addClass, div} from '/common.module.js'
2 import {DACTAL} from "/dactal.js"
3
4 const enterEvent = new KeyboardEvent('keydown', {
5 key: 'Enter',
6 code: 'Enter',
7 keyCode: 13,
8 which: 13,
9 bubbles: true,
10 cancelable: true
11 });
12
13 let dactal
14
15 export async function onLoad() {
16 const input = getById("input")
17 dactal = new DACTAL()
18
19 const brp = await fetch("/brp.json")
20 const cdata = await brp.json()
21
22 dactal.data = {
23 personen: cdata
24 }
25
26 input.onkeydown = async (e) => {
27 if (e.key === "Enter" && !e.shiftKey) {
28 e.preventDefault()
29
30 try {
31 let result = await dactal.query(input.value)
32
33 const results = getById("results")
34 results.replaceChildren(renderValue(result.slice(0, 100)))
35
36 if (result.length > 100) {
37 results.appendChild(div(span(`Not showing ${result.length - 100} more results.`)))
38 }
39 } catch (e) {
40 writeError(e.message)
41 results.replaceChildren()
42 }
43 }
44 }
45
46 input.dispatchEvent(enterEvent)
47 }
48
49 function renderValue(obj) {
50 if (Array.isArray(obj)) {
51 return h("ol",
52 ...obj.map((item) => h("li", renderValue(item)))
53 )
54 } else if (typeof obj === "object") {
55 return h("ul",
56 ...Object.entries(obj).map(([name, item]) =>
57 addClass(h("li",
58 addClass(span(name), "name"),
59 span(" "),
60 renderValue(item)),
61 "dash")))
62 } else if (typeof obj === "boolean") {
63 return addClass(span(obj), obj ? "json-true" : "json-false")
64 } else if (typeof obj === "number") {
65 return addClass(span(obj), "json-number")
66 } else if (typeof obj === "string") {
67 return span(obj)
68 }
69 }