diff --git a/src/main/resources/static/css/game.css b/src/main/resources/static/css/game.css index a548af7..d3f6e71 100644 --- a/src/main/resources/static/css/game.css +++ b/src/main/resources/static/css/game.css @@ -223,6 +223,14 @@ body { float: right; height: 100%; } +.player > img { + width: 50px; + height: 50px; + border-radius: 50%; + border-width: 4px; + border-color: red; + border-style: solid; +} .player { margin-top: 10px; background-color: #15191a; diff --git a/src/main/resources/static/javascript/game.js b/src/main/resources/static/javascript/game.js index 7fd9b63..5f6ab66 100644 --- a/src/main/resources/static/javascript/game.js +++ b/src/main/resources/static/javascript/game.js @@ -58,6 +58,34 @@ const top_offset = 18; const board = new Board(); +const player_html_text = ` +
+
+
+
  • + attach_money + %(money)s +
    • +
  • + functions + 40,159 +
    • +
  • + assured_workload + 50per +
    • +
  • + savings + 1,000 +
    • +
    +
    + +

    %(displayName)s

    + +
    + `; + var socket = null; function disconnect() { @@ -369,7 +397,10 @@ function parsePlayersList(body) { let p_html = ''; for( let i = 0; i < body.length; i++ ) { let player = body[i]; - p_html += '

    '+player.displayName+'

    '+player.money+'

    '; + // player.userId + // player.displayName + // player.money + p_html += sprintf(player_html_text, player); } $(".players").append(p_html); } diff --git a/src/main/resources/templates/game.html b/src/main/resources/templates/game.html index 9ab06c4..2b3a995 100644 --- a/src/main/resources/templates/game.html +++ b/src/main/resources/templates/game.html @@ -52,6 +52,7 @@ +

    @@ -264,6 +265,7 @@