zhaobao
/
layui_back


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286
							<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <title></title>
    <link rel="stylesheet" href="../../../assets/libs/layui/css/layui.css"/>
    <link rel="stylesheet" href="../../../assets/module/admin.css?v=312"/>
</head>
<script>
</script>

<body>

<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <div id="playWind" style="width: 600px; height: 400px;">
            </div>
        </div>
    </div>

    <script src="../../../assets/EZUIKit/ezuikit.js"></script>
    <script src="../../../assets/EZUIKit/js/jquery.min.js"></script>
    <div class="hint">监控模式与多窗口模式对浏览器版本有要求：Chrome: 55+ Firefox: V55+。</div>
    <!--<h2>预览，回放功能示例：</h2>-->
    <textarea id="url" placeholder="这里输入ezopen地址" hidden></textarea>
    <textarea id="accessToken" placeholder="这里输入accessToken" hidden></textarea>
    <!--<div class="btn-container">-->
    <!--    <button id="init">初始化播放</button>-->
    <!--    <button id="play">播放</button>-->
    <!--    <button id="stop">结束</button>-->
    <!--    <button id="getOSDTime">获取OSD时间</button>-->
    <!--    <button id="openSound">打开声音（默认已经开启）</button>-->
    <!--    <button id="closeSound">关闭声音</button>-->
    <!--    <button id="capturePicture">视频截图</button>-->
    <!--    <button id="startSave">开始录像</button>-->
    <!--    <button id="stopSave">停止录像</button>-->
    <!--    <button id="enableZoom">开启电子放大</button>-->
    <!--    <button id="closeZoom">关闭电子放大</button>-->
    <!--</div>-->
    <!--<div id="playWind" style="width: 600px; height: 400px;">-->
</div>
<script>
    function getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        //如果地址栏中出现中文则进行编码
        var r = encodeURI(window.location.search).substr(1).match(reg);
        if (r != null) {
            //将中文编码的字符重新变成中文
            return decodeURI(unescape(r[2]));
        }
        return null;
    }

    var ipCameraUrl = getUrlParam("ipCameraUrl");
    console.log(ipCameraUrl);
    var url = ipCameraUrl.split("_1_")[0];
    var accessToken = ipCameraUrl.split("_1_")[1];
    $("#url").val(url);
    $("#accessToken").val(accessToken);
    $(function () {
        function handleError(e) {
            console.log('捕获到错误', e)
            // log(JSON.stringify(e),'error');
            //alert(e)
        }

        function handleSuccess() {
            console.log("播放成功回调函数，此处可执行播放成功后续动作");
        }

        var url = $('#url').val().trim();
        var accessToken = $('#accessToken').val().trim();
        var decoder = new EZUIKit.EZUIPlayer({
            id: 'playWind',
            autoplay: true,
            url: url,
            accessToken: accessToken,
            decoderPath: '../../../assets/EZUIKit/',
            width: 600,
            height: 400,
            handleError: handleError,
            handleSuccess: handleSuccess,
        });
        // 这里是打印日志，本例抛出到播放页面
        // decoder.on('log', log);

        function log(str, className) {
            var div = document.createElement('DIV');
            div.className = className || 'normal';
            div.innerHTML = (new Date()).Format('yyyy-MM-dd hh:mm:ss.S') + JSON.stringify(str);
            document.body.appendChild(div);
        }

        $("#start").click(function () {
            function handleError(e) {
                console.log('handleError', e)
            }

            function handleSuccess() {
                console.log('handleSuccess')
            }

            decoder.play({
                handleError: handleError,
            });
        })
        $("#stop").click(function () {
            /*停止播放方法1*/
            // decoder.stop();
            /*停止播放方法2 - promise模式*/
            var stopPromise = decoder.stop();
            stopPromise.then(function () {
                console.log("关闭成功，用户执行关闭成功后的操作");
            })
        })
        $("#getOSDTime").click(function () {
            var getOSDTimePromise = decoder.getOSDTime();
            getOSDTimePromise.then(function (data) {
                console.log("getOSDTime success", data)
            })
        })
        $("#openSound").click(function () {
            decoder.openSound();
        })
        $("#closeSound").click(function () {
            decoder.closeSound();
        })
        $("#capturePicture").click(function () {
            /*截图方法1*/
            // decoder.capturePicture(0,'default');
            /*截图方法2*/
            var capturePicturePromise = decoder.capturePicture(0, 'default');
            capturePicturePromise.then(function (data) {
                console.log("截图成功，用户执行关闭成功后的操作", data);
            })
        })
        $("#startSave").click(function () {
            // decoder.startSave(0, (new Date().getTime() + 'video'));
            /*开始录制方法2*/
            var startSavePromise = decoder.startSave(0, (new Date().getTime() + 'video'));
            startSavePromise.then(function (data) {
                console.log("start save success", startSavePromise)
            })
                .catch(function (error) {
                    console.log("start Save error", error)
                })
        })
        $("#stopSave").click(function () {
            /*结束录制方法1*/
            // decoder.stopSave(0);
            /*结束录制方法2*/
            var stopSavePromise = decoder.stopSave(0);
            stopSavePromise.then(function (data) {
                console.log("stop save success", stopSavePromise)
            })
                .catch(function (error) {
                    console.log("stop Save error", error)
                })
        })
        $("#play").click(function () {
            decoder.play();
        })
        $("#enableZoom").click(function () {
            decoder.enableZoom();
        })
        $("#closeZoom").click(function () {
            decoder.closeZoom();
        })
    });
    // $("#init").click(function () {
    //     function handleError(e) {
    //         console.log('捕获到错误', e)
    //         // log(JSON.stringify(e),'error');
    //         //alert(e)
    //     }
    //     function handleSuccess() {
    //         console.log("播放成功回调函数，此处可执行播放成功后续动作");
    //     }
    //     var url = $('#url').val().trim();
    //     var accessToken = $('#accessToken').val().trim();
    //     var decoder = new EZUIKit.EZUIPlayer({
    //         id: 'playWind',
    //         autoplay: true,
    //         url: url,
    //         accessToken: accessToken,
    //         decoderPath: '../../../assets/EZUIKit/',
    //         width: 600,
    //         height: 400,
    //         handleError: handleError,
    //         handleSuccess: handleSuccess,
    //     });
    //     // 这里是打印日志，本例抛出到播放页面
    //     // decoder.on('log', log);
    //
    //     function log(str, className) {
    //         var div = document.createElement('DIV');
    //         div.className = className || 'normal';
    //         div.innerHTML = (new Date()).Format('yyyy-MM-dd hh:mm:ss.S') + JSON.stringify(str);
    //         document.body.appendChild(div);
    //     }
    //
    //     $("#start").click(function () {
    //         function handleError(e) {
    //             console.log('handleError', e)
    //         }
    //
    //         function handleSuccess() {
    //             console.log('handleSuccess')
    //         }
    //
    //         decoder.play({
    //             handleError: handleError,
    //         });
    //     })
    //     $("#stop").click(function () {
    //         /*停止播放方法1*/
    //         // decoder.stop();
    //         /*停止播放方法2 - promise模式*/
    //         var stopPromise = decoder.stop();
    //         stopPromise.then(function () {
    //             console.log("关闭成功，用户执行关闭成功后的操作");
    //         })
    //     })
    //     $("#getOSDTime").click(function () {
    //         var getOSDTimePromise = decoder.getOSDTime();
    //         getOSDTimePromise.then(function (data) {
    //             console.log("getOSDTime success", data)
    //         })
    //     })
    //     $("#openSound").click(function () {
    //         decoder.openSound();
    //     })
    //     $("#closeSound").click(function () {
    //         decoder.closeSound();
    //     })
    //     $("#capturePicture").click(function () {
    //         /*截图方法1*/
    //         // decoder.capturePicture(0,'default');
    //         /*截图方法2*/
    //         var capturePicturePromise = decoder.capturePicture(0, 'default');
    //         capturePicturePromise.then(function (data) {
    //             console.log("截图成功，用户执行关闭成功后的操作", data);
    //         })
    //     })
    //     $("#startSave").click(function () {
    //         // decoder.startSave(0, (new Date().getTime() + 'video'));
    //         /*开始录制方法2*/
    //         var startSavePromise = decoder.startSave(0, (new Date().getTime() + 'video'));
    //         startSavePromise.then(function (data) {
    //             console.log("start save success", startSavePromise)
    //         })
    //             .catch(function (error) {
    //                 console.log("start Save error", error)
    //             })
    //     })
    //     $("#stopSave").click(function () {
    //         /*结束录制方法1*/
    //         // decoder.stopSave(0);
    //         /*结束录制方法2*/
    //         var stopSavePromise = decoder.stopSave(0);
    //         stopSavePromise.then(function (data) {
    //             console.log("stop save success", stopSavePromise)
    //         })
    //             .catch(function (error) {
    //                 console.log("stop Save error", error)
    //             })
    //     })
    //     $("#play").click(function () {
    //         decoder.play();
    //     })
    //     $("#enableZoom").click(function () {
    //         decoder.enableZoom();
    //     })
    //     $("#closeZoom").click(function () {
    //         decoder.closeZoom();
    //     })
    // })
</script>
</body>

</html>