Notes

This page shows a simple setup for Custom Tiles. Please see the README for more information https://github.com/UniversalDevicesInc/html-node-views/blob/main/README.md

Testing Information and examples for html node views. This document is intended for developers and testers. HTML Node Views are not production ready.

During testing all HTML files should be hosted on a publicly accessible and secure server. Production files may be saved on eisy or other location to be determined by UDI.

Simple Start

I have created and hosted a simple Custom Tile so that developers/testers can quickly add a custom tile. This should show everything working as intended before creating your own Custom Tile. To make your own tiles please follow the instructions in the README linked above in NOTES. To use this example your system must have at least one dimmable node.

Add a dimmable node to favorites if one does not already exist.

Click the settings icon from the Node's Dashboard.

Click Add to Favorites

Enter Edit Mode In Favorites, by clicking the pencil icon at the top (Tip: Remember to disable edit mode by clicking the same button when done with this example)

Once in Edit Mode Click the Favorite Tile related to the dimmable node.

Select Edit

Click Favorite Type

Select "Custom Tile"

Add https://javierrefuerzo.github.io/example-tile?height=180&span=3.html as the URL for the Custom Tile.

Tip: UD Mobile uses a query string in the file name to determine the tile size. The question mark in the query string must be encoded to "%3F" in the url to view in a normal web browser, i.e. https://javierrefuerzo.github.io/example-tile%3Fheight=180&span=3.html. Adding size parameters as a query string in the file name is done as UDM needs to know the size before loading, query string may not be required if/when files are saved to eisy.

Click Save. The custom tile is now linked to the favorite. Finally Click the Edit button at the top to disable edit mode