This commit is contained in:
Kyle
2019-08-10 11:20:40 -07:00
parent f258ffa252
commit a83b43d1a2
2 changed files with 8 additions and 2 deletions

View File

@@ -71,6 +71,7 @@ function startGame() {
} }
var context = playerList[i - 1].canvas.customVarContext var context = playerList[i - 1].canvas.customVarContext
context.textBaseline = "middle" context.textBaseline = "middle"
var tempFontSize = 100
context.font = "100pt belerenbsc" context.font = "100pt belerenbsc"
var currentLife = playerList[context.customVarCanvas.customVarID - 1].life var currentLife = playerList[context.customVarCanvas.customVarID - 1].life
context.fillStyle = "#222" context.fillStyle = "#222"
@@ -81,6 +82,10 @@ function startGame() {
} }
context.fillRect(tempCanvasWidth / -2, tempCanvasHeight / -2, tempCanvasWidth, tempCanvasHeight) context.fillRect(tempCanvasWidth / -2, tempCanvasHeight / -2, tempCanvasWidth, tempCanvasHeight)
context.fillStyle = "#eee" context.fillStyle = "#eee"
while (context.measureText(currentLife).width >= tempCanvasWidth) {
tempFontSize -= 1
context.font = tempFontSize + "pt belerenbsc"
}
var horizontalShift = -1 * parseInt(context.measureText(currentLife).width) / 2 var horizontalShift = -1 * parseInt(context.measureText(currentLife).width) / 2
context.fillText(currentLife, horizontalShift, 0) context.fillText(currentLife, horizontalShift, 0)
} }

View File

@@ -46,9 +46,9 @@
<body> <body>
<div id="settings"> <div id="settings">
Number of Players:<br> Number of Players<br>
<input id="inputPlayerCount" class="input" type="number" min="2" value="6" max="16"><br> <input id="inputPlayerCount" class="input" type="number" min="2" value="6" max="16"><br>
Starting Life Total:<br> Starting Life Total<br>
<input id="inputStartingLife" class="input" type="number" min="0" value="40"><br> <input id="inputStartingLife" class="input" type="number" min="0" value="40"><br>
<button id="buttonStartGame" class="input" onclick="startGame()">Game On!</button> <button id="buttonStartGame" class="input" onclick="startGame()">Game On!</button>
</div> </div>
@@ -120,6 +120,7 @@
border: 1px solid white; border: 1px solid white;
width: auto; width: auto;
height: auto; height: auto;
touch-action: manipulation;
} }
.widePlayerBox { .widePlayerBox {
grid-column: 1 / span 2; grid-column: 1 / span 2;