<commit_before><!DOCTYPE html>
<html>
    <head>
        <title>pyTanks Viewer</title>
        <style>
            td {
                padding: 3px;
            }
        </style>
    </head>
    <body>
        <h2>pyTanks Viewer</h2>
        <p>For more information on pyTanks <a href="https://github.com/JoelEager/pyTanks.Viewer" target="_blank">click here</a>.<p>
        <div style="text-align: center;">
            <p id="clientStatus">Connecting...</p>
            <canvas id="canvas" width="500" height="500" style="display: inline-block; border: 1px solid #d3d3d3; vertical-align: top; margin-bottom: 10px;"></canvas>
            <table id="scoreboard" style="text-align: left; display: inline-block; border: 1px solid #d3d3d3;"></table>
        </div>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
        <script>
            // Client configuration - must match server's settings
            var config = {
                framesPerSecond: 60,            // FPS to run the simulation at
                mapSize: {                      // Size of the map (must be the same as the canvas size)
                    x: 500,
                    y: 500
                },
                tankSpeed: 30,                  // Tank speed in pixels per second
                shellSpeed: 150,                // Shell speed in pixels per second
                serverIP: "localhost",          // Server's IP
                serverPort: "9042",             // Server's port
                apiPath: "/pyTanksAPI/viewer"   // API path on the server to connect to
            };
            
            // Globals
            var gameState = null;
            var gameStateUpdate = null;
            var canvas = null;
            var clientStatus = null;
            var scoreboard = null;
            
            // Setup and run the viewer
            $(function() {
                canvas = $("#canvas")[0].getContext("2d");
                clientStatus = $("#clientStatus");
                scoreboard = $("#scoreboard");
                
                // Connect to sever
                var socket = new WebSocket("ws://" + config.serverIP + ":" + config.serverPort + config.apiPath);
                
                // Finish setup on successful connect
                socket.onopen = function (event) {
                    clientStatus.html("Connected");
                    
                    // Start the doTick clock
                    var ticker = window.setInterval(function(){ doTick(); }, 1000 / config.framesPerSecond);
                
                    // Store any incoming gameState updates
                    socket.onmessage = function (event) {
                        gameStateUpdate = JSON.parse(event.data);
                    };
                    
                    // Handle a disconnect
                    socket.onclose = function (event) {
                        window.clearInterval(ticker);
                        clientStatus.html("Lost connection");
                    };
                };
            
                // Handle errors in connecting
                socket.onerror = function (event) {
                    clientStatus.html("Failed to connect");
                };
            });
            
            // Calculates and renders one frame
            function doTick() {
                // Return if no data from the server has arrived yet
                if (gameState == null && gameStateUpdate == null) {
                    return;
                }
                
                if (gameStateUpdate == null) {
                    // Extrapolate if there isn't an update from the server
                    var totalDistance = config.tankSpeed * (1 / config.framesPerSecond);
                    for (tank of gameState.tanks) {
                        if (tank.moving) {
                            tank.x += Math.cos(tank.heading) * totalDistance;
                            tank.y -= Math.sin(tank.heading) * totalDistance;
                        }
                    }
                    
                    totalDistance = config.shellSpeed * (1 / config.framesPerSecond);
                    for (shell of gameState.shells) {
                        shell.x += Math.cos(shell.heading) * totalDistance;
                        shell.y -= Math.sin(shell.heading) * totalDistance;
                    }
                } else {
                    // Apply the update from the server
                    gameState = gameStateUpdate;
                    gameStateUpdate = null;
                    
                    if (gameState.ongoingGame) {
                        clientStatus.html("Connected - Game in progress");
                    } else {
                        clientStatus.html("Connected - Waiting for players<p>Why don't you spin up a couple more?</p>");
                    }
                    
                    var scoreHTML = "<tr><td></td><td>Tank</td><td>Kills this round</td><td>Rounds won</td></tr>";
                    for (tank of gameState.tanks) {
                        scoreHTML += "<tr><td>";
                        
                        if (tank.alive) {
                            scoreHTML += "A";
                        } else {
                            scoreHTML += "D";
                        }
                        
                        scoreHTML += "</td><td>" + tank.name + "</td><td>" + tank.kills + "</td><td>" + tank.wins + "</td></tr>";
                    }
                    if (scoreboard.html() != scoreHTML) {
                        scoreboard.html(scoreHTML);
                    }
                }
                
                // Render based on that game state
                canvas.clearRect(0, 0, config.mapSize.x, config.mapSize.y);
                
                if (gameState.ongoingGame) {
                    canvas.fillStyle = "Orange";
                    for (tank of gameState.tanks) {
                        if (!tank.alive) {
                            drawRotatedRect(tank.x - 5, tank.y - 5, 10, 10, tank.heading);<commit_msg>Minor UI improvements<commit_after><!DOCTYPE html>
<html>
    <head>
        <title>pyTanks Viewer</title>
        <style>
            td {
                padding: 3px;
            }
        </style>
    </head>
    <body>
        <h2 style="margin: 0px;">pyTanks Viewer</h2>
        <p style="margin-top: 5px;">For more information on pyTanks <a href="https://github.com/JoelEager/pyTanks.Viewer" target="_blank">click here</a>.</p>
        <div style="text-align: center;">
            <p id="clientStatus">Connecting...</p>
            <canvas id="canvas" width="500" height="500" style="display: inline-block; border: 1px solid #d3d3d3; vertical-align: top; margin-bottom: 10px;"></canvas>
            <div style="display: inline-block; border: 1px solid #d3d3d3;">
                <table id="scoreboard" style="text-align: left;"></table>
                A = alive, D = dead
            </div>
        </div>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
        <script>
            // Client configuration - must match server's settings
            var config = {
                framesPerSecond: 60,            // FPS to run the simulation at
                mapSize: {                      // Size of the map (must be the same as the canvas size)
                    x: 500,
                    y: 500
                },
                tankSpeed: 30,                  // Tank speed in pixels per second
                shellSpeed: 150,                // Shell speed in pixels per second
                serverIP: "localhost",          // Server's IP
                serverPort: "9042",             // Server's port
                apiPath: "/pyTanksAPI/viewer"   // API path on the server to connect to
            };
            
            // Globals
            var gameState = null;
            var gameStateUpdate = null;
            var canvas = null;
            var clientStatus = null;
            var scoreboard = null;
            
            // Setup and run the viewer
            $(function() {
                canvas = $("#canvas")[0].getContext("2d");
                clientStatus = $("#clientStatus");
                scoreboard = $("#scoreboard");
                
                // Connect to sever
                var socket = new WebSocket("ws://" + config.serverIP + ":" + config.serverPort + config.apiPath);
                
                // Finish setup on successful connect
                socket.onopen = function (event) {
                    clientStatus.html("Connected");
                    
                    // Start the doTick clock
                    var ticker = window.setInterval(function(){ doTick(); }, 1000 / config.framesPerSecond);
                
                    // Store any incoming gameState updates
                    socket.onmessage = function (event) {
                        gameStateUpdate = JSON.parse(event.data);
                    };
                    
                    // Handle a disconnect
                    socket.onclose = function (event) {
                        window.clearInterval(ticker);
                        clientStatus.html("Lost connection");
                    };
                };
            
                // Handle errors in connecting
                socket.onerror = function (event) {
                    clientStatus.html("Failed to connect");
                };
            });
            
            // Calculates and renders one frame
            function doTick() {
                // Return if no data from the server has arrived yet
                if (gameState == null && gameStateUpdate == null) {
                    return;
                }
                
                if (gameStateUpdate == null) {
                    // Extrapolate if there isn't an update from the server
                    var totalDistance = config.tankSpeed * (1 / config.framesPerSecond);
                    for (tank of gameState.tanks) {
                        if (tank.moving) {
                            tank.x += Math.cos(tank.heading) * totalDistance;
                            tank.y -= Math.sin(tank.heading) * totalDistance;
                        }
                    }
                    
                    totalDistance = config.shellSpeed * (1 / config.framesPerSecond);
                    for (shell of gameState.shells) {
                        shell.x += Math.cos(shell.heading) * totalDistance;
                        shell.y -= Math.sin(shell.heading) * totalDistance;
                    }
                } else {
                    // Apply the update from the server
                    gameState = gameStateUpdate;
                    gameStateUpdate = null;
                    
                    if (gameState.ongoingGame) {
                        clientStatus.html("Connected - Game in progress");
                    } else {
                        clientStatus.html("Connected - Waiting for players. (Feel free to connect a couple more to get a game started.)");
                    }
                    
                    var scoreHTML = "<tr><td></td><td>Tank</td><td>Kills this round</td><td>Rounds won</td></tr>";
                    for (tank of gameState.tanks) {
                        scoreHTML += "<tr><td>";
                        
                        if (tank.alive) {
                            scoreHTML += "A";
                        } else {
                            scoreHTML += "D";
                        }
                        
                        scoreHTML += "</td><td>" + tank.name + "</td><td>" + tank.kills + "</td><td>" + tank.wins + "</td></tr>";
                    }
                    if (scoreboard.html() != scoreHTML) {
                        scoreboard.html(scoreHTML);
                    }
                }
                
                // Render based on that game state
                canvas.clearRect(0, 0, config.mapSize.x, config.mapSize.y);
                
                if (gameState.ongoingGame) {
                    canvas.fillStyle = "Orange";
                    for (tank of gameState.tanks) {
                        if (!tank.alive) {
                            drawRotatedRect(tank.x - 5, tank.y - 5, 10, 10, tank.heading);
{'fraction_non_alphanumeric': 0.10501040499439732, 'fraction_numerical': 0.00896430286537538, 'mean_word_length': 1.0544228872081551, 'pattern_counts': {'":': 2, '<': 99, '<?xml version=': 0, '>': 99, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1014151', 'n_tokens_mistral': 3152, 'n_tokens_neox': 2877, 'n_words': 742}