moved canvas resizing to seperate function

This commit is contained in:
BroodjeAap 2020-07-30 18:36:33 +00:00
parent 70ff965170
commit 21a7441b46

View file

@ -41,7 +41,6 @@ let watchAreas = [];
document.addEventListener("DOMContentLoaded", function(){ document.addEventListener("DOMContentLoaded", function(){
canvas = document.getElementById("canvas"); canvas = document.getElementById("canvas");
ctx = canvas.getContext("2d"); ctx = canvas.getContext("2d");
src = document.getElementById("current_color_stream"); src = document.getElementById("current_color_stream");
img = new Image(); img = new Image();
@ -76,12 +75,15 @@ document.addEventListener("DOMContentLoaded", function(){
window.addEventListener('resize', draw); window.addEventListener('resize', draw);
function draw(){ function resizeCanvas() {
contentDiv = document.getElementById("content") contentDiv = document.getElementById("content")
var rect = contentDiv.getBoundingClientRect(); var rect = contentDiv.getBoundingClientRect();
canvas.width = Math.floor(rect.width * 0.9); canvas.width = Math.floor(rect.width * 0.9);
canvas.height = (img.height / img.width) * canvas.width; canvas.height = (img.height / img.width) * canvas.width;
}
function draw(){
resizeCanvas();
ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.clearRect(0, 0, canvas.width, canvas.height);
drawImage(); drawImage();
watchAreas.forEach(watchArea => watchArea.draw(ctx)); watchAreas.forEach(watchArea => watchArea.draw(ctx));