dorian
/
godot-html-js-int-demo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improve style for frame.
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Dorian Pula 2020-12-17 14:10:19 -05:00
parent 58be256f8a
commit b6d95a7dde
1 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
fixed-size.html
View File

@ -195,7 +195,7 @@
$GODOT_HEAD_INCLUDE
</head>
<body>
<div id="game_box" class="game_frame hidden">
<div id="game" class="pretty-frame hidden">
<h1>Click to Victory!</h1>
<div id="container">
<canvas id="canvas" width="640" height="480">
@ -415,8 +415,16 @@ $GODOT_HEAD_INCLUDE
const gameLauncher = document.querySelector("#gameLauncher");
gameLauncher.remove();
const gameFrame = document.querySelector("#game_box");
gameFrame.className = "game_frame";
const gameFrame = document.querySelector("#game");
showElement(gameFrame);
}
const hideElement = (element) => {
element.className = "pretty-frame hidden"
}
const showElement = (element) => {
element.className = "pretty-frame"
}
window.addEventListener("load", () => {
@ -436,10 +444,10 @@ $GODOT_HEAD_INCLUDE
}
const showScoresAfterGameEnd = () => {
const game_box = document.querySelector('#game_box');
game_box.remove();
const score_list = document.querySelector('#scoreList');
score_list.className = "game_frame";
const game = document.querySelector('#game');
hideElement(game);
const finalScoreBox = document.querySelector('#scoreList');
showElement(finalScoreBox);
}
const updateScoreMessage = () => {
@ -457,7 +465,7 @@ $GODOT_HEAD_INCLUDE
height: 0px;
}
.game_frame {
.pretty-frame {
background-color: #383838;
color: #f0f0f0;
width: 66%;
@ -468,7 +476,7 @@ $GODOT_HEAD_INCLUDE
}
</style>
<div id="gameLauncher" class="game_frame">
<div id="gameLauncher" class="pretty-frame">
<h1>Click to Victory!</h1>
<form>
<label for="playerName">Player Name</label>
@ -477,7 +485,7 @@ $GODOT_HEAD_INCLUDE
</form>
</div>
<div id="scoreList" class="game_frame hidden">
<div id="scoreList" class="pretty-frame hidden">
<h1 id="scoreMessage">Your Score Here</h2>
</div>
<!-- End of Custom Game block -->