I bought a Google Chromecast device a few days ago. I like the “screen saver” function that’s built in when the device isn’t in use. It pulls photographic images from someplace ( presumably from a Chromecast web page ) and displays them in succession.
I thought it would be nice to be able to arrange my own slideshow using Chrome on my Windows computer. When one installs the “Cast” extension to Chrome, any tab in the browser can be transmitted to the Chromecast device for viewing on the television. Although I implemented it on Windows, the code is intended to be reusable on OS/X, Linux, or other OS’s that support Casting the contents of a browser tab.
All of the mail source files and referenced image files below can be found in the following archive:
Here’s the Github repository for the code:
I wrote the script in Python 2.7. I knew that it would be relatively straightforward to implement the HTML-formatting portion of the script in Python and the built-in web-server would lend itself to serving up the content.
Let’s first take a look at the HTML template file named “template.htm” :
When the above script loads, it will set the lone IMG tag’s SRC property to the name of the first image in the list. After the specified delay, the SRC attribute will change to the next image name in the list. When all images are exhausted, the process begins at the start of the list.
Image files must be placed in a directory named “img” immediately underneath the current directory. I have provided two images in the .zip archive mentioned earlier in the “img” directory: “one.jpg” and “two.jpg”.
Here is the Python code to generate the file “index.html” in the current directory based on “template.htm”.
When executed in the current directory with the file “template.htm” present and the “img” directory containing the two previously-mentioned image files:
The generated file “index.html” would look something like this:
Note that the $$1 pseudo-variable from “template.htm” has been replaced with the value of Python script’s variable named delay_millis. The $$2 pseudo-variable has been replaced with the value in the Python script’s variable named html.
After the index.html file is created, the build-in Python web-server is started.
To view the slideshow, bring up the Chrome browser and visit the address: http://localhost
You should see one of the two JPEG files. Ten seconds later, you should see the other one. If you supplied your own image files, you should see them every 10 seconds. After you click the “Cast” icon in Chrome, you should be able to choose your Chromecast device as a receiver of the tab’s contents. Your TV should now be displaying your slideshow.
You can change the viewing frequency by changing the delay_millis variable in the Python script.
I tried to center the images with some CSS, but I wasn’t able to vertically-center them. You are encouraged to edit the template.htm file to accommodate your needs.
Other changes that you might choose to make could include ordering the list of images based on filename, timestamp, or some other characteristic. You might add sound and other HTML elements. The Python script and HTML/JS template are meant to be a starting-point. Have fun!