Initial commit

www/js/chat-veilig.js

@@ -0,0 +1,54 @@
+import { database, alleenIngelogd } from "./index.js";
+
+alleenIngelogd();
+
+// Berichten versturen
+/** @type {HTMLFormElement} */
+const formulier = document.getElementById('verstuurform');
+
+formulier.addEventListener('submit', async (event) => {
+    event.preventDefault();
+    const gegevens = new FormData(formulier);
+    await verstuurBericht(gegevens.get('bericht'))
+    formulier.reset();
+});
+
+async function verstuurBericht(bericht) {
+    await database.collection('berichten').create({
+        afzender: database.authStore.record.id,
+        bericht
+    });
+}
+
+// Laad 20 nieuwste berichten in, soorteer bij verstuurd (hoog naar laag)
+const berichten = await database.collection('berichten_bekijken').getList(1, 20, {
+    sort: '-verstuurd'
+});
+
+const berichtenlijst = document.getElementById('berichten');
+
+let berichtenHtml = [];
+
+berichten.items.forEach(bericht => {
+    berichtenHtml.push(`<article>
+        <h3>${bericht.naam}</h3>
+        <p>${bericht.verstuurd}</p>
+        <h5>${bericht.bericht}</h5>
+        </article>`);
+});
+
+berichtenlijst.innerHTML = berichtenHtml.join('\n');
+
+// Schrijf in op nieuwe berichten (Create) en werk dan de berichtenlijst bij
+// Helaas kan dit niet, subscriben op een view...
+database.collection('berichten_bekijken').subscribe('*', function(event) {
+    const bericht = event.record;
+    berichtenlijst.innerHTML = `<article>
+        <h3>${bericht.naam}</h3>
+        <p>${bericht.verstuurd}</p>
+        <h5>${bericht.bericht}</h5>
+        </article>` + '\n' + berichtenlijst.innerHTML;
+}, {
+    expand: 'afzender'
+});
+