|
| 1 | +.. _Webserver-Demo-User-Guide-label: |
| 2 | + |
| 3 | +Webserver Demo - User Guide |
| 4 | +=========================== |
| 5 | + |
| 6 | +Overview |
| 7 | +-------- |
| 8 | + |
| 9 | +This document describes the Out of Box Web Server Demo Application, which is delivered |
| 10 | +with the |__SDK_FULL_NAME__| |__PART_FAMILY_NAME__|, applicable to boards like the |
| 11 | +Beaglebone Green Eco and AM335x EVM. The main purpose of this demo is to showcase a |
| 12 | +glimpse of the ARM analytics AI stack integrated into the filesystem, providing an |
| 13 | +out-of-box experience even when no display is connected to the board. |
| 14 | + |
| 15 | +The demo showcases a web server running on an AM335x based board, providing a web interface with three key sections: |
| 16 | + |
| 17 | +* **Audio Classification Demo**: Allows users to connect a USB audio device to run real-time audio classification, displaying classification statistics. |
| 18 | +* **Live CPU Performance Metrics**: Provides a real-time CPU usage indicator, historical usage data for the last 5 minutes, and detailed CPU information. |
| 19 | +* **Documentation Links**: Offers convenient access to relevant documentation. |
| 20 | + |
| 21 | +All of the necessary equipment requirement and instructions are provided here. |
| 22 | + |
| 23 | +Hardware Prerequisites |
| 24 | +---------------------- |
| 25 | + |
| 26 | +- TI AM335x based board (e.g., AM335x EVM, Beaglebone Green Eco) |
| 27 | + (Note: For the Beaglebone Green Eco, a display is available via an HDMI cape.) |
| 28 | +- PC (Windows or Linux) |
| 29 | +- Ethernet cables |
| 30 | +- Ethernet switch or ethernet router with DHCP service |
| 31 | +- SD card (minimum 16GB) |
| 32 | + |
| 33 | +Get Started |
| 34 | +----------- |
| 35 | + |
| 36 | +1. Create an SD card with the Linux SDK image downloaded from |__SDK_DOWNLOAD_URL__|. |
| 37 | + |
| 38 | +2. Insert the SD card into the AM335x based board. |
| 39 | + |
| 40 | +3. Set the Boot mode to "Boot from SD card". |
| 41 | + |
| 42 | +4. Connect an ethernet cable from your ethernet switch or router to the |
| 43 | + AM335x based board. |
| 44 | + |
| 45 | +5. Connect your PC to the same ethernet switch or router. |
| 46 | + |
| 47 | +6. Connect the UART to the PC's USB port. |
| 48 | + |
| 49 | +7. Open a terminal program (like TeraTerm or minicom) and connect to the |
| 50 | + serial port. Set the port to 115200bps, 8 bit, no parity, 1 stop bit, no flow control. |
| 51 | + |
| 52 | +8. Power on the AM335x based board. |
| 53 | + |
| 54 | +9. After the Linux boot completes, login as "root". Use the `ifconfig` command |
| 55 | + to find out the IP address of the device. |
| 56 | + |
| 57 | +10. On the host PC, open a Internet Browser and enter in the following: ``http://<IP_ADDRESS_OF_AM335x_Board>:3000`` |
| 58 | + |
| 59 | +11. The following web page will be displayed, the home page shows as below. |
| 60 | + |
| 61 | +.. image:: /images/Webserver_home_page.PNG |
| 62 | + :alt: Webserver Demo Page |
| 63 | + :width: 75% |
| 64 | + |
| 65 | +Audio Classification Demo |
| 66 | +------------------------- |
| 67 | + |
| 68 | +The web interface provides an audio classification demo that uses the integrated ARM analytics AI stack. |
| 69 | + |
| 70 | +.. image:: /images/Webserver_audio_classification.PNG |
| 71 | + :alt: Audio Classification Demo |
| 72 | + :width: 75% |
| 73 | + |
| 74 | +To use the demo: |
| 75 | + |
| 76 | +1. Connect a USB audio device (e.g., a USB headset) to the AM335x based board. |
| 77 | +2. Click the "Refresh Devices" button to detect the connected audio capture device. |
| 78 | +3. Select the desired audio capture device from the list of available devices. |
| 79 | +4. Click the "Start Classification" button to begin real-time audio classification. |
| 80 | +5. The "Live Classification" section will display the current classification, total classifications, unique classes, session time, and updates per minute. |
| 81 | +6. A "Classification History" log is also available, showing a timestamped record of classifications. |
| 82 | +7. Click the "Stop Classification" button to end the demo. |
| 83 | + |
| 84 | +Live CPU Performance Metrics |
| 85 | +---------------------------- |
| 86 | + |
| 87 | +The web interface also provides a live view of the CPU performance metrics. |
| 88 | + |
| 89 | +.. image:: /images/Webserver_CPU_Performance.PNG |
| 90 | + :alt: CPU Performance Metrics |
| 91 | + :width: 75% |
| 92 | + |
| 93 | +This section includes: |
| 94 | + |
| 95 | +* **CPU Usage**: A real-time gauge showing the current CPU utilization. |
| 96 | +* **CPU History**: A graph displaying the CPU usage history over the last 5 minutes. |
| 97 | +* **Statistics**: Average and maximum CPU usage calculated for the data from CPU History data. |
| 98 | + |
| 99 | +Software Architecture |
| 100 | +--------------------- |
| 101 | + |
| 102 | +- **Web Interface (GUI) & Web Server:** The web interface is a dynamic HTML page with JavaScript, served by a web server (e.g., Node.js, though implementation may vary). This server handles requests for the audio classification demo, live CPU metrics, and general documentation links. It facilitates data exchange between the client (browser) and the backend Linux applications. |
| 103 | + |
| 104 | +- **Linux Applications:** Several background Linux applications run on the AM335x. These include: |
| 105 | + - A C application that reads real-time system information (like CPU stats from /proc/stat) and makes it available to the web server. |
| 106 | + - An application handling the audio classification demo, interacting with USB audio devices and a gstreamer pipeline running the ARM analytics AI stack. |
| 107 | + |
| 108 | +- **ARM Analytics AI Stack:** This integrated component within the filesystem provides the intelligence for the audio classification demo, processing audio input and generating classification statistics. |
| 109 | + |
| 110 | +Demo Internals |
| 111 | +-------------- |
| 112 | + |
| 113 | +- The user interface is an HTML page that uses JavaScript to make asynchronous requests to the web server for updated data and to control the audio classification demo. |
| 114 | + |
| 115 | +- The web server (e.g., implemented using a lightweight HTTP server) runs on the Linux A8 core. It serves the static web page and provides APIs to interact with the underlying Linux applications for system data and analytics execution. |
| 116 | + |
| 117 | +- A background C application collects system statistics and communicates with the web server. |
| 118 | + |
| 119 | +- The audio classification demo leverages a dedicated application that interfaces with a USB audio device and the integrated ARM analytics AI stack to perform real-time sound classification. |
| 120 | + |
| 121 | +Directory Structure |
| 122 | +------------------- |
| 123 | + |
| 124 | +The source code for the demo can be found `here <https://github.com/TexasInstruments/webserver-oob-demo>`__ . |
| 125 | + |
| 126 | ++------+---------------------------------+---------------------------------------------+ |
| 127 | +| | **Directory Name** | **Description** | |
| 128 | ++======+=================================+=============================================+ |
| 129 | +| 1 | `webserver_app/app` | GUI code (HTML, CSS, JavaScript) | |
| 130 | ++------+---------------------------------+---------------------------------------------+ |
| 131 | +| 2 | `webserver_app/linux_app` | Linux application code (C code) | |
| 132 | ++------+---------------------------------+---------------------------------------------+ |
| 133 | +| 3 | `webserver_app/webserver` | Web server code (Node.js) | |
| 134 | ++------+---------------------------------+---------------------------------------------+ |
0 commit comments