ozai-webui/templates/join_game.html

87 lines
2.1 KiB
HTML
Raw Normal View History

2024-02-14 21:52:29 +01:00
<!-- HTML -->
<!DOCTYPE html>
<html>
<head>
2024-02-15 12:58:18 +01:00
<title>Ozai webui:Join Game</title>
<style>
2024-02-24 21:33:28 +01:00
* {
box-sizing: border-box;
margin-left: 3em;
}
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
2024-02-15 12:58:18 +01:00
2024-02-24 21:33:28 +01:00
ul {
list-style-type: none;
padding: 0;
}
li {
margin-bottom: 10px;
}
form {
margin-top: 20px;
}
select, input[type="submit"] {
padding: 10px;
margin-top: 10px;
}
input[type="submit"] {
background-color: #3779fd;
border: none;
text-decoration: none;
margin: 4px 2px;
cursor: pointer;
}
2024-02-15 12:58:18 +01:00
</style>
2024-02-14 21:52:29 +01:00
</head>
<body>
{% if game_id %}
2024-02-24 21:33:28 +01:00
<p>Selected game to join is: <strong>{{ game_id }}</strong></p>
2024-02-14 21:52:29 +01:00
{% endif %}
{% if players %}
<p>Players in game:</p>
<ul>
{% for player in players %}
<li>{{ player }}</li>
{% endfor %}
</ul>
<!-- form to select one player to play as, or to select spectator too play as -->
<form method="POST" action="/join_game/{{ game_id }}">
<select name="player">
2024-02-24 21:33:28 +01:00
<option value="spectator" selected>Spectator</option>
2024-02-14 21:52:29 +01:00
{% for player in players %}
<option value="{{ player }}">{{ player }}</option>
{% endfor %}
</select>
<input type="submit" value="Join Game">
</form>
{% else %}
<p>No players found in game, please recreate the game.</p>
{% endif %}
{% if player_name %}
<p>Selected player to join as: {{ player_name }}</p>
<script>
// Save player name in browser session for auto fill in game page
sessionStorage.setItem('player_name', '{{ player_name }}');
//redirect to game
window.location.href = '/game/{{ game_id }}/player/{{ player_name }}';
</script>
<noscript>
<p>manual redirect</p>
<a href="/game/{{ game_id }}/player/{{ player_name }}">Go to game</a>
</noscript>
{% endif %}
</body>
</html>