You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
89 lines
2.1 KiB
89 lines
2.1 KiB
<html> |
|
|
|
<head> |
|
|
|
<meta name="pagedata" content='{"username": "{{ .Username}}"}' /> |
|
<style> |
|
body { |
|
margin: 0; |
|
font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji"; |
|
padding: 12px 0 0; |
|
} |
|
|
|
canvas { |
|
margin: 0 auto; |
|
width: 1024px; |
|
display: block; |
|
border: 1px solid #000; |
|
} |
|
|
|
.chat { |
|
width: 1024px; |
|
margin: 20px auto 0; |
|
border: 1px solid #000; |
|
padding: 8px; |
|
box-sizing: border-box; |
|
display: flex; |
|
} |
|
|
|
#msg { |
|
display: flex; |
|
flex-grow: 1; |
|
margin-right: 8px; |
|
} |
|
|
|
#send { |
|
height: 30px; |
|
} |
|
|
|
.header { |
|
width: 1024px; |
|
margin: 0 auto 12px; |
|
justify-content: flex-end; |
|
display: flex; |
|
} |
|
|
|
.login:link, |
|
.login:visited { |
|
color: #ffffff; |
|
background-color: #310f69; |
|
border-radius: 12px; |
|
padding: 8px; |
|
} |
|
|
|
.controls { |
|
width: 1024px; |
|
margin: 0 auto; |
|
} |
|
|
|
.pill { |
|
border: 1px solid #000000; |
|
border-radius: 8px; |
|
} |
|
</style> |
|
</head> |
|
|
|
<body> |
|
<div class="header"> |
|
{{ if eq .Username ""}} |
|
<a href="/auth/twitch" class="login">Login with Twitch</a> |
|
{{ else }} |
|
Logged In as {{ .Username}} |
|
{{ end }} |
|
</div> |
|
<canvas id="canvas" width="1024" height="400"></canvas> |
|
<div class="controls"> |
|
<span class="pill">h move left</span> |
|
<span class="pill">l move right</span> |
|
<span class="pill">j crouch</span> |
|
<span class="pill">k jump</span> |
|
</div> |
|
<div class="chat"> |
|
<input type="text" id="msg" placeholder="Type in a message to chat" /> |
|
<button type="button" id="send">Send</button> |
|
</div> |
|
<script src="/static/script.js"></script> |
|
|
|
</body> |
|
|
|
</html>
|
|
|