Don't work

2024-04-21 13:59:43 +02:00
parent ffb1739611
commit 005b9cd41d
14 changed files with 310 additions and 136 deletions
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>JADE 2.0</title>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@1.0.0/css/bulma.min.css">
+</head>
+
+<body>
+    {{ template "navbar" . }}
+
+    {{template "content" .}}
+
+    <script src="https://unpkg.com/htmx.org@1.9.11"></script>
+    <style>
+        .column {
+            display: flex;
+            flex-direction: column;
+        }
+
+        .message {
+            max-width: 90%;
+            margin-bottom: 10px;
+        }
+
+        .user-message {
+            align-self: flex-start;
+        }
+
+        .bot-message {
+            align-self: flex-end;
+        }
+    </style>
+
+</body>
+
+</html>
+
+{{define "navbar"}}
+<nav class="navbar is-primary">
+    <div class="navbar-brand">
+        <a class="navbar-item" href="https://www.bouvai.com">
+            <img src="/bouvai.png">
+        </a>
+    </div>
+    <div class="navbar-menu">
+        <div class="navbar-start">
+            <a class="navbar-item" href="/">
+                Home
+            </a>
+            <a class="navbar-item" href="/chat">
+                Chat
+            </a>
+        </div>
+        <div class="navbar-end">
+        </div>
+    </div>
+</nav>
+{{end}}
@@ -0,0 +1,58 @@
+{{define "user-message"}}
+<article class="message user-message">
+    <div class="message-header">
+        <p>User</p>
+        <form>
+            <input type="hidden">
+            <button class="delete" aria-label="delete"></button>
+        </form>
+    </div>
+    <div class="message-body">
+        {{ .Content }}
+    </div>
+</article>
+{{end}}
+
+{{define "bot-message"}}
+<article class="message bot-message">
+    <div class="message-header">
+        <p>Bot</p>
+        <form>
+            <input type="hidden">
+            <button class="delete" aria-label="delete"></button>
+        </form>
+    </div>
+    <div class="message-body">
+        {{ .Content }}
+    </div>
+</article>
+{{end}}
+
+{{define "chat-input"}}
+<form>
+    <input class="input" type="text" placeholder="Type your message here..." name="message" />
+</form>
+{{end}}
+
+{{define "chat-messages"}}
+<div class="columns is-centered">
+    <div class="column is-half">
+        {{range .Messages}}
+        {{if eq .Role "user"}}
+        {{template "user-message" .Message}}
+        {{else}}
+        {{template "bot-message" .Message}}
+        {{end}}
+        {{end}}
+    </div>
+</div>
+{{end}}
+
+
+{{ define "content" }}
+<div class="chat-container">
+    <h1>Chat Page</h1>
+    {{template "chat-messages" .Messages}}
+    {{template "chat-input"}}
+</div>
+{{ end }}
@@ -0,0 +1,9 @@
+{{define "content"}}
+
+<div class="columns">
+    <div class="column">
+        <h1>Welcome to JADE 2.0!</h1>
+        <h1 id="isMongoDBConnected" hx-get="/isMongoDBConnected" hx-trigger="load" hx-swap="outerHTML"></h1>
+    </div>
+</div>
+{{end}}