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

refactor log writer for ui

merge-requests/521/merge^2
Moe 2024-10-10 12:05:40 -07:00
parent 73da4e0823
commit 8aa8943244
10 changed files with 131 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
languages/en_CA.json
View File

@ -222,6 +222,7 @@
"Full URL Path": "Full URL Path",
"Streamed Logs": "Streamed Logs",
"Saved Logs": "Saved Logs",
"User Logs": "User Logs",
"Logs": "Logs",
"Full Stream URL": "Full Stream URL",
"Manual": "Manual",

1
web/assets/css/dashboard.css
View File

@ -214,6 +214,7 @@ body {
}
.text-white-50 { color: rgba(255, 255, 255, .5); }
.text-yellow { color: yellow; }
.bg-purple { background-color: #6f42c1; }
.bg-darker { background-color: #121417; }

15
web/assets/js/bs5.dashboard-base.buttons.js
View File

@ -86,17 +86,20 @@ $(document).ready(function(){
var el = $(this)
var targetElement = el.attr('data-target')
var classToToggle = el.attr('class_toggle')
var iconClassesToToggle = el.attr('icon-toggle').split(' ')
var iconTarget = el.attr('icon-child')
var iconTargetElement = el.find(el.attr('icon-child'))
var iconClassesToToggle = el.attr('icon-toggle')
var togglPosition = $(targetElement).hasClass(classToToggle) ? 0 : 1
var classToggles = dashboardOptions().class_toggle || {}
classToggles[targetElement] = [classToToggle,togglPosition,iconClassesToToggle,iconTarget];
dashboardOptions('class_toggle',classToggles)
$(targetElement).toggleClass(classToToggle)
iconTargetElement
.removeClass(iconClassesToToggle[togglPosition === 1 ? 0 : 1])
.addClass(iconClassesToToggle[togglPosition])
if(iconClassesToToggle){
iconClassesToToggle = iconClassesToToggle.split(' ')
var iconTarget = el.attr('icon-child')
var iconTargetElement = el.find(el.attr('icon-child'))
iconTargetElement
.removeClass(iconClassesToToggle[togglPosition === 1 ? 0 : 1])
.addClass(iconClassesToToggle[togglPosition])
}
})
.on('keyup','.search-parent .search-controller',function(){
var _this = this;

55
web/assets/js/bs5.dashboard-base.js
View File

@ -834,6 +834,15 @@ function shakeLogWriterIcon(){
logWriterIconIndicator.removeClass('animate-shake')
},3000)
}
function shakeLogWriterMonitorIcon(monitorId){
if(logStreamWiggling[monitorId])return;
var theWiggler = logStreamWiggler[monitorId];
theWiggler.addClass('animate-shake text-yellow')
logStreamWiggling[monitorId] = setTimeout(function(){
logStreamWiggling[monitorId] = null;
theWiggler.removeClass('animate-shake text-yellow')
},3000)
}
var logWriterFloodTimeout = null
var logWriterFloodCounter = 0
var logWriterFloodLock = null
@ -854,23 +863,20 @@ function buildLogRow(v){
</div>`
return html
}
function logWriterDraw(id,data){
// if(logWriterFloodLock)return debugLog('logWriterFloodLock : Log was dropped');
var elementTags = '#global-log-stream,'+id+'.monitor_item .logs:visible,'+id+'#tab-monitorSettings:visible .logs'
// if(logWriterFloodTimeout){
// ++logWriterFloodCounter
// }
// if(logWriterFloodCounter > 10){
// window.logWriterFloodLock = setTimeout(function(){
// delete(logWriterFloodLock)
// },10000)
// }
// clearTimeout(logWriterFloodTimeout)
// logWriterFloodTimeout = setTimeout(function(){
// delete(logWriterFloodTimeout)
// logWriterFloodCounter = 0
// },2000)
function removeLogRows(logElements){
logElements.each(function(n,v){
var theRows = logElements.find('.log-item')
if(theRows.length > 10){
theRows.last().remove()
}
})
}
function logWriterDraw(monitorId,data){
if(!data.time)data.time = formattedTime();
var isUserLog = monitorId === '$USER'
var logElement = isUserLog ? logStreams['_USER'] : logStreams[monitorId];
var html = buildLogRow({
ke: data.ke,
mid: data.mid,
@ -878,13 +884,18 @@ function logWriterDraw(id,data){
time: data.time,
})
shakeLogWriterIcon()
$(elementTags).prepend(html).each(function(n,v){
var el = $(v);
var theRows = el.find('.log-item')
if(theRows.length > 10){
theRows.last().remove()
try{
shakeLogWriterMonitorIcon(isUserLog ? '_USER' : monitorId)
logElement.prepend(html)
removeLogRows(logElement)
if(tabTree.name === 'monitorSettings' && monitorEditorSelectedMonitor.mid === monitorId){
monitorLogStreamElement.prepend(html)
removeLogRows(monitorLogStreamElement)
}
})
logStreamLastTimeEl[monitorId].text(formattedTime(new Date(), true))
}catch(err){
console.log(`Failed Log Write`, data)
}
}
function setSwitchUIState(systemSwitch,toggleState){

4
web/assets/js/bs5.embed.js
View File

@ -445,7 +445,7 @@ function signalCheckLiveStream(options){
var streamType = subStreamChannel ? monitorDetails.substream ? monitorDetails.substream.output.stream_type : 'hls' : monitorDetails.stream_type
function failedStreamCheck(){
if(monitorConfig.signal_check_log == 1){
logWriterDraw('[mid="'+monitorId+'"]',{
logWriterDraw(monitorId, {
log: {
type: 'Stream Check',
msg: lang.clientStreamFailedattemptingReconnect
@ -456,7 +456,7 @@ function signalCheckLiveStream(options){
}
function succeededStreamCheck(){
if(monitorConfig.signal_check_log == 1){
logWriterDraw('[mid="'+monitorId+'"]',{
logWriterDraw(monitorId, {
log: {
type: 'Stream Check',
msg : lang.Success

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

@ -852,7 +852,7 @@ function signalCheckLiveStream(options){
var streamType = subStreamChannel ? monitorDetails.substream ? monitorDetails.substream.output.stream_type : 'hls' : monitorDetails.stream_type
function failedStreamCheck(){
if(monitorConfig.signal_check_log == 1){
logWriterDraw('[mid="'+monitorId+'"]',{
logWriterDraw(monitorId, {
log: {
type: 'Stream Check',
msg: lang.clientStreamFailedattemptingReconnect
@ -863,7 +863,7 @@ function signalCheckLiveStream(options){
}
function succeededStreamCheck(){
if(monitorConfig.signal_check_log == 1){
logWriterDraw('[mid="'+monitorId+'"]',{
logWriterDraw(monitorId, {
log: {
type: 'Stream Check',
msg : lang.Success

85
web/assets/js/bs5.logViewer.js
View File

@ -1,28 +1,49 @@
var logStreams = {}
var logStreamWiggler = {}
var logStreamWiggling = {}
var logStreamLastTimeEl = {}
var monitorLogStreamElement = $(`#tab-monitorSettings .logs`);
$(document).ready(function(e){
var theWindow = $('#tab-logViewer')
var logTypeSelector = $('#log_monitors')
var dateSelector = $('#logs_daterange')
var savedLogRows = $('#saved-logs-rows')
var globalLogStream = $('#global-log-stream')
var theForm = theWindow.find('form')
var logViewerDataInMemory = {}
//log viewer
loadDateRangePicker(dateSelector,{
onChange: function(start, end, label) {
drawLogRows()
function setLogStreamElements(monitorId){
logStreams[monitorId] = $(`.logViewerStream[data-mid="${monitorId}"],.monitor_item[data-mid="${monitorId}"] .logs:visible`)
logStreamWiggler[monitorId] = $(`#logViewerStreamContainer_${monitorId} .fa-exclamation-triangle`)
logStreamLastTimeEl[monitorId] = $(`#logViewerStreamContainer_${monitorId} .lastlogtime`)
}
function drawMonitorContainer(monitor){
var groupKey = monitor.ke
var monitorId = monitor.mid
var notExist = $(`#logViewerStreamContainer_${monitorId}`).length === 0;
if(notExist){
var dataTarget = `.logViewerStream[data-mid='${monitorId}']`
var classToggle = (dashboardOptions().class_toggle || {})[dataTarget] || []
var html = `<div id="logViewerStreamContainer_${monitorId}" class="card ${definitions.Theme.isDark ? 'btn-default' : ''} mb-3">
<div id="logViewerStreamHeader_${monitorId}" class_toggle="d-none" data-target="${dataTarget}" class="card-header cursor-pointer d-flex">
<div class="col">
<i class="fa fa-exclamation-triangle"></i> &nbsp; ${monitor.name} <small>(${monitor.mid})</small>
</div>
<div class="lastlogtime col text-end"></div>
</div>
<div data-mid="${monitorId}" data-ke="${groupKey}" class="logViewerStream card-body ${classToggle[1] === 1 ? 'd-none' : ''}"></div>
</div>`
globalLogStream.append(html);
setLogStreamElements(monitorId)
}
})
addOnTabOpen('logViewer',function(){
logTypeSelector.find('optgroup option').remove()
var html = ''
$.each(loadedMonitors,function(n,v){
html += createOptionHtml({
value: v.mid,
label: v.name,
})
}
function drawMonitorContainers(){
globalLogStream.empty()
drawMonitorContainer({ mid: '_USER', ke: $user.ke, name: lang['User Logs'] })
$.each(loadedMonitors,function(n,monitor){
drawMonitorContainer(monitor)
})
logTypeSelector.find('optgroup').html(html)
drawLogRows()
})
}
function drawLogRows(){
var html = ''
var selectedLogType = logTypeSelector.val()
@ -62,4 +83,38 @@ $(document).ready(function(e){
downloadJSON(logViewerDataInMemory,'Shinobi_Logs_'+(new Date())+'.json')
return false;
})
loadDateRangePicker(dateSelector,{
onChange: function(start, end, label) {
drawLogRows()
}
})
addOnTabOpen('logViewer',function(){
logTypeSelector.find('optgroup option').remove()
var html = ''
$.each(loadedMonitors,function(n,v){
html += createOptionHtml({
value: v.mid,
label: v.name,
})
})
logTypeSelector.find('optgroup').html(html)
drawLogRows()
})
drawMonitorContainers()
onDashboardReady(function(){
drawMonitorContainers()
})
onWebSocketEvent(function (d){
switch(d.f){
case'monitor_edit':
drawMonitorContainer(d.mon)
break;
case'monitor_watch_on':
setLogStreamElements(d.id || d.mid)
break;
case'monitor_watch_off':case'monitor_stopping':
setLogStreamElements(d.id || d.mid)
break;
}
})
})

2
web/assets/js/bs5.monitorSettings.js
View File

@ -971,7 +971,7 @@ var showInputMappingFields = function(showMaps){
function setFieldVisibilityNewWay(){
var validation = getMonitorEditFormFields()
if(!validation.ok){
return console.log('Failed setFieldVisibilityNewWay',new Error(),validation)
return console.log('Failed setFieldVisibilityNewWay', validation)
}
var monitorConfig = validation.monitorConfig
var monitorDetails = safeJsonParse(monitorConfig.details)

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

@ -679,13 +679,17 @@ function redAlertNotify(options) {
hide: options.hide === undefined ? false : options.hide,
delay: options.delay || 30000
};
if (redAlertNotice) {
redAlertNotice.update(notifyOptions);
} else {
redAlertNotices[title] = new PNotify(notifyOptions);
redAlertNotices[title].on('close', function() {
redAlertNotices[title] = null;
});
try{
if (redAlertNotice) {
redAlertNotice.update(notifyOptions);
} else {
redAlertNotices[title] = new PNotify(notifyOptions);
redAlertNotices[title].on('close', function() {
redAlertNotices[title] = null;
});
}
}catch(err){
console.error('redAlertNotify ERROR',err)
}
}
function buildPosePoints(bodyParts, x, y){

2
web/assets/js/bs5.startup.js
View File

@ -164,7 +164,7 @@ onWebSocketEvent(function (d){
}
break;
case'log':
logWriterDraw('[data-mid="'+d.mid+'"][data-ke="'+d.ke+'"]',d)
logWriterDraw(d.mid, d)
break;
case'os'://indicator
//cpu