The majority of examples for creating a custom configuration interface create a configuration page in the application code so that it will be part of the application's web interface. This enables the configuration interface to be consistent with the rest of the web pages. In contrast, this example will demonstrate how to change the device's system configuration server that appears on network port number 20034. The change can be as simple as branding with your logo, or modification to the web page content.

You can combine both the custom application and custom system configuration to brand your product

The logo and html files are converted to .cpp files and compiled into the application. The files involved are located in \nburn\nbrtos\source:

• LOGO.gif, the logo displayed on the configuraiton page.
• ROOT.html, the javascript root configuration page.
• RAW.html, Low level HTML only page with links to configuration and the UI.html page that displays the entire JSON object.
• UI.html, displays the entire JSON object.

To customize, follow the overload procedure in which you copy and modify the desired files into your project's overload directory. For example, to change just the logo, create a folder in the overload directory where the file is located: \nbrots\source, and copy your LOGO.gif file there. The majority of customizations will only need to change the logo, but the html overrides are there to suppor any type of customizaton an application requres. A sample LOGO.gif file is provided for you in this application's src folder. Copy this gif to the override\nbrtos\source folder to see the modification.

Running the Example: The example is based on SimpleHtml and provides a basic web page on port 80. Viewing the system configuration page on port 20034 will show the custom modifications. A LOGO.gif file is already provided to demonstrate the use of a custom logo, so you can build and run the example as-is before adding your own customizations.