为什么这些警报没有出现? [英] why are these alerts not appearing?

查看:89
本文介绍了为什么这些警报没有出现?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我当前正在尝试将警报时间设置为在查看器授予网络摄像头许可后3秒钟出现。警报应该还带有音频,因为它们应该同时触发。

I am currently trying to time alerts to appear 3 seconds after the viewer grants permission of webcam. The alerts are supposed to also have audio with them, as they're supposed to be triggered at the same time.

该摄像头具有面部跟踪功能,因此有很多额外的代码。因此,我不懂javascript,因此,请提供视觉效果,而不仅仅是提供语句。

The webcam has a face tracking feature with it, so there is a lot of extra code. So I don't know javascript, so please visuals help a lot more than statements.

这是我目前正在使用的代码。

This is my current code I am working with.

 <!doctype html>
    <html>
    <head>
      <meta charset="utf-8">
      <title>eve_</title>
      <link rel="stylesheet" href="assets/demo.css">
      <link rel="icon" rel="preload" href="images/evecircle.png" />
      <script src="../build/tracking-min.js"></script>
      <script src="../build/data/face-min.js"></script>
       <script src="../node_modules/dat.gui/build/dat.gui.min.js"></script>
      <script src="assets/stats.min.js"></script>
     <script src="https://code.responsivevoice.org/responsivevoice.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <style>

      video, canvas {
        position: absolute;
      }
      </style>
    </head>
    <body onload="delayedAlert();">
      <div class="demo-title">

    <p><a href="http://trackingjs.com" target="_parent"></a></p>
  </div>

  <div class="demo-frame">
    <div class="demo-container">
      <video id="video" width="700" height="700" preload autoplay loop muted></video>
      <canvas id="canvas" width="700" height="700"></canvas>
    </div>
  </div>

 <audio>
  <source src="audio/hello.wav" type="audio/wav" preload=true>
 </audio>

 <audio>
  <source src="audio/is_something_here.wav" type="audio/wav" preload=true>
 </audio>

  <audio>
  <source src="audio/oh_something_is_here.wav" type="audio/wav" preload=true>
 </audio>


 <audio>
 <source src="audio/what_is_your_name.wav" type="audio/wav" preload=true>
 </audio>




  <script>
  var timeoutID;

  function delayedAlert() {
  timeoutID = window.setTimeout(slowAlert, 5000);
}


    window.onload = function() {
      var video = document.getElementById('video');
      var canvas = document.getElementById('canvas');
      var context = canvas.getContext('2d');
      var inverse = function inverse(imageData) {
    var data = imageData.data;
    for (var i = 0; i < data.length; i += 4) {
        data[i] = 255 - data[i];
        data[i + 1] = 255 - data[i + 1];
        data[i + 2] = 255 - data[i + 2];
    }
     var audio= document.getElementsByTagName('audio')[0];
 const audio2 = document.getElementsByTagName('audio')[1];
 var audio3 = document.getElementsByTagName('audio')[2];
  var audio4 = document.getElementsByTagName('audio')[3];
    return imageData;
};
      var tracker = new tracking.ObjectTracker('face');
      tracker.setInitialScale(4);
      tracker.setStepSize(2);
      tracker.setEdgesDensity(0.1);

      tracking.track('#video', tracker, { camera: true });

      tracker.on('track', function(event) {
        context.clearRect(0, 0, canvas.width, canvas.height);

        event.data.forEach(function(rect) {
          context.strokeStyle = '#0000ff';
          context.strokeRect(rect.x, rect.y, rect.width, rect.height);
          context.font = '13px Helvetica';
          context.fillStyle = "#fff";
          context.fillText('x: ' + rect.x + '3px', rect.x + rect.width + 5, rect.y + 11);
          context.fillText('y: ' + rect.y + '3px', rect.x + rect.width + 5, rect.y + 22);
        });
      });

      var gui = new dat.GUI();
      gui.add(tracker, 'edgesDensity', 0.5, 0.5).step(0.1);
      gui.add(tracker, 'initialScale', 1.0, 10.0).step(0.1);
      gui.add(tracker, 'stepSize', 1, 5).step(0.1);
    };

    function slowAlert() {
 var audio= document.getElementsByTagName('audio')[0];
 const audio2 = document.getElementsByTagName('audio')[1];
 var audio3 = document.getElementsByTagName('audio')[2];
  var audio4 = document.getElementsByTagName('audio')[3];

audio.play(); 
var myvar1;alert('Hello?');

audio2.play(); 
var myvar1;alert('Is something here?');

audio3.play();
var myvar2;alert('Something is here.');

    };
    </script>

         <audio>
  <source src="audio/hello.wav" type="audio/wav" preload=true>
 </audio>

 <audio>
  <source src="audio/is_something_here.wav" type="audio/wav" preload=true>
 </audio>

  <audio>
  <source src="audio/oh_something_is_here.wav" type="audio/wav" preload=true>
 </audio>


 <audio>
 <source src="audio/what_is_your_name.wav" type="audio/wav" preload=true>
 </audio>

</body>
</html>


推荐答案

似乎您忘记了呼叫 delayedAlert()

这篇关于为什么这些警报没有出现?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆