‘liusuyi’
2023-05-24 0484a33f0550b344382f0d3caac5b26bbba23ca0
ard-work/target/classes/templates/test.html
@@ -9,115 +9,127 @@
    <link rel="stylesheet" th:href="@{/css/bootstrap.css}"/>
    <script th:src="@{/js/bootstrap.js}"></script>
    <style>
    .top-buffer { margin-top:10px; }
        .top-buffer {
            margin-top: 10px;
        }
    </style>
<body>
<div class="container">
        <div class="row ">
            <div class="dropdown">
                相机id:
                <select id="select">
                </select>
            </div>
    <div class="row ">
        <div class="dropdown">
            相机id:<select id="select">
        </select>
        </div>
        <div class="row top-buffer">
            <div class="col-md-1 col-md-offset-1">
                <button id="up" type="button" class="btn btn-primary">上</button>
            </div>
            <div class="col-md-4 col-md-offset-3">
                <div class="btn-group" role="group">
                    <button id="controlZoomIn" type="button" class="btn btn-primary">调焦-</button>
                    <button id="controlZoomOut" type="button" class="btn btn-primary">调焦+</button>
                </div>
            </div>
    </div>
    <div class="row top-buffer">
        <div class="col-md-1 col-md-offset-1">
            <button id="up" type="button" class="btn btn-primary">上</button>
        </div>
        <div class="row ">
            <div class="col-md-1">
                <button id="left" type="button" class="btn btn-primary">左</button>
            </div>
            <div class="col-md-1 col-md-offset-1">
                <button id="right" type="button" class="btn btn-primary">右</button>
            </div>
            <div class="col-md-4 col-md-offset-2">
                <div class="btn-group" role="group">
                    <button id="controlFocusNear" type="button" class="btn btn-primary">聚焦-</button>
                    <button id="controlFocusFar" type="button" class="btn btn-primary">聚焦+</button>
                </div>
            </div>
        </div>
        <div class="row ">
            <div class="col-md-1 col-md-offset-1">
                <button id="down" type="button" class="btn btn-primary">下</button>
            </div>
            <div class="col-md-4 col-md-offset-3">
                <div class="btn-group" role="group">
                    <button id="controlIrisOpen" type="button" class="btn btn-primary">光圈-</button>
                    <button id="controlIrisClose" type="button" class="btn btn-primary">光圈+</button>
                </div>
            </div>
        </div>
        <div class="row top-buffer">
            <div class="input-group">
                <span class="input-group-addon">P值:</span>
                <input id="p" class="form-control" placeholder="请输入P值"/>
            </div>
            <div class="input-group">
                <span class="input-group-addon">T值:</span>
                <input id="t" class="form-control" placeholder="请输入T值"/>
            </div>
            <div class="input-group">
                <span class="input-group-addon">Z值:</span>
                <input id="z" class="form-control" placeholder="请输入Z值"/>
            </div>
        </div>
        <div class="row top-buffer">
        <div class="col-md-4 col-md-offset-3">
            <div class="btn-group" role="group">
                <button id="getPTZ" type="button" class="btn btn-default">获取ptz</button>
                <button id="setPTZ" type="button" class="btn btn-default">设置ptz</button>
                <button id="setPreset" type="button" class="btn btn-default">设预置点</button>
                <button id="gotoPreset" type="button" class="btn btn-default">调预置点</button>
                <button id="getZeroPTZ" type="button" class="btn btn-default">调用零方位角</button>
                <button id="setZeroPTZ" type="button" class="btn btn-default">设置零方位角</button>
            </div>
        </div>
        <div class="row top-buffer">
            <div class="btn-group" role="group">
                <button id="FocusMode" type="button" class="btn btn-default">手动聚焦</button>
                <div id="focusDiv" class="input-group">
                    <span class="input-group-addon">聚焦值:</span>
                    <input id="focus" class="form-control" placeholder="聚焦值"/>
                </div>
                <button id="getFocusPos" type="button" class="btn btn-default">获取聚焦值</button>
                <button id="setFocusPos" type="button" class="btn btn-default">设置聚焦值</button>
            </div>
        </div>
        <div class="row top-buffer">
            <div class="btn-group" role="group">
                <button id="WiperPwron" type="button" class="btn btn-default">开启雨刷</button>
                <button id="Defogcfg" type="button" class="btn btn-default">开启透雾</button>
                <button id="Infrarecfg" type="button" class="btn btn-default">开启红外</button>
                <button id="HeateRpwron" type="button" class="btn btn-default">开启云台加热</button>
                <button id="CameraDeicing" type="button" class="btn btn-default">开启镜头加热</button>
            </div>
        </div>
        <div class="row top-buffer">
            <div class="btn-group" role="group">
                <button id="voice" type="button" class="btn btn-default">开始语音对讲</button>
                <button id="record" type="button" class="btn btn-default">开始录像</button>
                <button id="realCutPic" type="button" class="btn btn-default">实时抓图</button>
                <button id="saveCutPic" type="button" class="btn btn-default">存储抓图</button>
            </div>
        </div>
        <div class="row top-buffer">
            <div class="col-md-6">
                <img class="thumbnail" id="imgContainer" style="width: 500px; height: 400px;padding: 5px 5px;"/>
            </div>
            <div class="col-md-6">
                <video id="video" muted autoplay loop controls  style="width: 800px; height: 100%; object-fit: fill" />
                <button id="controlZoomIn" type="button" class="btn btn-primary">调焦-</button>
                <button id="controlZoomOut" type="button" class="btn btn-primary">调焦+</button>
            </div>
        </div>
    </div>
</body>
    <div class="row ">
        <div class="col-md-1">
            <button id="left" type="button" class="btn btn-primary">左</button>
        </div>
        <div class="col-md-1 col-md-offset-1">
            <button id="right" type="button" class="btn btn-primary">右</button>
        </div>
        <div class="col-md-4 col-md-offset-2">
            <div class="btn-group" role="group">
                <button id="controlFocusNear" type="button" class="btn btn-primary">聚焦-</button>
                <button id="controlFocusFar" type="button" class="btn btn-primary">聚焦+</button>
            </div>
        </div>
    </div>
    <div class="row ">
        <div class="col-md-1 col-md-offset-1">
            <button id="down" type="button" class="btn btn-primary">下</button>
        </div>
        <div class="col-md-4 col-md-offset-3">
            <div class="btn-group" role="group">
                <button id="controlIrisOpen" type="button" class="btn btn-primary">光圈-</button>
                <button id="controlIrisClose" type="button" class="btn btn-primary">光圈+</button>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-6">
            <div class="row top-buffer">
                <div class="input-group">
                    <span class="input-group-addon">目的坐标值:</span>
                    <input id="targetPostion" class="form-control" placeholder="目的坐标"/>
                    <button id="setTargetPostion" type="button" class="btn btn-default">指向坐标</button>
                </div>
                <div class="input-group">
                    <span class="input-group-addon">P值:</span>
                    <input id="p" class="form-control" placeholder="请输入P值"/>
                </div>
                <div class="input-group">
                    <span class="input-group-addon">T值:</span>
                    <input id="t" class="form-control" placeholder="请输入T值"/>
                </div>
                <div class="input-group">
                    <span class="input-group-addon">Z值:</span>
                    <input id="z" class="form-control" placeholder="请输入Z值"/>
                </div>
            </div>
            <div class="row top-buffer">
                <div class="btn-group" role="group">
                    <button id="getPTZ" type="button" class="btn btn-default">获取ptz</button>
                    <button id="setPTZ" type="button" class="btn btn-default">设置ptz</button>
                    <button id="setPreset" type="button" class="btn btn-default">设预置点</button>
                    <button id="gotoPreset" type="button" class="btn btn-default">调预置点</button>
                    <button id="getZeroPTZ" type="button" class="btn btn-default">调用零方位角</button>
                    <button id="setZeroPTZ" type="button" class="btn btn-default">设置零方位角</button>
                </div>
            </div>
            <div class="row top-buffer">
                <div class="btn-group" role="group">
                    <button id="FocusMode" type="button" class="btn btn-default">手动聚焦</button>
                    <div id="focusDiv" class="input-group">
                        <span class="input-group-addon">聚焦值:</span>
                        <input id="focus" class="form-control" placeholder="聚焦值"/>
                    </div>
                    <button id="getFocusPos" type="button" class="btn btn-default">获取聚焦值</button>
                    <button id="setFocusPos" type="button" class="btn btn-default">设置聚焦值</button>
                </div>
            </div>
            <div class="row top-buffer">
                <div class="btn-group" role="group">
                    <button id="WiperPwron" type="button" class="btn btn-default">开启雨刷</button>
                    <button id="Defogcfg" type="button" class="btn btn-default">开启透雾</button>
                    <button id="Infrarecfg" type="button" class="btn btn-default">开启红外</button>
                    <button id="HeateRpwron" type="button" class="btn btn-default">开启云台加热</button>
                    <button id="CameraDeicing" type="button" class="btn btn-default">开启镜头加热</button>
                </div>
            </div>
            <div class="row top-buffer">
                <div class="btn-group" role="group">
                    <button id="voice" type="button" class="btn btn-default">开始语音对讲</button>
                    <button id="record" type="button" class="btn btn-default">开始录像</button>
                    <button id="realCutPic" type="button" class="btn btn-default">实时抓图</button>
                    <button id="saveCutPic" type="button" class="btn btn-default">存储抓图</button>
                </div>
            </div>
            <div class="row top-buffer">
                <div class="col-md-6">
                    <img class="thumbnail" id="imgContainer" style="width: 500px; height: 300px;"/>
                </div>
            </div>
        </div>
        <div class="col-md-1"/>
        <div class="col-md-5">
            <div class="row top-buffer">
                <video id="video" muted autoplay loop controls style="width: 800px; height: 100%; object-fit: fill;"/>
            </div>
        </div>
    </div>
</div>
<script th:inline="javascript">
    var cameraId, opt, token;
    window.onload = function () {
@@ -134,7 +146,10 @@
                        ipaddr: arr[i].ip,
                        username: arr[i].username,
                        password: arr[i].password,
                        port: arr[i].rtspPort
                        port: arr[i].rtspPort,
                        longitude: arr[i].longitude,
                        latitude: arr[i].latitude,
                        altitude: arr[i].altitude
                    };
                    cameraMap.set(arr[i].id, camera);
                    //先创建好select里面的option元素
@@ -371,6 +386,34 @@
                'Authorization': token
            },
            url: "../hik/setPTZ",
            type: "post",
            dataType: "json",
            data: JSON.stringify(myEntity),
            success: function (data) {
                console.log(data);
            }
        })
    })
    $("#setTargetPostion").click(function () {
        cameraId = $('#select option:selected').val();
        var camera = cameraMap.get(cameraId);
        var camP = camera.longitude + ',' + camera.latitude + ',' + camera.altitude;
        var targetP = $('#targetPostion').val();
        //定义一个带有Map字段的实体对象
        var myEntity = {
            channelNum: 1,
            cameraId: cameraId,
            targetPosition: targetP,
            camPosition: camP,
        };
        console.log(myEntity)
        $.ajax({
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
                'Authorization': token
            },
            url: "../hik/setTargetPosition",
            type: "post",
            dataType: "json",
            data: JSON.stringify(myEntity),
@@ -636,7 +679,7 @@
            data: JSON.stringify(opt),
            success: function (data) {
                console.log(data.data);
                $("#imgContainer").attr("src","data:image/png;base64,"+data.data);
                $("#imgContainer").attr("src", "data:image/png;base64," + data.data);
            }
        })
    })
@@ -739,7 +782,7 @@
            } else if (camera.type == "dh") {
                realViewDh("127.0.0.1", ID, camera.username, camera.password, camera.ipaddr, camera.port);
            } else {
                realViewHik("192.168.1.15", ID, camera.username, camera.password, camera.ipaddr,  camera.port);
                realViewHik("192.168.1.15", ID, camera.username, camera.password, camera.ipaddr, camera.port);
            }
        }
    });
@@ -785,4 +828,5 @@
        webRtcServer.disconnect();
    }
</script>
</body>
</html>