refactor: common base template for pages

will allow to add common header and stuff
This commit is contained in:
efim
2023-11-13 05:25:02 +00:00
parent b1f2e896b9
commit 1297fcf35d
8 changed files with 140 additions and 55 deletions

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<title>Room {{ .Room.Name }} : Some Automoderation</title>
<title>Should be set in base template</title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
@@ -21,7 +21,7 @@
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<!-- Place favicon.ico in the root directory -->
</head>
<body class="h-screen">
<body>
<!--[if lt IE 8]>
<p class="browserupgrade">
You are using an <strong>outdated</strong> browser. Please
@@ -29,36 +29,41 @@
your experience.
</p>
<![endif]-->
<div class="h-full w-full grid">
<script src="https://unpkg.com/htmx.org/dist/ext/sse.js"></script>
<div
id="roomTextContainer"
class="bg-blue-200"
hx-ext="sse"
sse-connect="/rooms/subscribe?roomName={{ .Room.Name }}"
>
{{ block "simpleRoomShow" .Room }}
<!-- TODO use template, not block, have only 'loader' in base place -->
<!-- use different template based on 'mobile' query param -->
<div sse-swap="message">{{ . }}</div>
{{ end }}
</div>
<div id="controls" class="bg-green-300">
<p>Room name is "{{ .Room.Name }}"</p>
{{ range .Gestures }}
<button
hx-get="{{ .Url }}"
class="bg-white rounded border-blue-700 border-2"
{{ define "main-content" }}
<main class="h-screen">
<div class="h-full w-full grid">
<script src="https://unpkg.com/htmx.org/dist/ext/sse.js"></script>
<div
id="roomTextContainer"
class="bg-blue-200"
hx-ext="sse"
sse-connect="/rooms/subscribe?roomName={{ .Room.Name }}"
>
{{ .Name }}
</button>
{{ end }}
<button hx-get="/rooms/releaseHand"
class="bg-white rounded border-yellow-700 border-4"
>
Release Hand
</button>
{{ block "simpleRoomShow" .Room }}
<!-- TODO use template, not block, have only 'loader' in base place -->
<!-- use different template based on 'mobile' query param -->
<div sse-swap="message">{{ . }}</div>
{{ end }}
</div>
<div id="controls" class="bg-green-300">
<p>Room name is "{{ .Room.Name }}"</p>
{{ range .Gestures }}
<button
hx-get="{{ .Url }}"
class="bg-white rounded border-blue-700 border-2"
>
{{ .Name }}
</button>
{{ end }}
<button
hx-get="/rooms/releaseHand"
class="bg-white rounded border-yellow-700 border-4"
>
Release Hand
</button>
</div>
</div>
</div>
</main>
{{ end }}
</body>
</html>