broodjeaap/streamwatcher
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

renamed 'rectangles' class and variables to WatchArea

Browse source
This commit is contained in:
BroodjeAap 2020-07-12 18:32:19 +00:00
parent b159278efe
commit 7206c087d5
2 changed files with 23 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
static/js/stream.js
View file

@ -4,7 +4,7 @@ let img = null;
let isDrawing = false; let isDrawing = false;
class Rectangle { class WatchArea {
constructor(name, x0, y0, x1, y1, R, G, B) { constructor(name, x0, y0, x1, y1, R, G, B) {
this.name = name; this.name = name;
this.x0 = x0; this.x0 = x0;
@ -30,14 +30,14 @@ class Rectangle {
} }
} }
let rectangle = new Rectangle( let watchArea = new WatchArea(
"", "",
0, 0, 0, 0,
0, 0, 0, 0,
0, 0, 0 0, 0, 0
) )
let rectangles = []; let watchAreas = [];
document.addEventListener("DOMContentLoaded", function(){ document.addEventListener("DOMContentLoaded", function(){
canvas = document.getElementById("canvas"); canvas = document.getElementById("canvas");
@ -50,15 +50,15 @@ document.addEventListener("DOMContentLoaded", function(){
}; };
canvas.addEventListener("mousedown", e => { canvas.addEventListener("mousedown", e => {
rectangle.x0 = e.offsetX; watchArea.x0 = e.offsetX;
rectangle.y0 = e.offsetY; watchArea.y0 = e.offsetY;
isDrawing = true; isDrawing = true;
}); });
canvas.addEventListener("mousemove", e => { canvas.addEventListener("mousemove", e => {
if(isDrawing === true) { if(isDrawing === true) {
rectangle.x1 = e.offsetX; watchArea.x1 = e.offsetX;
rectangle.y1 = e.offsetY; watchArea.y1 = e.offsetY;
draw(); draw();
update(); update();
} }
@ -75,7 +75,7 @@ document.addEventListener("DOMContentLoaded", function(){
function draw(){ function draw(){
ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.clearRect(0, 0, canvas.width, canvas.height);
drawImage(); drawImage();
rectangle.draw(ctx); watchArea.draw(ctx);
} }
function drawImage(){ function drawImage(){
@ -106,21 +106,21 @@ function submitNewArea(){
} }
function updateRectInputs(){ function updateRectInputs(){
document.getElementsByName("R")[0].value = rectangle.R; document.getElementsByName("R")[0].value = watchArea.R;
document.getElementsByName("G")[0].value = rectangle.G; document.getElementsByName("G")[0].value = watchArea.G;
document.getElementsByName("B")[0].value = rectangle.B; document.getElementsByName("B")[0].value = watchArea.B;
document.getElementsByName("x0")[0].value = rectangle.x0; document.getElementsByName("x0")[0].value = watchArea.x0;
document.getElementsByName("y0")[0].value = rectangle.y0; document.getElementsByName("y0")[0].value = watchArea.y0;
document.getElementsByName("x1")[0].value = rectangle.x1; document.getElementsByName("x1")[0].value = watchArea.x1;
document.getElementsByName("y1")[0].value = rectangle.y1; document.getElementsByName("y1")[0].value = watchArea.y1;
} }
let changeR = function(elem){rectangle.R = elem.value; draw();} let changeR = function(elem){watchArea.R = elem.value; draw();}
let changeG = function(elem){rectangle.G = elem.value; draw();} let changeG = function(elem){watchArea.G = elem.value; draw();}
let changeB = function(elem){B = elem.value; draw();} let changeB = function(elem){watchArea.B = elem.value; draw();}
let changeX0 = function(elem){rectangle.x0 = elem.value; draw();} let changeX0 = function(elem){watchArea.x0 = elem.value; draw();}
let changeY0 = function(elem){rectangle.y0 = elem.value; draw();} let changeY0 = function(elem){watchArea.y0 = elem.value; draw();}
let changeX1 = function(elem){rectangle.x1 = elem.value; draw();} let changeX1 = function(elem){watchArea.x1 = elem.value; draw();}
let changeY1 = function(elem){rectangle.y1 = elem.value; draw();} let changeY1 = function(elem){watchArea.y1 = elem.value; draw();}

1
templates/stream.html
View file

@ -63,4 +63,5 @@
<td><button type="button" class="pure-button pure-button-primary" onclick="submitNewArea()">Add</button></td> <td><button type="button" class="pure-button pure-button-primary" onclick="submitNewArea()">Add</button></td>
</tr> </tr>
</template> </template>
{{end}} {{end}}