[GH-ISSUE #64] --ui-highlight regex word #40

Open
opened 2026-03-03 16:03:56 +03:00 by kerem · 10 comments
Owner

Originally created by @rochmad on GitHub (Feb 26, 2016).
Original GitHub issue: https://github.com/mthenw/frontail/issues/64

did ./preset/defatult.json support regex for maching word ?

Originally created by @rochmad on GitHub (Feb 26, 2016). Original GitHub issue: https://github.com/mthenw/frontail/issues/64 did ./preset/defatult.json support regex for maching word ?
Author
Owner

@mthenw commented on GitHub (Feb 26, 2016):

Hey. It should because it uses String.prototype.replace https://github.com/mthenw/frontail/blob/master/lib/web/assets/app.js#L148

<!-- gh-comment-id:189154454 --> @mthenw commented on GitHub (Feb 26, 2016): Hey. It should because it uses `String.prototype.replace` https://github.com/mthenw/frontail/blob/master/lib/web/assets/app.js#L148
Author
Owner

@rochmad commented on GitHub (Feb 26, 2016):

can u explain to me. how to ?
and i cant use multiple word highlight

{
"words": {
"error": "color: red;"
},

"words": {
    "warning": "color: yellow;"
}

}

thanks before

<!-- gh-comment-id:189156460 --> @rochmad commented on GitHub (Feb 26, 2016): can u explain to me. how to ? and i cant use multiple word highlight { "words": { "error": "color: red;" }, ``` "words": { "warning": "color: yellow;" } ``` } thanks before
Author
Owner

@mthenw commented on GitHub (Feb 26, 2016):

Oh, sorry it's not possible right now. I forgot how patterns are defined. Not sure when I will have a time to implement that though.

<!-- gh-comment-id:189259227 --> @mthenw commented on GitHub (Feb 26, 2016): Oh, sorry it's not possible right now. I forgot how patterns are defined. Not sure when I will have a time to implement that though.
Author
Owner

@NickBuilder commented on GitHub (Nov 24, 2016):

Is the highlighting feature still working? I'm having trouble getting it to work.

Its a great UI anyhow though! Great work!

fyi:

{ frontail: '4.0.1',
  npm: '3.10.9',
  ares: '1.10.1-DEV',
  cldr: '29.0',
  http_parser: '2.7.0',
  icu: '57.1',
  modules: '51',
  node: '7.1.0',
  openssl: '1.0.2j',
  tz: '2016b',
  unicode: '8.0',
  uv: '1.10.0',
  v8: '5.4.500.36',
  zlib: '1.2.8' }

Edit: Sorry my mistake apparently. Now its working as expected. Also managed to define multiple highlighting conditions so now I'm more than satisfied!

Sorry for bothering you!

<!-- gh-comment-id:262852836 --> @NickBuilder commented on GitHub (Nov 24, 2016): Is the highlighting feature still working? I'm having trouble getting it to work. Its a great UI anyhow though! Great work! fyi: ``` { frontail: '4.0.1', npm: '3.10.9', ares: '1.10.1-DEV', cldr: '29.0', http_parser: '2.7.0', icu: '57.1', modules: '51', node: '7.1.0', openssl: '1.0.2j', tz: '2016b', unicode: '8.0', uv: '1.10.0', v8: '5.4.500.36', zlib: '1.2.8' } ``` Edit: Sorry my mistake apparently. Now its working as expected. Also managed to define multiple highlighting conditions so now I'm more than satisfied! Sorry for bothering you!
Author
Owner

@mthenw commented on GitHub (Nov 25, 2016):

@NickBuilder yup, working for me. Could you create separate issue with description what is not working?

<!-- gh-comment-id:262941740 --> @mthenw commented on GitHub (Nov 25, 2016): @NickBuilder yup, working for me. Could you create separate issue with description what is not working?
Author
Owner

@ThomDietrich commented on GitHub (Mar 20, 2017):

I'd also be interested to use regex for highlighting. @mthenw are you still willing to look into this feature? Thanks for your work on this great little project!

In particular I'd be interesed in grouping, example:

2017-03-20 01:25:53 [ItemStateChangedEvent] - BD_Heating_ActTemp changed from 20.80 to 20.70

I want to highlight "BD_Heating_ActTemp" hence highlighting needs to be similar to

"words": {
    "] - (\\w*) changed.*": "color: yellow;"
}
<!-- gh-comment-id:287661541 --> @ThomDietrich commented on GitHub (Mar 20, 2017): I'd also be interested to use regex for highlighting. @mthenw are you still willing to look into this feature? Thanks for your work on this great little project! In particular I'd be interesed in grouping, example: ```java 2017-03-20 01:25:53 [ItemStateChangedEvent] - BD_Heating_ActTemp changed from 20.80 to 20.70 ``` I want to highlight "BD_Heating_ActTemp" hence highlighting needs to be similar to ```json "words": { "] - (\\w*) changed.*": "color: yellow;" } ```
Author
Owner

@chetanpatil1984 commented on GitHub (Jul 13, 2017):

+1

<!-- gh-comment-id:315155839 --> @chetanpatil1984 commented on GitHub (Jul 13, 2017): +1
Author
Owner

@branko-tanovic-modoolar commented on GitHub (Feb 8, 2018):

+1

<!-- gh-comment-id:364199185 --> @branko-tanovic-modoolar commented on GitHub (Feb 8, 2018): +1
Author
Owner

@x-drum commented on GitHub (Jun 17, 2018):

+1 nice to have feature, any news or deadline for this? (thanks and keep up the good work)

<!-- gh-comment-id:397883289 --> @x-drum commented on GitHub (Jun 17, 2018): +1 nice to have feature, any news or deadline for this? (thanks and keep up the good work)
Author
Owner

@aliasnameless commented on GitHub (Jan 31, 2023):

Hi all, I found a solution to this issue!
All you need to do is add the new function after function var _highlightWord = function(line) { ... } in file /usr/local/lib/node_modules/frontail/web/assets/app.js

var _highlightRegExpr = function(line) {
  var output = line;
  if (_highlightConfig && _highlightConfig.regexpr) {
    Object.keys(_highlightConfig.regexpr).forEach((pattern) => {
       output = output.replace(new RegExp(pattern, 'gm'), _highlightConfig.regexpr[pattern]);
    });
  }
  return output;
};

Change the code on line 326 in the same file from p.innerHTML = _highlightWord(data); to p.innerHTML = _highlightRegExpr(_highlightWord(data));

Then add a new section called regexpr to the file /usr/local/lib/node_modules/frontail/preset/default.json
My variant is:

{
   "regexpr":{
      "(received command )(.*)":"$1<b>$2</b>",
      "(predicted to become )(.*)":"$1<b>$2</b>",
      "(changed from )(.*)(\\sto\\s)(.*)":"$1<b>$2</b>$3<b>$4</b>",
      "\\'([^\\']+)\\'":"<u>'$1'</u>",
      "\\[(INFO |ERROR|WARN )\\]":"<b class=\"$1\">$&</b>"
   },
   "lines":{
      
   },
   "words":{
      
   }   
}

And voilà.

log

<!-- gh-comment-id:1410456602 --> @aliasnameless commented on GitHub (Jan 31, 2023): Hi all, I found a solution to this issue! All you need to do is add the new function after function `var _highlightWord = function(line) { ... }` in file /usr/local/lib/node_modules/frontail/web/assets/app.js ``` var _highlightRegExpr = function(line) { var output = line; if (_highlightConfig && _highlightConfig.regexpr) { Object.keys(_highlightConfig.regexpr).forEach((pattern) => { output = output.replace(new RegExp(pattern, 'gm'), _highlightConfig.regexpr[pattern]); }); } return output; }; ``` Change the code on line 326 in the same file from `p.innerHTML = _highlightWord(data);` to `p.innerHTML = _highlightRegExpr(_highlightWord(data));` Then add a new section called regexpr to the file /usr/local/lib/node_modules/frontail/preset/default.json My variant is: ``` { "regexpr":{ "(received command )(.*)":"$1<b>$2</b>", "(predicted to become )(.*)":"$1<b>$2</b>", "(changed from )(.*)(\\sto\\s)(.*)":"$1<b>$2</b>$3<b>$4</b>", "\\'([^\\']+)\\'":"<u>'$1'</u>", "\\[(INFO |ERROR|WARN )\\]":"<b class=\"$1\">$&</b>" }, "lines":{ }, "words":{ } } ``` And voilà. ![log](https://user-images.githubusercontent.com/71373767/215787474-2d241d08-1848-41fb-a6f9-a72b04eaedbd.JPG)
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/frontail#40
No description provided.