Create page via js/event

[kater]

I have visitors watching a stream and basically submit their attendance via a tracker.
Click on button: "I'm here" -> create log-page.
Click on button: "I'm out" -> add field value to this log-page.

However, visitors are watching a stream or video an reloading the page would likely stop it and bloat other logs.
For internal processing it would be nice to just have pw pages available rather than external logs/db.

Is there a way to call pages api by js event?

thanks!

[kongondo]

On 11/6/2021 at 2:49 PM, kater said:

Is there a way to call pages api by js event?

Yes. Using Ajax. There are many way to send an Ajax request to the server: vanilla JavaScript, jQuery (?), Axios, htmx ?...etc. A workflow like this maybe:

1. Create buttons of type 'button' - to avoid them submitting the form normally.
2. Choose the client-side library (or pure JS) that will to talk to the server.
3. Listen to the click events on the buttons.
4. I would probably toggle the buttons.
5. User clicks on I am here: this sends an ajax request to your server.
6. Create a session (or if you wanted, a cookie) to 'register' the user's presence. Populate your log-page.
7. Send back a response to client, toggling the I am here button to a I am out button. This would be trivial if using htmx.
8. User leaves: delete their session in #6. Amend your log-page.
9. If stream still continuing, show I am here button.
10. Stream ends: clear all sessions from #6.

Something along those lines, assuming I understood your question ?.

[kater]

Thanks kongondo!

Pretty much did that but by populating the log file.

I wasnt able to use the API from within the js (by just doing it) for following reason:
in this install useFunctionsApi was disabled and $page() used.
*facepalm*

Just browsing htmx ... awesome. thanks for the hint!

cheers