Home - Geektoolkit/Dynaframe3 GitHub Wiki

Welcome to the Dynaframe wiki!

What is Dynaframe2:

Dynaframe2 is an application designed to run mainly on a raspberry pi connected to a monitor which is meant to act as a picture frame. It supports both images and videos, with crossfading effects between images. It also supports a clock/filename, a webUI so it can be controlled via a phone/tablet, syncing between multiple frames, playlists, and more. The main reason I created it is that I wanted to have dynamic digital picture frames that could do more than just images.

Requirements:

  • Raspberry pi 3B+ or later
  • 32 Gig microSD card or larger
  • Wifi/networking is required for remotely controlling the frames
  • Raspberry Pi OS is recommended

Installation (Raspberry Pi OS default install method)

Step 1: Copy images to the Pictures Folder that you'd like to show (or at least one to get started) Installation is done by running the following command from a terminal window. This command will run elevated, and copies down the bits, unzips them into the /home/pi/dynaframe folder, sets it up to start on boot, and installs unclutter to hide the mouse. If you keep the 'sudo reboot' it'll also reboot into Dynaframe2. Note that the 2.12 portion will change based on what version you want to install. sudo wget https://github.com/Geektoolkit/Dynaframe3/releases/download/2.12/install.sh && bash install.sh; rm -f install.sh ; sudo reboot

Installation - Advanced:

  1. You can always git clone, and using VS2019 build it and publish. This will allow you to have windows builds as well
  2. You can copy down and unzip the Dynaframe2 folder manually. Run: sudo chmod +x Dynaframe to enable execution of the Dynaframe file You can then control/setup things like unclutter to hide the mouse, autostart, etc. This is more work, but would enable it to run on other versions of linux where the above script may not function. Note that I've not tested this.

Using Dynaframe2:

The basic usage of Dynaframe 2 is simple. You will want to create folders under the default Pictures Directory which will represent groups of images of a certain type. For instance, you may have "Family photos", "Dad", "Mom", etc. Or you may do "Holidays", "Vacation 2017" etc. Or for me it's stuff like "MoviePosters", "Scifi", "StarWars", "Videogames", "Inspiration", etc.

When you run dynaframe, it should show the version and the IP of the frame by default at first launch (You can change this in settings). To get to the settings, navigate to the URL shown...it's likely something like: http://192.168.1.42:8000. You should navigate to that on a computer on the same network, your phone, etc. That should bring up the settings page.

Settings...a brief walkthrough:

There are tabs on the settings page. Here's a brief description of them and what they're for:

  • Control - This tab is about controlling the frame directly. Things like 'next photo, previous' or 'screen on/off' are shown here
  • Playlists - This is where you can select which folders to show. When you select folders and hit 'save' this takes effect immediately
  • Sync - This is where you can add other dynaframes. You'll likely want to go to their control pages and 'pause' them, then put their IP in here. When this frame navigates, they'll also navigate to the same imagename or foldername.
  • Settings - This is there you'll change various settings for the frame. Things like if audio should play when a video plays, or the font for the Infobar. One popular setting is the 'Directory to add' portion which can allow you to add a NAS drive, a USB drive, or other paths. You'll have to map/mount that path/drive manually and then add that path here. Note that on reboot automounting may take a bit and images may not be available on the first playthrough till the path shows up.

Automation basics

Dynaframe supports simple automation using HTTP get requests out of the box. You can simply execute a command via the webUI, then copy the URL and break it down and you'll see how the command was executed. For simplicity, I'll document some of the get request portions below. There is currently no auth, the assumption is if someone is on your network they can control the frames.

To use the below commands, you pass them as a 'get' request via either a browser url, a webclient, or other means to port 8000. You'll need to know your frame's IP. For instance:

http://{yourframeip}:8000/?slideshowduration=2500

Will set the slide show duration to 2.5 seconds. To chain multiple commands together, you'll want to use an ampersand (standard get request syntax).

Settings

infobarfontsize - The font size for any of the text that shows up in the 'infobar'. This can be a clock, the ip address, or a file name currently.

slideshowduration - The time, in milliseconds, between images that appear transitiontime - The time, in milliseconds, that it takes to fade from one image to the next

ipaddresstime - The time, in seconds, that the IP address should show on first launch. Please set to '0' to disable this feature.

DateTimeFormat - The c# based date/time format strings. See here for more info: https://docs.microsoft.com/en-us/dotnet/standard/base-types/custom-date-and-time-format-strings

DateTimeFontFamily - The Font name for the infobar. Please ensure the font is installed

rotation - This sets the 'rotation' of the frame in degrees. 0, 90, 180, and 270 are all valid values for this setting

imagescaling - When an image doesn't match the screen resolution, this describes how to stretch it. This uses WPF stretch settings as documented here

VideoStretch - the OMXPlayer stretch setting for how to treat videos which don't fill the screen

VideoVolume - This allows a user to decide if audio should be played when a video plays. Defaults to 'off'

ExpandDirectoriesByDefault - This specifies the Web UI Behavior of if the playlists should be expanded by default, or able to be toggled. 'on' means toggled, 'off' means expanded by default

Commands

Commands work a little differently. You simply pass ?COMMAND= and then the command to execute it. For instance say our frame name is 'leftframe', then the below command would turn the screen off:

http://leftframe:8000/default.htm?COMMAND=SCREENOFF

Below are a list of commands that can be executed: SCREENOFF - Turns the screen off. Internally this uses vcgencmd display_power 0. This works by shutting off the HDMI signal. It may not work on all monitors.

SCREENON - Turns the screen back on...please see "SCREENOFF" for details

REBOOT - Reboots the raspberry pi

SHUTDOWN - Shuts the Raspberry pi off

EXITAPP - Exits Dynaframe

INFOBAR_DATETIME - Sets the infobar to show the Date / Time INFOBAR_FILENAME - Sets the infobar to show the filename INFOBAR_IP - Sets the infobar to show the IP address / version info INFOBAR_HIDDEN - hides the infobar

CONTROL_FIRST - Sets the playlist to the first image CONTROL_BACKWARD - Goes backwards one step in the playlist CONTROL_PAUSE - Pauses the playlist CONTROL_FORWARD - Goes to the next image UTILITY_UPDATEFILELIST - Refreshes the files/playlists. Useful if you delete/add folders being watched and want to force a refresh

Playlist Control

The following are used to manipulate folders in a playlist. The best way to do this is likely to work through the web UI to generate some sample URLS with playlists that exist, and then reverse engineer it to make sense. They have to be escaped so that the file slashes don't conflict with the URLS and such. Here is an example of what one may look like:

http://leftframe:8000/default.htm?cbDirectory=%252fhome%252fpi%252fPictures%252fstarwars&cbDirectory=%252fhome%252fpi%252fPictures%252fscifi&cbDirectory=%252fhome%252fpi%252fPictures%252fIronMan&cbDirectory=%252fhome%252fpi%252fDesktop%252ftripimages%252fVideos

Basically this pares down to: ?cbDirectory={FOLDERNAMEHERE}

And then it's just concatenated with ampersands to add directories. %25 is a slash after it's URL encoded.

Acknowlegements: Thankyou to all of you that have filed issues, provided feedback, ideas, etc. Without your support and passion I'd not have spent as many nights coding into the morning to get this to where it is today.