Create a Web-Enabled Digital Photo Frame: Step 9

Last modified by Microchip on 2023/12/22 13:15

◀ Back to Lab Start

Next Step ▶

Adding Application Code for Web Photo Frame

Generate Web Server Source Files

The web server is hosted inside the Flash memory (NVM), from address 0xD100000.

The file system source files and folder can be found in the folder firmware\src\website_files\.

These need to be converted into C code. The TCP/IP Stack comes with a utility for this called MPFS generator.

Create Web Server Files Using TCP/IP MPFS Generator

The web server .c file that is holding the Flash representation of the Microchip File System can be generated using the utility that comes with the net package in MPLAB® Harmony.

Launch Tool

Execute the following file: Harmony\v3\net\utilities\mpfs_generator\mpfs_net.jar.

Update Folders

Configure the source folder to point to the firmware\src\website_files and the target folder to the src folder of the project, pic32mzef_web_photo_frame\firmware\src.

Note: In case the user needs to change the web interface, modifications can be added into the firmware\src\website_files folder and then the MPFS generator needs to be used.

Code generation consists of creating the following files into the project:

http_net_print.c
http_net_print.h
mpfs_net_img.c

Increase Buffers

Because the web server uses dynamic variables processing to send the image file to the browser, the buffers need to be increased to speed up the loading of the images. To do so, after the code has been generated, open the http_net_print.h file and change the buffer size to 1500 bytes:

#define HTTP_APP_DYNVAR_BUFFER_SIZE 1500**.

Copy Image Files to SD Card

Locate SD card image files in the pic32mzef_web_photo_frame\sdcard_files folder.

Format the SD card as FAT32 and copy all the contents of this folder onto your SD card.

Add Web Photo Frame Application Code

Copy all the files from dev_files\application_code\ to the pic32mzef_web_photo_frame\firmware\src\ folder.

Add the missing .c file to MPLAB X Project Virtual Folder called Source Files.

app_file_handler.c

Add the missing .h files to MPLAB X Project Virtual Folder called Header Files.

app_file_handler.h

Remove the file custom_http_net_app.c from the Source Files.

Generate Graphics Source Code, Build and Program

Open the Microchip Graphics Composer plugin from Project Graph and then open the project in the pic32mzef_web_photo_frame\firmware\src\config\wpf_mzef_cu_tm4301bdefault\WebPhotoFrameLegatoProject.zip file.

Click Generate in the Composer.

Figure: Generating the Graphics Source Code