88 lines
		
	
	
		
			3.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			88 lines
		
	
	
		
			3.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| {{define "room"}}
 | |
| <div id="interier" hx-get="/" hx-trigger="sse:roomupdate_{{.State.RoomID}}" class=space-y-2>
 | |
|   <div id="meta">
 | |
|     <p>Hello {{.State.Username}};</p>
 | |
|     <p>Room created by {{.Room.CreatorName}};</p>
 | |
|     <p>Room link:</p>
 | |
|     <p><input id="roomlink" readonly="" onclick="copyText()" value="{{.Room.RoomLink}}" class="bg-amber-100 text-black px-1 py-1 rounded"></input></p>
 | |
|     <p>Game is running: {{.Room.IsRunning}}</p>
 | |
|     <p>
 | |
|       {{if and (eq .State.Username .Room.CreatorName) (not .Room.IsRunning)}}
 | |
|         <button hx-get="/start-game" hx-target="#room" class="bg-amber-100 text-black px-4 py-2 rounded">Start Game</button>
 | |
|       {{end}}
 | |
|     </p>
 | |
|     {{if .Room.IsOver}}
 | |
|     <p>GAME OVER; team <span class="text-{{.Room.TeamWon}}-500">{{.Room.TeamWon}}</span> won! 🧚</p>
 | |
|     {{end}}
 | |
|     <p>
 | |
|       {{if eq .State.Team ""}}
 | |
|       join the team!
 | |
|       {{else}}
 | |
|       you're on the team <span class="text-{{.State.Team}}-500">{{.State.Team}}</span>!
 | |
|       {{end}}
 | |
|     </p>
 | |
|   </div>
 | |
|   <hr />
 | |
|   {{if .Room.IsRunning}}
 | |
|     <p>Turn of the <span class="text-{{.Room.TeamTurn}}-500">{{.Room.TeamTurn}}</span> team</p>
 | |
| {{template "turntimer" .Room}}
 | |
|     {{if .Room.MimeDone}}
 | |
|     <p class="text-{{.Room.TeamTurn}}-500 text-xl">Waiting for guessers</p>
 | |
|     <p class="text-{{.Room.TeamTurn}}-500 text-xl">Given Clue: "{{.Room.FetchLastClueWord}}"</p>
 | |
|     {{else}}
 | |
|     <p class="text-{{.Room.TeamTurn}}-500 text-xl">Waiting for mime</p>
 | |
|     {{end}}
 | |
|     {{template "cardcounter" .Room}}
 | |
|   {{end}}
 | |
|   <div id="addbot">
 | |
|     {{if and (eq .State.Username .Room.CreatorName) (not .Room.IsRunning)}}
 | |
|       {{template "addbot" .}}
 | |
|     {{end}}
 | |
|   </div>
 | |
|   <div class="flex justify-center space-x-4">
 | |
|     <!-- Left Panel -->
 | |
|     {{template "teamlist" .Room.BlueTeam}}
 | |
|     {{if not .Room.IsRunning}}
 | |
|       {{template "teampew" .}}
 | |
|     {{end}}
 | |
|     <!-- Right Panel -->
 | |
|     {{template "teamlist" .Room.RedTeam}}
 | |
|   </div>
 | |
|   <hr/>
 | |
|   <div id="systembox" class="overflow-y-auto max-h-96 border-2 border-gray-300 p-4 rounded-lg space-y-2">
 | |
|     bot thought: <br>
 | |
|     <ul>
 | |
|     {{range .Room.LogJournal}} 
 | |
|     <li>{{.Username}}: {{.Entry}}</li>
 | |
|     {{end}}
 | |
|     </ul>
 | |
|   </div>
 | |
|   <div hx-get="/actionhistory" hx-trigger="sse:backlog_{{.Room.ID}}">
 | |
|   {{template "actionhistory" .Room.ActionHistory}}
 | |
|   </div>
 | |
|   <hr/>
 | |
|   <div id="cardtable">
 | |
|     {{template "cardtable" .Room}}
 | |
|   </div>
 | |
|   <div>
 | |
|     {{if .Room.IsRunning}}
 | |
|     {{if and (eq .State.Role "guesser") (eq .State.Team .Room.TeamTurn)}}
 | |
|     <button hx-get="/end-turn" hx-target="#room" class="bg-amber-100 text-black px-4 py-2 rounded">End Turn</button>
 | |
|     {{else if and (eq .State.Role "mime") (not .Room.MimeDone)}}
 | |
|     {{template "mimeclue"}}
 | |
|     {{end}}
 | |
|     {{end}}
 | |
|   </div>
 | |
|   <div>
 | |
|     {{if and (eq .State.Username .Room.CreatorName) (.Room.IsRunning)}}
 | |
|       <button hx-get="/renotify-bot" hx-swap="none" class="bg-gray-100 text-black px-1 py-1 rounded">Btn in case llm call failed</button>
 | |
|     {{end}}
 | |
|   </div>
 | |
|   {{if not .Room.IsRunning}}
 | |
|   <div id="exitbtn">
 | |
|           <button button id="exit-room-btn" type="submit" class="justify-center rounded-md bg-indigo-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600" hx-get="/room/exit" hx-target="#main-content">Exit Room</button>
 | |
|   </div>
 | |
|   {{end}}
 | |
| </div>
 | |
| {{end}}
 | 
