I have got a CUSTOM tile which reads a RSS feed, but it might be nice to use a HA sensor I can read from.
I use the tile on a tileboard on an old iPad.
This is the code:
{
position: [3, 0],
type: TYPES.CUSTOM,
id: 'input_boolean.buienradar_rssfeed',
title: '',
width: 4,
height: 3,
state: false,
customStyles: {'background-color': '#162c82'},
customHtml: function(item, entity) {
var d = new Date(entity.last_changed);
d.setSeconds(d.getSeconds() + Math.round(this.$scope.states['input_number.buienradar_rssfeed_refresh'].state));
if (entity.state == 'on' && Date.now() > d) {
this.$scope.states[entity.entity_id].last_changed = Date.now();
//implemented a setTimeout, otherwise filling of the field did not work on iOS 9.3.6
setTimeout(function(){
$http = angular.injector(["ng"]).get("$http");
$http.get("https://data.buienradar.nl/1.0/feed/xml/rssbuienradar").then(function(data) {
var item = new window.DOMParser()
.parseFromString(data.data, "text/xml")
.querySelectorAll("item")[0];
var d = new Date(item.querySelector("pubDate").firstChild.textContent);
//padStart does not work in iOS 9.3.6
var dateString = String(d.getDate()).length < 2 ? "0" + String(d.getDate()) : String(d.getDate());
dateString += "-";
dateString += String(d.getMonth()+1).length < 2 ? "0" + String(d.getMonth()+1) : String(d.getMonth()+1);
dateString += "-" + d.getFullYear();
var i = item.querySelector("pubDate").firstChild.textContent.split(' ');
i.pop();
i = i.slice(1);
document.getElementById('rssTitle').innerHTML = i.join(' ');
document.getElementById('rssText').innerHTML = item.querySelector("description").firstChild.textContent;
});
}, 1000);
}
return '<div id="rssFeed" style="white-space:pre-wrap;text-align:left;padding:10px;overflow:scroll"><div id="rssTitle" style="margin-bottom:10px"></div><div id="rssText"></div></div>';
}
},
Basically what I will try to do with that sensor is to add those feed refreshed with a configurable interval.
I use that already by check the input boolean (on/off) AND a refresh interval. The latter using the last_changed as the date to check
Hi @Romkabouter,
i’d be interested to see what you come up with - as i’m failing miserably
may also have a look at adding your in, thanks for the config.
So, a question on what you want to achieve.
The sensor only updated once per hour, so to refresh on an interval smaller than 1 hour is not very useful.
Hi @Romkabouter, looking at your custom tile, i don’t think it will work for me.
What i’m trying to do is to iterate through the feedparser plugin, as i have the news feed in there.
Then i’d like a tile to show the news item, and then on an interval change to the next entry and so on…
It could also be a marquee style tile if possible to scroll through the news articles horizontally?
Just toying with it at the moment, but wanting to have a nice way of showing the latest news stories on the main page.
Cheers
Jason
This works for me, except the description. But the sensor does not return it, so probably an issue with the sensor.
I have created an input_number helper. to check for the last_changed time and the state is the index of the feed to show.
This is needed, because I do not know how to keep track of variables in another way.
{
position: [0,0],
type: TYPES.CUSTOM,
id: 'sensor.bbc_news',
width: 3,
height: 3,
customHtml: function(item, entity) {
var d = new Date(this.$scope.states['input_number.bbcnews_index'].last_changed);
d.setSeconds(d.getSeconds() + 5);
if (Date.now() > d) {
this.$scope.states['input_number.bbcnews_index'].last_changed = Date.now();
var i = Math.round(this.$scope.states['input_number.bbcnews_index'].state);
setTimeout(function(){
document.getElementById('rssTitle').innerHTML = entity.attributes.entries[i].title;
document.getElementById('rssText').innerHTML = entity.attributes.entries[i].description;
}, 500);
i++;
if (i > 2) {i=0;}
this.$scope.states['input_number.bbcnews_index'].state = i;
}
return '<div id="rssFeed" style="white-space:pre-wrap;text-align:left;padding:10px;overflow:scroll"><div id="rssTitle" style="margin-bottom:10px"></div><div id="rssText"></div></div>';;
}
}
This might get you started
Feedparser:
sensor:
- platform: feedparser
name: BBC News
feed_url: "https://feeds.bbci.co.uk/news/rss.xml"
date_format: "%a, %b %d %I:%M %p"
show_topn: 3
inclusions:
- title
- link
- description
- image
- language
- pubDate
On my laptop, only the title, link and image are returned so there might be an issue with the sensor
Hi All - apologies if this has been asked before - I did a quick search, but couldn’t find anything - I have the following switch - and I have included a function to show the temperature of the room as a state:
{
position: [2, 0],
type: TYPES.SWITCH,
width: 1.25,
height: 1.25,
state: function (item, entity) {
return ('' + this.states['sensor.0x00158d0005404f4b_temperature'].state + ' ' + this.states['sensor.0x00158d0005404f4b_temperature'].attributes.unit_of_measurement);
},
filter: function (value) { // optional
var num = parseFloat(value);
return num && !isNaN(num) ? num.toFixed(1) : value;
},
id: 'light.games_room',
title: 'All Lights',
subtitle: 'Games Room',
states: {
on: "On",
off: "Off"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
}
}
But the temperature is showing as ##.## - is there any way to round the value down to ##.# - similar to the temperature tile shown here:
{
position: [0, 0],
type: TYPES.SENSOR,
title: 'Outdoor',
id: 'sensor.outdoor_temperature',
unit: 'C', // override default entity unit
state: false, // hidding state
filter: function (value) { // optional
var num = parseFloat(value);
return num && !isNaN(num) ? num.toFixed(1) : value;
}
}
Hi - I’ve used your code as a starting point - loaded the sensor in HA and copied the config.
In Tileboard add the config for the tile - the tile is clear with with only the number of feeds showing and nothing else
Any idea why ? - or if I missed something.
Sorry another question - is it possible to break a state into 2 lines? - I have the following sensors which I am showing as states (temperature and humidity) - but I would like them one under the other rather than in a single line:
What does the console say? F12 in your browser, so you can see an error.
You might need to set the setTimeout to a higher value, on my old ipad I have it on 2000
This is because tileboard needs to render the page first (the return statement).
If you try to use document.getElementById before the page is rendered, there should be some error in the logging.