Scrape text into an array?

Hi,
Context
using the Dutch/Belgian Buienradar, I can get the rain forecast for the next 2hrs for my GPS location in text format.
The URL following URL: https://gpsgadget.buienradar.nl/data/raintext?lat=51.028&lon=3.839 returns a series of numbers in the following format:

000|15:55
000|16:00
000|16:05
000|16:10
.../...
000|17:40
000|17:45
000|17:50

Goal:
I would like to get the following result but with rain forecast data
Screenshot 2020-08-22 at 16.03.15

Problem:
I’m not smart enough
I looked at the scrape sensor platform, but I’m not smart enough to deal with this array-type of text that I get from buienradar.

Alternatives:
I also looked at the https://www.home-assistant.io/integrations/sensor.buienradar/ but I could not find how to create the graph as shown in the screenshot above (but with rain forecast data for my GPS location)
I also looked at the more practical rest sensor platform but it seems like buienradar can only deliver me the data in text (rain forecast for a GPS location for the next few hours)
I also looked at the file sensor, but that one only reads the last line from a (json) file. I guess I could do some sed-ing to convert the text that I get from the website to json, but then I would also have to drip-feed the data in the text file… not very elegant…

Any examples or tips would be greatly appreciated
thanks,
chrisV

SOLVED:
I found this https://github.com/lukevink/lovelace-buien-rain-card
@lukevink Awesome custom card ! Thank you so much for sharing this on github
BTW:
Resources to Lovelance can now be added via the Web UI
Web UI -> Configuration (in the sidebar) -> Lovelace Dashboards -> Resources (tab) -> " + "
url: /local/buien-rain-card.js
Resource type:JavaScript module
update
ha core restart && ha core logs --log-level debug