Demo LED Matrix

Note: This app is still under development.

Control LED Matrix display via a web app created with dynamic pages.

API Features Demonstrated

Platforms

This app works on:

Requirements and Prerequisites

Requires a ZentriOS evaluation board and an 8x8 LED matrix display, such as provided with the Zentri ASG001 Monitor Backpack.

Resources

The file settings.ini is used to initialize the device. This is packaged with the .zap file downloaded to the device.

A root html file, led_matrix/index.html, is served by the ZentriOS HTTP Server.

Resources are downloaded to device flash in the app download process.

Description

The app uses a web interface with dynamic HTTP pages to control and monitor an 8x8 LED Matrix display.

Instructions for Use

Open a ZentriOS serial terminal to the device. See Getting Started, Opening a ZentriOS Terminal.

This app assumes your ZentriOS device is set up with the credentials to join your local network. If you have not already set up network credentials, on the ZentriOS terminal, run the commands:

network_up -s
save

See the Wi-Fi Command API documentation for network_up and save.

Build, download and run the app.

After the app has joined the network, it displays a message:

> Starting 8x8 LED Matrix Demo
From your browser, enter the URL: http://ledmatrix.local/ to control the display

Note the slash at the end of http://ledmatrix.local/.

Connect a WLAN client (smartphone/PC/tablet) to the same network as the ZentriOS device and open a web browser.

The client web browser must support HTML5 slider controls for the web page to appear as intended.

From your browser, enter the URL: http://ledmatrix.local/ to control the display.

If your client platform doesn't support mDNS, you can view the page by entering the device IP address, followed by a slash, e.g.

http://192.168.6.7/

To see the device IP address, at the ZentriOS terminal enter the following command:

get network.ip

The web page displayed is similar to the following:

Without using the demonstration web page, you can control the LED matrix array with GET requests to the dynamic page URLs.

For example:

Implementation

The HTTP Server macro calls set up URLs with associated callback processor functions:

HTTP_SERVER_DYNAMIC_PAGES_START
    HTTP_SERVER_DYNAMIC_PAGE("/led_matrix/update/text",          update_text_processor),
    HTTP_SERVER_DYNAMIC_PAGE("/led_matrix/update/blink",         update_blink_processor),
    HTTP_SERVER_DYNAMIC_PAGE("/led_matrix/update/brightness",    update_brightness_processor),
    HTTP_SERVER_DYNAMIC_PAGE("/led_matrix/update/scroll",        update_scroll_processor),
    HTTP_SERVER_DYNAMIC_PAGE("/led_matrix/retrieve/all",         retrieve_all_processor),
HTTP_SERVER_DYNAMIC_PAGES_END

zn_app_init

zn_app_deinit

update_text_processor

update_blink_processor

update_brightness_processor

update_scroll_rate

retrieve_all_processor

The index.html page JavaScript sends GET requests with asynchronous XMLHttpRequests, and processes the json response to /led_matrix/retrieve/all in an XMLHttpRequest callback.

Source

See:

See also: