Here are a couple of options I found supported with an API. Might be of interest...
Interesting - thank you - it might well do the job, but rather expensive. I think I'll just keep my fingers crossed that this might end up being a supported feature of HE.
1 Like
Well thanks to a reply posted to a related question in another part of the forum, I've now been able to achieve what I want. I'll share the solution in case it's a help to others.
The answer is a simple driver (below), and then to create a virtual switch, assign that driver to it, and use an "attribute" tile to display the web frame.
Here's the driver as I have it - your frame call goes in the "sendEvent" line where marked.
preferences {
}
metadata {
definition (name: "weatherFrame", namespace: "srp", author: "srp") {
capability "Switch"
attribute "myFrame", "text"
}
}
def on() {
sendEvent(name: "switch", value: "on")
sendEvent(name: "myFrame", value: "your iframe" )
}
def off() {
sendEvent(name: "switch", value: "off")
}
def installed() {
on()
}
2 Likes
So, you place markup for iframe in the send event? Can you show a concrete example, I'm slow witted.
Heh, heh! I did try to post the whole thing, but the forum input editor snipped out the relevant bits. Here's a screenshot instead. The link is to a public page, but unless the weather in the wilds of Scotland is of interest to you, you'll want to replace it with something of your own!
2 Likes
Excellent
Here's a modified version that allows you to set the src url for the iFrame in the driver details, so you can use more than one virtual device with difference configurations. Also adapts to the size of the tile, without having to be statically set.
preferences {
input("src", "text", title: "iFrame Url", required: true)
}
metadata {
definition (name: "weatherFrame", namespace: "srp", author: "srp") {
capability "Switch"
attribute "myFrame", "text"
}
}
def on() {
sendEvent(name: "switch", value: "on")
sendEvent(name: "myFrame", value: "<div style='height: 100%; width: 100%'><iframe src='${src}' style='height: 100%; width:100%; border: none;'></iframe><div>")
}
def off() {
sendEvent(name: "switch", value: "off")
}
def installed() {
on()
}
5 Likes
This is awesome, thank you guys for your work. Is there any way to get the iframe to refresh at certain intervals?
It just does! 
This does work great. Using it for nest cameras. Any idea why one of my cameras shows black? Think it’s iPhone related. Seems to work on iPad.
Cool, this works! Thanks guys!
1 Like
Is there something I'm doing wrong. I can't get this to fit.
There is a css thing to make it fill. I'll see if I can track it down.
Take a look at the RadarTile from HubiGraph. There are some others that do similar solutions. It does some similar things. But in short, you have to specify an attribute with an iframe that has a height, width and overflow set properly... There are also so css tricks to remove titles, etc.
.tile.image .inset-auto img {
object-fit: cover
}
1 Like
I use this for my iframe tiles:
/* iframe specific - #tile-25 is the iFrame device */
#tile-25 .tile-title {
display:none;
}
#tile-25 .tile-contents {
padding: 0;
height:100%;
}
#tile-25 .tile-primary {
padding: 0;
}
2 Likes
Where does this go?
click the 3 dots on the tile then click advanced.
Yea thats the one.
1 Like
