moved canvas resizing to seperate function
This commit is contained in:
parent
70ff965170
commit
21a7441b46
1 changed files with 5 additions and 3 deletions
|
|
@ -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));
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue