render all areas

fix question label position by area
This commit is contained in:
Alexander Popov 2021-07-04 21:50:35 +03:00
parent b1bc889e9a
commit 5a622ab351

View File

@ -37,6 +37,8 @@ window.onload = function() {
area = { area = {
answerButtons: { x: 10, y: cH - 340, w: cW - 20, h: 250 }, answerButtons: { x: 10, y: cH - 340, w: cW - 20, h: 250 },
questionLabel: { x: 10, y: cH - 340 - 80, w: cW - 20, h: 70 },
uiButtons: { x: 10, y: cH - 80, w: cW - 20, h: 70 },
} }
button = { button = {
@ -85,7 +87,6 @@ window.onload = function() {
if (isInside(mousePos, button.answerButtons[3])) { if (isInside(mousePos, button.answerButtons[3])) {
console.log(checkAnswer(game.quest, button.answerButtons[3].data)); console.log(checkAnswer(game.quest, button.answerButtons[3].data));
} }
}, false); }, false);
window.requestAnimationFrame(gameLoop); window.requestAnimationFrame(gameLoop);
@ -122,17 +123,18 @@ function draw() {
// TODO: draw answer buttons area by landscape // TODO: draw answer buttons area by landscape
console.log('TODO: draw answer buttons area by landscape'); console.log('TODO: draw answer buttons area by landscape');
else else
context.strokeRect(area.answerButtons.x, area.answerButtons.y, for (const [key, value] of Object.entries(area)) {
area.answerButtons.w, area.answerButtons.h); context.strokeRect(value.x, value.y, value.w, value.h);
}
} }
// draw quest ------------------------------------------ // draw question label
context.font = "32px Ubuntu"; context.font = "32px Ubuntu";
context.textAlign = "center"; context.textAlign = "center";
context.fillStyle = "white"; context.fillStyle = "white";
context.fillText(gameData[0].question, cW / 2, cH - 420); context.fillText(gameData[0].question, cW / 2, area.questionLabel.y + 30);
// draw answer buttons ------------------------------------------ // draw answer buttons
context.fillStyle = "purple"; context.fillStyle = "purple";
context.strokeStyle = "navy"; context.strokeStyle = "navy";
context.lineWidth = 2; context.lineWidth = 2;