From 211cdf2382bac83460650d952a8c68f19100698c Mon Sep 17 00:00:00 2001 From: rudolfkoenig <> Date: Tue, 17 May 2022 20:12:20 +0000 Subject: [PATCH] 00_MQTT2_SERVER/CLIENT: enhance the traffic display (Forum #127223) git-svn-id: https://svn.fhem.de/fhem/trunk/fhem@26055 2b470e98-0d58-463d-a4d8-8e2adae1ed80 --- FHEM/00_MQTT2_CLIENT.pm | 3 +- FHEM/00_MQTT2_SERVER.pm | 3 +- FHEM/DevIo.pm | 7 ++- www/pgm2/console.js | 134 +++++++++++++++++++++++++++++++++------- 4 files changed, 117 insertions(+), 30 deletions(-) diff --git a/FHEM/00_MQTT2_CLIENT.pm b/FHEM/00_MQTT2_CLIENT.pm index ef067c63c..9a284f273 100644 --- a/FHEM/00_MQTT2_CLIENT.pm +++ b/FHEM/00_MQTT2_CLIENT.pm @@ -746,8 +746,7 @@ MQTT2_CLIENT_feedTheList($$$) delete($fl->{$fwid}); next; } - FW_AsyncOutput($cl, "", - defined($cid) ? "RCVD: $tp $val
" : "SENT: $tp $val
"); + FW_AsyncOutput($cl, "", toJSON([defined($cid)?"RCVD":"SENT", $tp,$val])); } delete($server->{".feedList"}) if(!keys %{$fl}); } diff --git a/FHEM/00_MQTT2_SERVER.pm b/FHEM/00_MQTT2_SERVER.pm index e14ca02b9..1a0ab9080 100644 --- a/FHEM/00_MQTT2_SERVER.pm +++ b/FHEM/00_MQTT2_SERVER.pm @@ -576,8 +576,7 @@ MQTT2_SERVER_doPublish($$$$;$) delete($fl->{$fwid}); next; } - FW_AsyncOutput($cl, "", - defined($cid) ? "RCVD: $tp $val
" : "SENT: $tp $val
"); + FW_AsyncOutput($cl, "", toJSON([defined($cid)?$cid:"SENT", $tp, $val])); } delete($server->{".feedList"}) if(!keys %{$fl}); } diff --git a/FHEM/DevIo.pm b/FHEM/DevIo.pm index 76660cc33..d7bc388f1 100644 --- a/FHEM/DevIo.pm +++ b/FHEM/DevIo.pm @@ -360,9 +360,10 @@ DevIo_Expect($$$) # - UNIX:(SEQPACKET|STREAM):filename => Open filename as a UNIX socket # - FHEM:DEVIO:IoDev[:IoPort] => Cascade I/O over another FHEM Device # -# callback is only meaningful for TCP/IP (in which case a nonblocking connect -# is executed) every cases. It will be called with $hash and a (potential) -# error message. If $hash->{SSL} is set, SSL encryption is activated. +# callback is only meaningful for TCP/IP, in which case a nonblocking connect +# is executed. It will be called with $hash and a (potential) error message. +# If # $hash->{SSL} is set, SSL encryption is activated. + sub DevIo_OpenDev($$$;$) { diff --git a/www/pgm2/console.js b/www/pgm2/console.js index 5c9a32041..fe0eb0ec0 100644 --- a/www/pgm2/console.js +++ b/www/pgm2/console.js @@ -23,6 +23,28 @@ cons_closeConn() consConn = undefined; } +function +consAppender(new_content) +{ + // Extract the FHEM-Log, to avoid escaping its formatting (Forum #104842) + var logContent = ""; + var rTab = {'<':'<', '>':'>',' ':' ', '\n':'
' }; + new_content = new_content.replace( + /(
)([\s\S]*?)(<\/div>)/gm, + function(all, div1, msg, div2) { + logContent += div1+ + msg.replace(/[<> \n]/g, function(a){return rTab[a]})+ + div2; + return ""; + }); + + var isTa = $(consName).is("textarea"); // 102773 + var ncA = new_content.split(/
[\r\n]/); + for(var i1=0; i1 ]/g, function(a){return rTab[a]}); + $(consName).append(logContent+ncA.join(isTa?"\n":"
")); +} + function consUpdate(evt) { @@ -65,23 +87,7 @@ consUpdate(evt) log("console Rcvd: "+new_content.substr(0,120)+ "..., truncated, original length "+new_content.length); - // Extract the FHEM-Log, to avoid escaping its formatting (Forum #104842) - var logContent = ""; - var rTab = {'<':'<', '>':'>',' ':' ', '\n':'
' }; - new_content = new_content.replace( - /(
)([\s\S]*?)(<\/div>)/gm, - function(all, div1, msg, div2) { - logContent += div1+ - msg.replace(/[<> \n]/g, function(a){return rTab[a]})+ - div2; - return ""; - }); - - var isTa = $(consName).is("textarea"); // 102773 - var ncA = new_content.split(/
[\r\n]/); - for(var i1=0; i1 ]/g, function(a){return rTab[a]}); - $(consName).append(logContent+ncA.join(isTa?"\n":"
")); + consAppender(new_content); if(mustScroll) $(consName).scrollTop($(consName)[0].scrollHeight); @@ -149,10 +155,10 @@ consStart() withLog = ($("#eventWithLog").is(':checked') ? 1 : 0); setTimeout(consFill, 1000); - $("#eventReset").click(function(evt){ // Event Monitor Reset - log("Console resetted by user"); - $(consName).html(""); - }); + $("#eventReset").click(function(evt){ // Event Monitor Reset + log("Console resetted by user"); + $(consName).html(""); + }); $("#eventFilter").click(function(evt){ // Event-Filter Dialog $('body').append( @@ -339,7 +345,50 @@ consAddRegexpPart() }); }); } - + +var c4d_rowNum=0, c4d_filter=".*" +function +cons4devAppender(new_content) +{ + var cArr = new_content.split("\n"); + for(var i1=0; i1 +
`+ + cols.join('
')+ + "
"); + $(consName+" table").append(row); + $(row).find("div.dval") // Format JSON + .css("cursor", "pointer") + .click(function(){ + var content = $(this).attr("data-content"); + if(!content) { + content = $(this).html(); + $(this).attr("data-content", content); + } + if(content.match(/^{.*}$/)) { + try{ + var fmt = $(this).attr("data-fmt"); + fmt = (typeof(fmt)=="undefined" || fmt=="no") ? "yes" : "no"; + $(this).attr("data-fmt", fmt); + if(fmt=="yes") { + var js = JSON.parse(content); + content = '
'+JSON.stringify(js, undefined, 2)+'
'; + } + $(this).html(content); + } catch(e) { } + } + }); + } +} + function cons4dev(screenId, filter, feedFn, devName) { @@ -350,6 +399,7 @@ cons4dev(screenId, filter, feedFn, devName) consName = screenId+">div.console"; consFilter = filter; + consAppender = cons4devAppender; var opened; function @@ -359,7 +409,16 @@ cons4dev(screenId, filter, feedFn, devName) var cmd = FW_root+"?cmd="+encodeURIComponent("{"+feedFn+"('"+devName+"',"+ (opened ? 0 : 1)+")}")+"&XHR=1"; if(!opened) { - $(screenId).append('
'); + $(screenId) + .append(` +  Reset +  Filter: +  ${c4d_filter} + `); + $(screenId) + .append(`
+
+
`); $(consName) .width( $("#content").width()-40) .height($("#content").height()/2-20) @@ -371,10 +430,39 @@ cons4dev(screenId, filter, feedFn, devName) // clear the flag setTimeout(function(){ FW_cmd(cmd) }, 100); + $(screenId+" .reset").click(function(){ $(consName+" table").html("") }); + $(screenId+" .filter").click(function(){ + $('body').append( + '
'+ + '
Filter (Regexp, matching the row):

'+ + '

'+ + '
'); + $('#filterdlg').dialog({ modal:true, width:'auto', + position:{ my: "left top", at: "right bottom", + of: this, collision: "flipfit" }, + close:function(){$('#filterdlg').remove();}, + buttons:[ + { text:"Cancel", click:function(){ $(this).dialog('close'); }}, + { text:"OK", click:function(){ + var val = $("#filtertext").val().trim(); + try { + new RegExp(val ? val : ".*"); + } catch(e) { + return FW_okDialog(e); + } + c4d_filter = val ? val : ".*"; + $(this).dialog('close'); + $(screenId+" .filterContent").html(c4d_filter); + $(consName+" table").html(""); + }}] + }); + }); + } else { FW_cmd(cmd); $(consName).remove(); $(screenId+">a").html($(screenId+">a").html().replace("Hide", "Show")); + $(screenId+" span.buttons").remove(); if(consConn) { consConn.onclose = undefined; cons_closeConn();