javascript-added.js

        function take_snapshot() {
          Webcam.snap(function (data_uri) {
            // snap complete, image data is in 'data_uri' see https://github.com/jhuckaby/webcamjs/blob/master/DOCS.md
            Webcam.upload(
              data_uri,
              "https://raspberrypi:5000/upload",
              function (response_code, response_data) {
                if (response_code === 200) {
                  var parsed_response_data = JSON.parse(response_data);
                  clearCanvas();
                  parsed_response_data.forEach((detection) => {
                    drawRect(...detection);
                  });
                }
              }
            );
          });
        }
        function drawRect(xmin, ymin, xmax, ymax) {
          ctx.beginPath();

          ctx.lineWidth = 5;
          ctx.rect(xmin, ymin, xmax - xmin, ymax - ymin);
          ctx.stroke();
        }

        function clearCanvas() {
          ctx.clearRect(-100, -100, 10000, 10000);
        }
      }