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
If it's an image, set it as the background image of the tile and it will fill the tile automagically.
I’m doing that now, however the loop doesn’t update unless I reload the screen. That’s why this looked more appealing than the work around I’m using now with fully kiosk auto refreshing when it wakes from the screen saver. That takes a while rather than just coming back on immediately.
You have the image tile set to refresh? For example with a weather image that I use, I set it to update every 2000 seconds. I'm probably misunderstanding your use case because I only scanned the thread 
Yeah, I found this too on my custom dashboard. It's quite irritating to have to wait for the page to unfreeze. Now I just leave the screen on.
