ActionTiles Support & Ideas Forum
Public Forum for ActionTiles Customers. Please use the Search Box and carefully browse the results to look for existing relevant Topics before opening a new Topic or Private Helpdesk Ticket.
Images on media tiles are not loading on Google Chrome browser on PC, however they load on the phone browser. When I try to edit those "Media" tiles, it says "Enter valid URL". Please note that the URL is valid and that media tile is showing correctly on the Android phone browser (Google Chrome). It is happening with all media tiles on the PC browser. It used to work fine till last week on PC as well as on phone. Please help, thanks in advance.
In a move for safer web, Chrome no longer allows to display images that are served over insecure HTTP. Chrome tries to upgrade connections to HTTPS, but if the server (or camera) is not able to respond, the image will not be loaded.
This is a major problem for ActionTiles users who often use Chrome and derivative browser to stream video on local network.
The ActionTiles mobile app is not currently affected by this issue. The app is available for free in Google Play and Amazon App stores:
Some Chrome mobile users were able to make HTTP video streams work by turning off Safe Browsing. This option is available under kebab menu (top-right) > Settings > Privacy and Security > Safe Browsing > No Protection.
Please note that this comes with all the caveatsof reducing internet security.
I spent some time this week trying to figure out how to add stock data as a media tile and thought I'd share what I learned. There are a few steps involved and it's not as simple as I initially hoped, but it's also pretty flexible and could easily be expanded to other uses. Essentially, this can turn any Google Sheet into a media tile, so it can be used for much more than stock data.
This started by wanting to display stock tickers as a media tile. I first came across a great post on being able to turning any json data into a badge, but this had the limitation of only being able to display one piece of data. I wanted to be able to display a few different tickers in one tile.
(As an aside, Google provides instructions for getting JSON feeds from spreadsheet data: https://developers.google.com/gdata/samples/spreadsheet_sample)
I also came across this post explaining how to create a media tile from a stock chart, but that also wasn't quite what I wanted: https://support.actiontiles.com/en/communities/12/topics/3014-stock-ticker-tile
Part 1 - Create a public link to Google Sheets data
First create a spreadsheet that contains whatever information will be displayed in the tile and share it (File->Share) so it doesn't require a login to view. Then take the spreadsheet ID (the long string in that URL) and sheet ID (the part after gid=) from the link to that sheet and insert them into this link below. You can also specify a range of cells if you only want to use a portion of the sheet. (Reference)
For this example, the link is:
This link can be used to create an iFrame tile under "My Shortcuts" in ActionTiles and you can stop here if that's all you need. The main shortcoming is that shortcut tiles don't auto update until you refresh the browser. You'll also need to adjust the width and height of the cells so that it fits well into the tile.
If you want the tile to update without refreshing the browser and adjust its size automatically to fit the cell, then it needs to be turned into an image that can be used for a media tile which has a refresh rate.
Part 2a - create an image to be used as a media tiles
This part requires running a couple command line tools on a Linux server. I have a Raspberry Pi set up that I use for this.
The first tool is wkhtmltoimage which converts any webpage to an image. This supports creating svg, jpg, bmp, or png images. I found that svg is the best quality. The command is:
wkhtmltoimage --crop-w 224 --crop-h 112 --height 1024 "$imgURL" $outFile.svg
crop-w - the width of the spreadsheet range
crop-h - the height of the spreadsheet range
height - this just needs to be larger than crop-h. I found that the default value used was too small
imgURL - the public link to the spreadsheet URL
outFile - where the resulting image is stored
Here is the command I use for this example which outputs the image in a file called stock_example.svg
wkhtmltoimage --crop-w 224 --crop-h 112 --height 1024 "https://docs.google.com/spreadsheets/d/1Id-49n-MnAG6MpzrI3WKAuXXaosg7WVR6PFBIhh8ryY/htmlembed?single=true&gid=0&range=A2:C5&widget=false&chrome=false&headers=false" stock_example.svg
Part 2b - Create a link to the image
Now I use rclone to add the image to my Google Drive, but this also supports other services like Dropbox and Amazon Drive. (If you have your own web server, you could also just copy the file there and not worry about using rclone.) The command for rclone is:
rclone copy <outFile> <driveName>:<folder>
outFile - the path to the image that was created in the last step
driveName - this should be the name of the drive you set up when configuring rclone
folder - the name of the folder on my Google Drive where the image gets saved
For this example (with a drive gdrive and folder ActionTiles) the command is:
rclone copy stock_example.svg gdrive:ActionTiles
Part 2c - Automatic updates
Note: Here I explain how to share the image using Google Drive, but this could also be done with any service that rclone supports like Dropbox or Amazon Drive.
The last step is to automate all of this so that the data is updated periodically. To do that, I put the wkhtmltoimage and rclone commands into a script called updateStocks.sh and then set up a cron job to run at the desired interval. Here's my cron entry which runs every 10 minutes while the market is open (9-4 Mon-Fri)
*/10 9-16 * * 1-5 /home/pi/actiontiles/updateStocks.sh
Then in Google Drive, you need to share the image publicly and you'll get a link like this:
The direct link to the image takes the below format, inserting the proper ID:
So in this example the direct link to the image is:
Then in ActionTiles, use that link for a media tile and set the refresh 600 seconds (or whatever refresh rate you prefer).
Some final notes
- One of the coolest parts of this is that any changes you make to the spreadsheet (values, colors, size, etc.) will automatically show up in ActionTiles. No extra steps are needed after the initial configuration.
- The width and height of the cells in your spreadsheet should be modified so that they fit nicely in a tile
- I also made the background color of my cells match the color used by the ActionTiles theme
- When generating the .svg image, thin cell borders are added. I haven't found a way to get rid of this
- wkhtmltoimage seems to cache the site. Sometimes it takes a few minutes after updating the spreadsheet before the image produced from this tool is updated
If you made it this far, thanks for reading. Please comment if you have any questions or come up with other ideas of how to use Google Sheets to create interesting tiles!
For anyone else who is interested, I wanted a way to have photos load directly into a Media Tile, but I wanted it to change or randomize based on my own intervals. I put together a script that I run every 10 minutes on my local Synology which looks at my photo folder, randomly selects a picture, saves it to a local folder with a set filename, and I can then point the Media Tile at.
The Media Tile can be pointed at a static URL, and in the background the script does all the heavy lifting. The tile just needs to know how often to reload which is dependent on how often you run the script to change the photo.
Let me know if you have any comments or questions.
New to ActionTiles and I can't seem to figure out how to get my Bloomsky Weather Picture to show up? I have it setup as a device in SmartThings and I am getting the readings from the Bloomsky but I don't see where I can add the image. Is this possible?
First, if this type of post isn't permitted please remove it, thank you.
I’m working on a simple application (it's free) that works like a web server for photos for ActionTiles. Basically you copy this application into a directory and point an ActionTiles Media Tile to the applications IP address. The Application will serve up either a specific requested photo, or if you specify random.jpg it will serve a random photo from the directory.
You can also (optionally) specify different directories for different tablets etc. So you could have vacation photos served to the kitchen tablet, while your spouse gets photos of the kids and the garage tablet shows hunting and car photos all while the ActionTiles media tile points to a single local Web URL.
Photos can be: jpg, jpeg, gif and png.
Example directory layout:
The Application Interface:
If anyone has an interest in this local photo server and wants to help in beta testing this please let me know.
I’m working on this in my spare time so response from me could be slow at times as I work full time.
What this program doesn’t do:
Slideshow the photos in sequence (they are randomly presented).
Access directories outside of its own directory.
Charge for it's use (It's beggar ware)
Have an Apple version.
Every once and awhile a camera goes offline and displays a broken image..
Would it be possible to add something along the lines of:
<img src="imagenotfound.gif" alt="Image not found" onerror="this.src='imagefound.gif';" />
Apologies if this kind of post isn't allowed; admin, please delete if so.
I have several tablets mounted to my walls, each displaying a slideshow using ActionTiles. If you are in a similar situation, you looked for a method to return a random image from a specified folder in response to an http request. ActionPixx (http://jayhobo.com/actionpixx) does a good job with this (and a lot of other stuff too!), but it repeats images. I was looking for a solution that guaranteed each image would be displayed at least once before any repeats.
ByteCave Image Server (BIS) is a FREE open-source mini webserver that sends a random image to your browser when a client sends any GET request. You provide a recursively processed folder containing the images to display. Those images are then shuffled and never repeated–on a per client connection basis–until all images have been displayed once. The process then repeats itself for subsequent image requests.
You can specify different folders for each IP address connected through easy UI controls. Thumbnails show you which images are being served. The program can auto-launch on login, minimize to tray, and will remember your settings and numbers of images displayed each time you start.
BIS is a small (~600K) standalone, multi-threaded executable: no installation is required and it doesn't depend on any other system files or DLLs. It supports Windows XP and later, and can also be compiled as-is to run on Linux too. You can view the source code, or just compile it yourself!
PureBasic source code and binaries for both version 1 and version 2 are on GitHub. You can find download and GitHub links on my webpage: http://www.bytecave.net/software.
<keywords: images slideshow image server slide show>
Screensaver with Dakboard
Action Tiles with Media image (refresh every 5 seconds)
The Media image does not refresh anymore after leaving screen.
This was working...
If I try in Chrome works fine. Anyone with same issue?
I wanted to create a thread with the Shields.io interface for folks to share their thoughts and ideas. I really enjoy this method of creating image tiles as it is very dynamic and versatile.
First and foremost, we need to understand what shields.io is. https://www.shields.io/ is a website hosting a free and open source web app capable of making "badges" utilizing API integration for dynamic text display. I've so far only seen one awesome idea with shields.io using ActionTiles, but it turns out it works perfectly for our Media Tiles! The only downside is the amount of text being displayed. I would not recommend any more than four 4-letter words, as any more than that generates an image with text too small to read and with great length it looks horrible.
I will update this thread as new ideas are added. Please do not discuss in this thread those ideas, instead, please create a new thread, discuss the idea there, and I will add it's link here. Thanks!!
Got my Skybell connected (thanks). It now shows the camera icon and when I push it it says "capturing image". This is great but all I see is the default camera icon. It never showst the image from the camera.
I thought actiontiles showed me the captured image on the dash? I don't have an image just an icon. I know skybell won't send actiion tiles a live feed video.
Capability "Image Capture" has been removed from SmartThings's published list of Capabilities, so the slight optimism we may have had regarding getting the image from SmartThings is completely off the table.
We have no indication whatsoever that Ring will open an API for small developers to grab the image either.
I wrote a script for creating a countdown image. I wanted to be able to supply a date (or dates), and then have a countdown that updates each day. You do need somewhere to run the script and a PC that can be a web server (most can do this without to much issue).
You can pick the date, adjust the font, the font size, and even add a background image to the tile if you want.
Media tile that can be configured with two or more URL’s such that the tile rotates among the multiple images every ‘n’ seconds. Would enable rotating among multiple video cameras on a single tile, or rotating between video camera and weather images, for example.
Is it possible to add a stream of photos to a tile?
I have photos in Apple iCloud and would like to have a rotation of images in a tile next to some Smartthings controls to build a dashboard come photo frame.
I have tried the urls for the shared iCloud albums, and also the urls for a DakBoard i also use, but i can't get ActionTiles/Smartthings on the same screen.
I've got a couple of media tiles (static image with 10s refresh time). I've noticed that when I first load up the panel the initial image is one from several days ago - it takes until the first refresh (i.e. 10 seconds) to load the correct image. Also, every so often on a refresh cycle it reverts back to the 'old' image for one cycle, before properly refreshing again.
I have a media tile for national radar and it doesn't seem to update on its own. If I refresh the browser it updates but not otherwise. The one on the left is SmartTiles and the right is ActionTiles, screenshot taken side by side. I have tried adjusting the refresh rate without any luck.
Thanks everyone for your patience with this problem, your helpful symptom and diagnostic details, and your validations / verification of the fix we implemented in ActionTiles v6.2.4.
While there's a chance there are still some remaining or new glitches with similar symptoms to this Topic; we're going to close this one off and start with a clean slate.
Customer support service by UserEcho