News Feed: Truncate and Layout

Dear all,

I could use a little help with truncating news messages I receive from an http request. I managed to obtain a list with the titles of news itens (group 1 in the example) and I managed to obtain a list with rather long descriptions of each news item (groupd 2). I would like to achieve 2 things:

  1. Truncate the text of the descriptions to 100 words each
  2. Apply the HTML formatting ,

    to the descriptions which is now shown as code in my example (group 2)

Could someone please help me with that?

Many thanks in advance!

[{"id":"42fc5ba9.e76f84","type":"http request","z":"e1f26363.95226","name":"","method":"GET","ret":"txt","paytoqs":false,"url":"http://feeds.nos.nl/nosnieuwsalgemeen","tls":"","persist":false,"proxy":"","authType":"basic","x":290,"y":160,"wires":[["b8815acb.373468"]]},{"id":"b8815acb.373468","type":"xml","z":"e1f26363.95226","name":"","property":"payload","attr":"","chr":"","x":450,"y":160,"wires":[["51712cd4.8a1af4","dd8b11de.12789"]]},{"id":"8c3de4ec.f4f348","type":"inject","z":"e1f26363.95226","name":"Elke 15min","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"*/15 6-22 * * *","once":false,"onceDelay":0.1,"x":122,"y":160,"wires":[["42fc5ba9.e76f84"]]},{"id":"eb9d64d2.297c98","type":"template","z":"e1f26363.95226","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<h3><a href=https://nos.nl/nieuws/ target=\"_blank\" style=\"color:white\">NOS</a></h3>\n<table>\n    <tr><td>{{payload.one}}<hr></td></tr>\n    <tr><td>{{payload.two}}<hr></td></tr>\n    <tr><td>{{payload.three}}<hr></td></tr>\n    <tr><td>{{payload.four}}<hr></td></tr>\n    <tr><td>{{payload.five}}<hr></td></tr>\n    <tr><td>{{payload.six}}</td></tr>\n</table>","output":"str","x":820,"y":160,"wires":[["d301926c.9a8f4"]]},{"id":"d301926c.9a8f4","type":"ui_template","z":"e1f26363.95226","group":"b3ea7a37.0fcbc8","name":"Nieuwsfeed","order":1,"width":6,"height":9,"format":"<div ng-bind-html=\"msg.payload\"></div>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1010,"y":160,"wires":[[]]},{"id":"51712cd4.8a1af4","type":"function","z":"e1f26363.95226","name":"Last 6 items","func":"msg.payload.one = msg.payload.rss.channel[0].item[0].title[0]\nmsg.payload.two = msg.payload.rss.channel[0].item[1].title[0]\nmsg.payload.three = msg.payload.rss.channel[0].item[2].title[0]\nmsg.payload.four = msg.payload.rss.channel[0].item[3].title[0]\nmsg.payload.five = msg.payload.rss.channel[0].item[4].title[0]\nmsg.payload.six = msg.payload.rss.channel[0].item[5].title[0]\nreturn msg;","outputs":1,"noerr":0,"x":610,"y":160,"wires":[["eb9d64d2.297c98"]]},{"id":"dd8b11de.12789","type":"function","z":"e1f26363.95226","name":"Last 6 items more","func":"msg.payload.one = msg.payload.rss.channel[0].item[0].description[0]\nmsg.payload.two = msg.payload.rss.channel[0].item[1].description[0]\nmsg.payload.three = msg.payload.rss.channel[0].item[2].description[0]\nmsg.payload.four = msg.payload.rss.channel[0].item[3].description[0]\nmsg.payload.five = msg.payload.rss.channel[0].item[4].description[0]\nmsg.payload.six = msg.payload.rss.channel[0].item[5].description[0]\nmsg.payload.seven = msg.payload.rss.channel[0].item[6].description[0]\nreturn msg;","outputs":1,"noerr":0,"x":630,"y":100,"wires":[["8d313e82.d5a41"]]},{"id":"8d313e82.d5a41","type":"template","z":"e1f26363.95226","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<h3><a href=https://nos.nl/nieuws/ target=\"_blank\" style=\"color:white\">NOS</a></h3>\n<table>\n    <tr><td>{{payload.one}}<hr></td></tr>\n    <tr><td>{{payload.two}}<hr></td></tr>\n    <tr><td>{{payload.three}}<hr></td></tr>\n    <tr><td>{{payload.four}}<hr></td></tr>\n    <tr><td>{{payload.five}}<hr></td></tr>\n    <tr><td>{{payload.six}}<hr></td></tr>\n    <tr><td>{{payload.seven}}</td></tr>\n</table>","output":"str","x":820,"y":100,"wires":[["ac5403fa.2fb5b","76ed4546.1e913c"]]},{"id":"ac5403fa.2fb5b","type":"ui_template","z":"e1f26363.95226","group":"6b1d1ff0.40773","name":"Nieuwsfeed","order":1,"width":"6","height":"10","format":"<div ng-bind-html=\"msg.payload\"></div>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1010,"y":100,"wires":[[]]},{"id":"76ed4546.1e913c","type":"debug","z":"e1f26363.95226","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":990,"y":40,"wires":[]},{"id":"b3ea7a37.0fcbc8","type":"ui_group","name":"Group 1","tab":"adff96c7.8e3628","order":1,"disp":true,"width":6},{"id":"6b1d1ff0.40773","type":"ui_group","name":"Group 2","tab":"adff96c7.8e3628","order":2,"disp":true,"width":6},{"id":"adff96c7.8e3628","type":"ui_tab","z":"","name":"Example","icon":"","order":15,"disabled":false,"hidden":false}]

See this example flow:

[{"id":"fb642b66.c49d68","type":"http request","z":"c4e6205f.d879b","name":"","method":"GET","ret":"txt","paytoqs":false,"url":"http://feeds.nos.nl/nosnieuwsalgemeen","tls":"","persist":false,"proxy":"","authType":"basic","x":310,"y":336,"wires":[["670c37dd.3a809"]]},{"id":"670c37dd.3a809","type":"xml","z":"c4e6205f.d879b","name":"","property":"payload","attr":"","chr":"","x":470,"y":336,"wires":[["303a8415.a64a14"]]},{"id":"d139b422.f81d98","type":"inject","z":"c4e6205f.d879b","name":"Elke 15min","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"*/15 6-22 * * *","once":false,"onceDelay":0.1,"x":142,"y":336,"wires":[["fb642b66.c49d68"]]},{"id":"303a8415.a64a14","type":"function","z":"c4e6205f.d879b","name":"6 items","func":"function truncate(str, no_words) {\n    return str.split(\" \").splice(0,no_words).join(\" \");\n}\n\nm = msg.payload.rss.channel[0]\no = []\n\n\nfor(x=0;x<6;x++){\n    descr = truncate(m.item[x].description[0],100)\n    \n    o.push({description:descr}) \n    \n}\nreturn {payload:o}","outputs":1,"noerr":0,"x":612,"y":336,"wires":[["7463663d.10806"]]},{"id":"7463663d.10806","type":"ui_template","z":"c4e6205f.d879b","group":"74bd0363.c7a924","name":"","order":1,"width":0,"height":0,"format":"<h3><a href=https://nos.nl/nieuws/ target=\"_blank\" style=\"color:white\">NOS</a></h3>\n<table>\n    <tr ng-repeat=\"i in msg.payload\">\n        <td><p ng-style=\"border-bottom:1px solid #fff;padding:0 4px;\">{{i.description}}</p></td>\n    </tr>\n     \n</table>\n    \n","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":756,"y":336,"wires":[["2d9cd248.76642e"]]},{"id":"2d9cd248.76642e","type":"debug","z":"c4e6205f.d879b","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":890,"y":336,"wires":[]},{"id":"74bd0363.c7a924","type":"ui_group","name":"Group 1","tab":"8c9a6c74.3da4","order":1,"disp":true,"width":15},{"id":"8c9a6c74.3da4","type":"ui_tab","z":"","name":"Example","icon":"","order":15,"disabled":false,"hidden":false}]

Dropped the normal template node and loop through the elements in a ui_template node.
The function node will return 6 elements and each element will have max 100 words.

Dear Bakman2,

Thank you so much for the example. That was what I wanted to achieve, but in a so much more sophisticated manner. Much appreciated!

If I may ask: I am still seeing HTML code in the rss feed (e.g. < p>< /p> < h2>< /h2>). Do you know of a way to get rid of that as well?

Thanks again!

jQuery is available in the Dashboard and has a method that can get just the text from html I think.

On the Node-RED side, the html parse node can also extract just text from html so is worth a try.

Hard to say whether either choice will mangle things too much though.

Hi TotallyInformation,

Thanks for the quick reply. However, please accept that I am a beginner at Node-red. I do not fully grasp your suggestion. I tried using an HTML parser node after the function node, only showing text but it does not seem to work. Could you please elaborate a little bit more?

Thanks!

Well, since you were so kind, I did a quick test and I'm afraid that the http node won't work for you. In any case, the complexity of the data would have made it really hard.

So that leaves to doing it in the front-end - e.g. a ui_template node - perhaps using jQuery.

Beyond what I have time for this evening I'm afraid. I'd start with the idea of having a JavaScript function that I could call when wanting to display the data that does the replacement since by then you will have got through all of the complexity of the nested structures.

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.