only refresh lobby when asked for
This commit is contained in:
parent
0dc4d6f662
commit
de2f32c667
4 changed files with 86 additions and 9 deletions
|
@ -45,8 +45,3 @@ async function start_game() {
|
|||
}
|
||||
|
||||
window.onload = () => refresh_state();
|
||||
|
||||
setInterval(
|
||||
() => refresh_state(),
|
||||
1000
|
||||
);
|
||||
|
|
53
backend/static/style/refresh.svg
Normal file
53
backend/static/style/refresh.svg
Normal file
|
@ -0,0 +1,53 @@
|
|||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 477.867 477.867" style="enable-background:new 0 0 477.867 477.867;" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M409.6,0c-9.426,0-17.067,7.641-17.067,17.067v62.344C304.667-5.656,164.478-3.386,79.411,84.479
|
||||
c-40.09,41.409-62.455,96.818-62.344,154.454c0,9.426,7.641,17.067,17.067,17.067S51.2,248.359,51.2,238.933
|
||||
c0.021-103.682,84.088-187.717,187.771-187.696c52.657,0.01,102.888,22.135,138.442,60.976l-75.605,25.207
|
||||
c-8.954,2.979-13.799,12.652-10.82,21.606s12.652,13.799,21.606,10.82l102.4-34.133c6.99-2.328,11.697-8.88,11.674-16.247v-102.4
|
||||
C426.667,7.641,419.026,0,409.6,0z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M443.733,221.867c-9.426,0-17.067,7.641-17.067,17.067c-0.021,103.682-84.088,187.717-187.771,187.696
|
||||
c-52.657-0.01-102.888-22.135-138.442-60.976l75.605-25.207c8.954-2.979,13.799-12.652,10.82-21.606
|
||||
c-2.979-8.954-12.652-13.799-21.606-10.82l-102.4,34.133c-6.99,2.328-11.697,8.88-11.674,16.247v102.4
|
||||
c0,9.426,7.641,17.067,17.067,17.067s17.067-7.641,17.067-17.067v-62.345c87.866,85.067,228.056,82.798,313.122-5.068
|
||||
c40.09-41.409,62.455-96.818,62.344-154.454C460.8,229.508,453.159,221.867,443.733,221.867z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 1.6 KiB |
|
@ -14,13 +14,40 @@ body {
|
|||
height: 100%;
|
||||
}
|
||||
|
||||
.refresh {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 25px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
|
||||
background-color: #ff7f00;
|
||||
mask-image: url("refresh.svg");
|
||||
-webkit-mask-image: url("refresh.svg");
|
||||
animation: spin 2s linear infinite;
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
.refresh:hover {
|
||||
cursor: pointer;
|
||||
animation-play-state: running;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
100% {transform: rotate(1turn); }
|
||||
}
|
||||
|
||||
.lobby_wrapper {
|
||||
position: relative;;
|
||||
}
|
||||
|
||||
.lobby {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
align-self: flex-start;
|
||||
overflow-y: scroll;
|
||||
height: 100%;;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.input_container {
|
||||
|
|
|
@ -2,8 +2,11 @@
|
|||
|
||||
{% block content %}
|
||||
<div class="main">
|
||||
<div class="lobby_wrapper">
|
||||
<div class="refresh" onclick="refresh_state()"></div>
|
||||
<div id="lobby" class="lobby">
|
||||
</div>
|
||||
</div>
|
||||
<div class="creator">
|
||||
<h1>Start new game</h1>
|
||||
<div class="input_container">
|
||||
|
@ -30,6 +33,5 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="script/lobby.js"></script>
|
||||
{% endblock %}
|
||||
|
|
Loading…
Reference in a new issue