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