Chen
/
anotherVersion


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>player</title>
<!--    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/p5.min.js"></script>-->
<!--    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/addons/p5.sound.min.js"></script>-->
<!--    <script src="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script>-->
    <style>
        /*.close {*/
        /*    width: 40px;*/
        /*    height: 40px;*/
        /*    background-image: url('./image/close.png') ;*/
        /*    background-size: 100% 100%;*/
        /*    position: fixed;*/
        /*    top: 20px;*/
        /*    right: 20px;*/
        /*    z-index: 99;*/
        /*    cursor: pointer;*/
        /*    display: none;*/
        /*}*/
    </style>
</head>
<body style="margin: 0; width: 100%; text-align: center; z-index:999;" >
<!--    <i class="close"></i>-->
<!--onload="open()"-->
    <video width="100%" id="video"></video>
    <canvas id="canvas"></canvas>
    <canvas id="draw"></canvas>
<!--    <button id="full">全屏</button>-->
</body>
<script type="module">
    import Player from "./src/player.js";
    var clickTimeId;
    let str  = location.href;
    let num = str.indexOf('?');
    str = str.substr(num+1);
    let data = str.split(',');
    let isShow = Number(data[0]);
    let key = data[4];
    const close = document.getElementsByClassName('close')[0];
    let video = document.getElementsByTagName('body')[0];
    video.dblclick = function () {
    };
    function onDocumentClick(event) {
        // 取消上次延时未执行的方法
        clearTimeout(clickTimeId);
        //执行延时
        clickTimeId = setTimeout(function() {
            //此处为单击事件要执行的代码
            console.log("鼠标单击");
        }, 250);
    }
    function onDocumenDblClick(event) {
        // 取消上次延时未执行的方法
        clearTimeout(clickTimeId);
        console.log("鼠标双击");
      // isFullscreenEnabled();
      let video = document.getElementById('video');

        if (video.requestFullscreen) { //w3c
          console.log(video.requestFullscreen);
          console.log(video.requestFullscreen());
          video.requestFullscreen();
        } else if (video.mozRequestFullScreen) { //moz Firefox
          video.mozRequestFullScreen();
        } else if (video.msRequestFullscreen) { //IE
          video.msRequestFullscreen();
        } else if (video.oRequestFullscreen) { //Opera
          video.oRequestFullscreen();
        } else if (video.webkitRequestFullscreen) { //webkit内核 Chrome Safari
          video.webkitRequestFullScreen();
        }
    }


    const options = {
        video: document.getElementById('video'),
        canvas: document.getElementById('canvas'),
        drawer: document.getElementById('draw'),
        // wsUrl:'ws://111.2.71.225:10080/camera_relay?tcpaddr=admin%3Ahmkj6688%40192.168.1.144',
        // rtspUrl: 'rtsp://admin:hmkj6688@192.168.1.144',
        user: '',
        pwd: ''
    };
    options.wsUrl = data[1];
    options.rtspUrl = data[2];
    let player = new Player(options);
    player.init();
    player.on('error', function () {
        console.log('连接失败')

    });
    player.on('noStream', function () {
        console.log('noStream');
        player.close();
        player = null;
        player = new Player(options);
        player.init();
        player.connect();
    });

    player.on('canplay', function () {
        //player.close();
    });

    player.on('initialCompleted', function () {
    });

    player.on('ROIFinished', function () {
       console.log('ROIFinished');
    });

    player.connect();

    window.onload = function() {
      document.addEventListener('dblclick', onDocumenDblClick);
    };


</script>
</html>