planet-wars/backend/templates/visualizer.html.tera

{% extends "base" %}

{% block content %}
<link rel="stylesheet" type="text/css" href="/style/visualizer.css">
<link rel="stylesheet" type="text/css" href="/style/state.css">

<input type="file" id="fileselect" style="display: none">
<div id=wrapper>

    <div id="main" class="loading">
        <canvas id="c"></canvas>
        <div id="name"></div>
        <div id="addbutton" class="button"></div>

        <div id="meta">
            <div id="turnCounter">
            0 / 0
            </div>
            <div>
                <span>Ms per frame:&nbsp;</span>
                <input type="number" id="speed" value="100">
            </div>
            <div class="slidecontainer">
                <input type="range" min="0" max="1" value="1" class="slider" id="turnSlider">
            </div>
        </div>
    </div>

    <div class="options">
    {% for state in games %}
    <div class="option" onclick="visualizer.handle('/games/{{ state.file }}', '{{ state.name }}')">
        <p>{{state.name}} ({{ state.map }}) <span style="float: right;">{{state.turns}} turns</span></p>
        <div class="content">
            <div class="players">
                {% for player in state.players %}
                    <p class="{% if player[1] %}winner{% endif %}">{{ player[0] }}</p>
                {% endfor %}
            </div>
        </div>
    </div>
    {% endfor %}
    </div>
</div>


<noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
<script src="frontend/bootstrap.js"></script>
{% endblock %}