ShinobiSystems
/
Shinobi
mirror of https://gitlab.com/Shinobi-Systems/Shinobi.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

add more info display for highly detailed matrices on liveGrid

better-plugin-controller
Moe 2024-02-06 10:56:24 -08:00
parent 1bfa895a80
commit 6b77c42cae
2 changed files with 26 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/assets/css/bs5.liveGrid.css
View File

@ -189,7 +189,9 @@ img.circle-img,div.circle-img{border-radius:50%;height:50px;width:50px}
.stream-objects .stream-detected-object{position:absolute;top:0;left:0;border:3px dotted red;background:transparent;border-radius:5px}
.stream-objects .stream-detected-point{position:absolute;top:0;left:0;border:3px solid yellow;background:transparent;border-radius:5px}
.stream-objects .point{position:absolute;top:0;left:0;border:3px solid red;border-radius:50%}
.stream-objects .matrix-info{
margin-top: 20%; background:rgba(0,0,0,0.3);color:#fff; width: 100%; padding: 1rem; font-family:monospace;
}
.monitor_item .gps-map {
position: absolute;
width: 190px;

24
web/assets/js/bs5.monitorsUtils.js
View File

@ -655,8 +655,30 @@ function drawMatrices(event,options){
theContainer.find(`.stream-detected-object[name="${objectTagGroup}"]`).remove()
var html = ''
$.each(event.details.matrices,function(n,matrix){
html += `<div class="stream-detected-object" name="${objectTagGroup}" style="height:${heightRatio * matrix.height}px;width:${widthRatio * matrix.width}px;top:${heightRatio * matrix.y}px;left:${widthRatio * matrix.x}px;">`
html += `<div class="stream-detected-object" name="${objectTagGroup}" style="height:${heightRatio * matrix.height}px;width:${widthRatio * matrix.width}px;top:${heightRatio * matrix.y}px;left:${widthRatio * matrix.x}px;border-color: ${matrix.color};">`
if(matrix.tag)html += `<span class="tag">${matrix.tag}${!isNaN(matrix.id) ? ` <small class="label label-default">${matrix.id}</small>`: ''}</span>`
if(matrix.notice)html += `<div class="matrix-info" style="color:yellow">${matrix.notice}</div>`;
if(matrix.missingRecently){
html += `<div class="matrix-info" style="color:yellow">${matrix.missingRecently.join(',')}</div>`;
}
if(matrix.pose){
var pose = matrix.pose;
html += `<div class="matrix-info text-left">`;
if(pose.isPersonFallen)html += `<div><small>Stance</small><br>${pose.isPersonFallen}</div>`;
if(pose.isPersonReaching){
html += `<div><small>Left Hand</small><br>${pose.isPersonReaching.left.pose}</div>`;
html += `<div><small>Right Hand</small><br>${pose.isPersonReaching.right.pose}</div>`;
}
// if(pose.isPersonTouchingWaistOrHips)html += `<div>Waist or Hips : ${pose.isPersonTouchingWaistOrHips}</div>`;
html += `</div>`;
}
if(matrix.nearBy){
html += `<div class="matrix-info">`
matrix.nearBy.forEach((nearMatrix) => {
html += `<div class="mb-1">${nearMatrix.tag} <small class="label label-default">${nearMatrix.id}</small> (${nearMatrix.overlapPercent}%)</div>`
});
html += `</div>`
}
html += '</div>'
})
theContainer.append(html)