How do I add video / images to a SharpTools dashboard?

SharpTools dashboards support a variety of images, photos, and media streams using Media tiles. 
Media tiles include support for the following:
  • MJPG, GIF, or streaming images
  • JPG, PNG, and other static images
  • Support for periodic refresh
  • Adjustable tile size
Check out the bottom of this post for tips on various cameras including those that only provide RTSP streams, walled garden devices like Ring, Nest, Arlo, Wyze, Eufy, and other cameras that otherwise don't provide a compatible stream.
Google Chrome has begun blocking 'Mixed Content' by default. This may affect you if your images or camera streams are coming from a non-SSL source. You can find workarounds in the Google Chrome - Fix Mixed Content community post.

Create Media

In order to use a Media tile, you must first create a Media resource.
  1. Open your SharpTools.io User Page
  2. Tap the Manage Resources tab
  3. Tap the Media option in the sub navigation
  4. Click the Create Media button at the bottom of the list
  5. Enter a Name for your media item
    • This will be used in lists when displaying all your media tiles. It may be helpful to describe what the media item is: eg. 7-day Weather Forecast, Baby's Crib Camera, Front Yard Cam
  6. Enter the URL to your media item
    • This should be the full path directly to the media item.
    • This will often end in a file name like .mjpg, .gif, .png, .jpg
    • On many cameras this may be a special URL ending in something like video.cgi or media.amp
    • The iSpyConnect camera database can be a helpful tool for find the right URL for your camera.
  7. Optionally, enable the Autorefresh option and set a refresh interval 
    • The refresh interval is specified in seconds or minutes. A value of '0' disables the refresh. 
    • The refresh interval is especially helpful for 'static' images (JPG, PNG) which show a new snapshot or image periodically
  8. Click Create 
At this point, your Media Resource is saved. In order to use the media item on a dashboard, refer to the following section.
Does your camera have a URL like the following?
http://username:password@camera/some-path.cgi

Some browsers have begun blocking embedded media items with the username/passwords included in the URL. If your camera uses this format and your media tiles aren't working, see the supporting article for more details and suggested workarounds.

Use Media in a Dashboard

Once you have created a media tile, you'll likely want to use it in a dashboard. In order to do this, we can either modify an existing dashboard or create a new one. 
  1. Open your SharpTools.io User Page
  2. Click the Dashboards link from the top navigation bar
    1. On mobile devices, this option will be available from the left navigation
  3. If you would like to use an existing dashboard, select the dashboard and skip to step 6
  4. Scroll to the bottom of the list and click the "Create Dashboard" button
  5. Enter a Name for the dashboard and click Create
  6. Click the `...` menu in the bottom right-corner of the page to open the menu
  7. Select the 'Edit' option (pencil icon)
  8. Click the green `+` icon in the bottom-right corner of the screen
  9. Select your media item from the Media section of the Add Item window
    • As you click on each media item, the tile is added to your dashboard in the background
    • If you accidentally add an item more than once, you can remove it before you save the dashboard (see step 11)
  10. Optionally, select any other Things or Media items you would like to add to the dashboard and click Done
  11. If you would like to make any adjustments to the layout of the dashboard, you can drag items into different positions or tap the `...` drop-down in the top-right corner of each tile to edit it (if available) or delete it
  12. Click the orange 'save' icon in the bottom-right corner of the screen to save your dashboard changes

At this point you should have a working dashboard with your media tile on it! Check out the help site for more articles or visit the community to share your dashboard or get inspiration from the community.

Tips for Various Cameras

Keep in mind that browsers do not support RTSP streams which are popular on IP cameras. Check your camera / NVR documentation to see if a compatible MJPEG stream or JPEG snapshot is available from your device. The iSpyConnect camera database is also a helpful tool in looking for a compatible URL from your camera.
For IP Cameras that only provide RTSP streams, a common approach is to use an NVR to translate the RTSP stream into a compatible format.
  1. Blue Iris is a popular NVR which runs on Windows and can convert RTSP streams to MJPEG. (Summary Post | Detailed Post)
  2. TinyCam is a popular app for Android which can convert RTSP streams to MJPEG. (Community Post)
    1. TinyCam may result in unstable streams especially on underpowered mobile devices. 
Some cameras are only accessible via their proprietary apps and do not expose any official stream or API to access the camera. For these cameras, you might try searching the community of your respective hub to see if there are any workarounds. For example, Ring ( launch app), Nest ( experimental support, launch app, snapshots), Arlo ( snapshots), and Wyze ( transcode) don't provide official streams but the community has found various ways to integrate these devices.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.