Working NVR plugin

This commit is contained in:
Ziver Koc 2022-05-20 13:04:23 +02:00
parent 3a278b0ca6
commit 2501831a59
15 changed files with 268 additions and 57 deletions

Binary file not shown.

View file

@ -82,9 +82,9 @@
<div class="form-group">
<label class="control-label">Type:</label>
<select class="form-control" name="type">
{{#availableCameras}}
{{#availableCameraConfigClasses}}
<option>{{.getName()}}</option>
{{/availableCameras}}
{{/availableCameraConfigClasses}}
</select>
</div>
@ -102,7 +102,7 @@
</div>
</div>
<div id="camera-data-conf-template" class="hidden">
{{#cameraConf}}
{{#availableCameraObjectConfig}}
<div id="{{.clazz.getName()}}">
{{#.params}}
<div class="form-group">
@ -118,6 +118,6 @@
</div>
{{/.params}}
</div>
{{/cameraConf}}
{{/availableCameraObjectConfig}}
</div>

View file

@ -1,9 +1,19 @@
<h1 class="page-header">Details for <a href="#">{{camera.getName()}}</a></h1>
<style>
#view-main {
width: 100%;
height: 480px;
}
</style>
<div class="col-md-12">
<video width="100%" height="480" controls>
<source src="rtsp://admin:xxxx@192.168.10.223:554/H.264">
Your browser does not support the video tag.
<video id="view-main" width="100%" height="480" class="video-js vjs-fill" preload="auto" data-setup='{}' controls autoplay muted >
<source src="{{camera.getPlaylistRelativeUrl()}}">
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
<a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video.</a>
</p>
</video>
</div>
@ -24,7 +34,7 @@
</thead>
<tr>
<th class="text-right">Type:</th>
<td>{{camera.getDeviceData().getClass().getSimpleName()}}</td>
<td>{{camera.getDeviceConfig().getClass().getSimpleName()}}</td>
</tr>
<tr>
<th class="text-right">Owner:</th>
@ -40,3 +50,7 @@
</div>
</div>
</div>
<link href="css/video-js.min.css" rel="stylesheet">
<script src="js/video.min.js"></script>
<script src="js/videojs-http-streaming.min.js"></script>

View file

@ -1,9 +1,7 @@
<h1 class="page-header">Camera Monitor</h1>
<style>
.monitor-view {
width: 100%;
height: 600px;
height: 740px;
}
</style>
@ -11,7 +9,7 @@
<tr>
<td>
<video id="view1" class="video-js vjs-fill" preload="auto" data-setup='{}' controls autoplay muted >
<source src="{{stream1}}">
<source src="{{camera1.getPlaylistRelativeUrl()}}">
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
<a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video.</a>
@ -21,7 +19,7 @@
<td>
<video id="view2" class="video-js vjs-fill" preload="auto" data-setup='{}' controls autoplay muted >
<source src="{{stream2}}">
<source src="{{camera2.getPlaylistRelativeUrl()}}">
</video>
</td>
</tr>
@ -29,13 +27,13 @@
<tr>
<td>
<video id="view3" class="video-js vjs-fill" preload="auto" data-setup='{}' controls autoplay muted >
<source src="{{stream3}}">
<source src="{{camera3.getPlaylistRelativeUrl()}}">
</video>
</td>
<td>
<video id="view4" class="video-js vjs-fill" preload="auto" data-setup='{}' controls autoplay muted >
<source src="{{stream4}}">
<source src="{{camera4.getPlaylistRelativeUrl()}}">
</video>
</td>
</tr>

View file

@ -9,15 +9,11 @@
<thead>
<th class="col-md-4">Name</th>
<th class="col-md-3">Type</th>
<th class="col-md-2">Data</th>
<th class="col-md-2">Last Update</th>
</thead>
{{#cameras}}
<tr>
<td><a href="?id={{.getId()}}">{{.getName()}}</a></td>
<td>{{.getDeviceConfig().getClass().getSimpleName()}}</td>
<td>{{.getDeviceData()}}</td>
<td><span class="timestamp">{{.getDeviceData().getTimestamp()}}</span></td>
</tr>
{{/cameras}}
</table>