cl-chat-web/live-chat-core.lisp
2024-10-11 16:45:22 -04:00

71 lines
3.4 KiB
Common Lisp

(in-package #:cl-user)
(in-package #:live-chat-core)
;; (defvar *messages* (make-array 0 :adjustable t :fill-pointer t)
;; "Array to store chat messages.")
(defun handle-post-message (message)
"Handle a new message being posted to the chat."
(insert-message message)
;; (vector-push-extend message *messages*)
(format nil "Message received: ~a" message))
(defun render-chat-messages ()
"Render the list of chat messages as HTML."
(let ((messages (fetch-messages)))
(if messages
(cl-who:with-html-output-to-string (*standard-output* nil :indent t)
(:h3 :class "title is-3" "Chat Messages")
(loop for msg in messages
do (cl-who:htm
(:div :class "box" (cl-who:str msg)))))
"")))
(defun render-chat-ui ()
"Render the main chat page with HTMX integration."
(cl-who:with-html-output-to-string (*standard-output* nil :prologue t :indent t)
(:html :lang "en"
(:head
(:meta :charset "utf-8")
(:meta :name "viewport" :content "width=device-width, initial-scale=1")
(:title "Live Chat")
(:link :rel "stylesheet"
:href "https://cdnjs.cloudflare.com/ajax/libs/bulma/1.0.2/css/bulma.min.css"
:integrity "sha512-RpeJZX3aH5oZN3U3JhE7Sd+HG8XQsqmP3clIbu4G28p668yNsRNj3zMASKe1ATjl/W80wuEtCx2dFA8xaebG5w=="
:crossorigin "anonymous"
:referrerpolicy "no-referrer")
(:script :src "https://cdnjs.cloudflare.com/ajax/libs/htmx/2.0.3/htmx.min.js"
:integrity "sha512-dQu3OKLMpRu85mW24LA1CUZG67BgLPR8Px3mcxmpdyijgl1UpCM1RtJoQP6h8UkufSnaHVRTUx98EQT9fcKohw=="
:crossorigin "anonymous"
:referrerpolicy "no-referrer"))
(:body
(:section :class "section"
(:div :class "container"
(:h1 :class "title" "Live Chat")
;; Form for sending messages
(:form :id "post-message-form"
:name "post-message-form"
:hx-post "/post-message"
:hx-swap "innerHTML"
:hx-target "#chat-messages"
(:div :class "field has-addons"
(:div :class "control is-expanded"
(:input :class "input is-expanded"
:form "post-message-form"
:placeholder "Ender your message..."
:type "text" :name "message"))
(:div :class "control"
(:button :class "button is-link is-light"
:form "post-message-form"
:type "submit" "Send"))))))
;; Chat messages will be updated by HTMX via GET to /chat-messages
(:section :class "section"
(:div :class "container"
:id "chat-messages"
:hx-get "/chat-messages"
:hx-trigger "every 2s"
(cl-who:str (render-chat-messages))))))))