a little more responsive (a little)

This commit is contained in:
LuckyLaszlo
2022-10-16 17:14:59 +02:00
parent 0f98e3328e
commit 0cca04e350

View File

@@ -6,11 +6,15 @@
<style>
#canvas-container {
text-align: center;
border: dashed red 5px;
/* max-height: 80vh; */
/* overflow: hidden; */
}
canvas {
border:1px solid #d3d3d3;
background-color: #333333;
width: 80%;
max-width: 90vw;
/* max-height: 100vh; */
/* width: 80%; */
}
</style>
@@ -59,13 +63,13 @@ function startGame()
wall_bottom = new component(w, wall_size, "grey", 0, h-wall_size);
// Grid
w_grid_mid = new component(w, 1, "darkgreen", 0, h_mid);
w_grid_u1 = new component(w, 1, "yellow", 0, h/4);
w_grid_d1 = new component(w, 1, "yellow", 0, h-h/4);
h_grid_mid = new component(1, h, "darkgreen", w_mid, 0);
h_grid_u1 = new component(1, h, "yellow", w/4, 0);
h_grid_d1 = new component(1, h, "yellow", w-w/4, 0);
const grid_size = w/500;
w_grid_mid = new component(w, grid_size, "darkgreen", 0, h_mid);
w_grid_u1 = new component(w, grid_size, "darkgreen", 0, h/4);
w_grid_d1 = new component(w, grid_size, "darkgreen", 0, h-h/4);
h_grid_mid = new component(grid_size, h, "darkgreen", w_mid, 0);
h_grid_u1 = new component(grid_size, h, "darkgreen", w/4, 0);
h_grid_d1 = new component(grid_size, h, "darkgreen", w-w/4, 0);
myGameArea.start();
}
@@ -74,10 +78,10 @@ var myGameArea = {
keys: [],
canvas : document.createElement("canvas"),
createGameArea : function() {
this.canvas.width = 500;
this.canvas.height = 300;
// var heightRatio = 1;
// this.canvas.height = this.canvas.width * heightRatio;
/* ratio 5/3 (1.66) */
var ratio = 1.66666;
this.canvas.width = 1500;
this.canvas.height = this.canvas.width / ratio;
this.context = this.canvas.getContext("2d");
var container = document.getElementById("canvas-container");
container.insertBefore(this.canvas, container.childNodes[0]);