This commit is contained in:
Kyle
2019-08-10 15:05:50 -07:00
parent 2e93310500
commit cf2c840133
2 changed files with 26 additions and 5 deletions

View File

@@ -56,6 +56,7 @@ function startGame() {
}
if ((i == 1 && firstPlayerWide) || (i == playerCount && lastPlayerWide)) {wide = true}
playerList[i - 1] = new playerBox(i, rotation, wide)
document.getElementById("inputPlayer").innerHTML += "<option value='" + i + "'>Player " + i + "</option>"
}
//Determine the grid size
if (isFullscreen) {
@@ -101,20 +102,24 @@ function startGame() {
var tempFontSize = 100
context.font = "100pt belerenbsc"
var currentLife = playerList[context.customVarCanvas.customVarID - 1].life
context.fillStyle = "#222"
context.fillStyle = context.customVarCanvas.customVarColor
var tempCanvasHeight = context.customVarCanvas.height, tempCanvasWidth = context.customVarCanvas.width
if (playerList[context.customVarCanvas.customVarID - 1].rotation == 90 || playerList[context.customVarCanvas.customVarID - 1].rotation == 270) {
tempCanvasHeight = tempCanvasWidth
tempCanvasWidth = context.customVarCanvas.height
}
context.fillRect(tempCanvasWidth / -2, tempCanvasHeight / -2, tempCanvasWidth, tempCanvasHeight)
context.fillStyle = "#eee"
context.fillStyle = "white"
while (context.measureText(currentLife).width >= tempCanvasWidth) {
tempFontSize -= 1
context.font = tempFontSize + "pt belerenbsc"
}
var horizontalShift = -1 * parseInt(context.measureText(currentLife).width) / 2
context.strokeStyle = "black"
context.lineWidth = 5
context.strokeText(currentLife, horizontalShift, 0)
context.fillText(currentLife, horizontalShift, 0)
}
}, 100)
}
@@ -127,6 +132,7 @@ function playerBox(playerBoxID, canvasRotation, wide) {
this.canvas.customVarMouseDown = "false"
this.canvas.customVarMouseDelay = 0
this.canvas.customVarID = playerBoxID
this.canvas.customVarColor = "#222222"
this.canvas.customVarContext = this.canvas.getContext("2d")
this.canvas.customVarContext.customVarCanvas = this.canvas
this.canvas.classList.add("playerBox")
@@ -202,3 +208,9 @@ function resetLife() {
}
document.getElementById('menu').classList.add('hidden')
}
function updateColorSelector() {
document.getElementById("inputPlayerColor").value = playerList[parseInt(document.getElementById("inputPlayer").value) - 1].canvas.customVarColor
}
function updateBackgroundColor(color) {
playerList[parseInt(document.getElementById("inputPlayer").value) - 1].canvas.customVarColor = color
}

View File

@@ -65,7 +65,13 @@
<img class="menuExitButton" src="data/life/menuExitButton.png" onclick="document.getElementById('menu').classList.add('hidden')">
<div class="menuInterior">
<div class="menuOption" onclick="resetLife()">Reset Life Totals</div><br>
<div class="menuOption" onclick="location.reload()">Change Player Count</div>
<div class="menuOption" onclick="location.reload()">Change Player Count</div><br>
<div class="menuOption">
Change Background Color:<br>
<select id="inputPlayer" onchange="updateColorSelector()"></select><br>
<input type=color value="#222222" id="inputPlayerColor" onchange="updateBackgroundColor(this.value)"><br>
<button onclick="updateBackgroundColor('#222222')">Default</button>
</div><br>
</div>
</div>
<div id="mainGrid" class="mainGrid"></div>
@@ -187,8 +193,11 @@
display: table;
}
.menuInterior {
display: table-cell;
vertical-align: middle;
margin: 90pt 0px 0px 0px;
padding: 20pt;
overflow-y: scroll;
max-height: calc(100% - 180pt);
border: 1px solid white;
}
.menuOption {
font-size: 30pt;