{% extends "base.html" %} {% block title %} Jeu {% endblock %} {% block titre %} Jeu {{ game.name }} {% endblock %} {% block head %} {% include ['scripts-perso.html', 'scripts.html'] %} {% endblock %} {% block contenu %} <div id="zone-de-contenu"> <fieldset class="fieldset"><legend style="font-size:25px;">Liste des joueurs</legend> <p>Faites les équipes :</p> <ul id="players"> </ul> </fieldset> <fieldset class="fieldset"><legend style="font-size:25px;">Commencer</legend> <a href="javascript:gostart()">Commencer</a> </fieldset> </div> {% endblock %} {% block script %} <script type="text/javascript" charset="utf-8"> var players_order = [ {% for p in game.get_players() %} '{{ p['username'] }}', {% endfor %} ]; var players = { {% for p in game.get_players() %} '{{ p['username'] }}': '{{ p['name'] }}', {% endfor %} }; var put_players = function(){ var html = ''; for(i=0;i<players_order.length;i++){ html+= `<li> <div style="float:right"> <a href="javascript:up(${i})">Monter</a> <a href="javascript:down(${i})">Descendre</a></div> ${players[players_order[i]]} ( ${players_order[i]} ) <div style="clear:both"></div></li>`; } $('#players').html(html); } put_players(); var up=function(i){ t = players_order[i]; if(i==0){ n=players_order.length-1; }else{ n = i-1; } players_order[i] = players_order[n] players_order[n] = t put_players(); } var down = function(i){ t = players_order[i]; if(i==players_order.length-1){ n=0; }else{ n = i+1; } players_order[i] = players_order[n] players_order[n] = t put_players(); } var socket = io('/game/{{ game.id }}/join'); socket.on('connect', function() { }); socket.on('start', function(data){ document.location.href="/game/{{ game.id }}"; }); var gostart = function(){ socket.emit('start', {'order':players_order}); document.location.href="/game/{{ game.id }}"; } </script> {% endblock %}