57 lines
1.4 KiB
Plaintext
57 lines
1.4 KiB
Plaintext
doctype html
|
|
html
|
|
head
|
|
meta(charset="utf-8")
|
|
title Doodul (game #{lobbyId})
|
|
|
|
script let lobbyId = "#{lobbyId}"; let nickname = "#{nickname}";
|
|
script(async,src="/js/game.js")
|
|
|
|
style #guessingBox p:nth-child(even) { background: lightgrey; }
|
|
body
|
|
div#waitingMessageDiv
|
|
p Waiting for players to connect...
|
|
div#endMessageDiv(style="display: none")
|
|
p Game ended!
|
|
div#gameDiv(style="display: none")
|
|
label(for="roundSpan")!= "Round "
|
|
span#roundSpan
|
|
br
|
|
label(for="playerList")!= "Players: "
|
|
ul#playerList
|
|
br
|
|
label(for="wordSpan")!= "Word: "
|
|
span#wordSpan
|
|
br
|
|
label(for="timerSpan")!= "Seconds left: "
|
|
span#timerSpan
|
|
canvas#drawingCanvas(width="800",height="600")
|
|
div#wordChoiceDiv(style="display: none")
|
|
button#firstWordButton
|
|
button#secondWordButton
|
|
button#thirdWordButton
|
|
div#guessingDiv
|
|
div#guessingBox
|
|
br
|
|
input#guessInput
|
|
br
|
|
div#drawingToolbox(style="display: none")
|
|
label(for="eraserToggle")!= "Tool: "
|
|
button#eraserToggle Brush
|
|
br
|
|
label(for="toolSizeSelect")!= "Tool size: "
|
|
select#toolSizeSelect
|
|
option(value="5") 5
|
|
option(value="10") 10
|
|
option(value="20") 20
|
|
option(value="50") 50
|
|
br
|
|
label(for="colourSelect")!= "Brush colour: "
|
|
select#colourSelect
|
|
option(value="#000000") Black
|
|
option(value="#FF0000") Red
|
|
option(value="#00FF00") Green
|
|
option(value="#0000FF") Blue
|
|
br
|
|
button#clearButton Clear canvas
|