diff options
| author | xengineering <me@xengineering.eu> | 2025-04-12 12:11:33 +0200 |
|---|---|---|
| committer | xengineering <me@xengineering.eu> | 2025-04-12 12:11:33 +0200 |
| commit | 3b857fd34c9e92eed346b7ea73706f50a193fe14 (patch) | |
| tree | 39c72df3f1a18fc6ab7b513116afd5d460e1ff87 | |
| parent | ddcf8559d4fbb9bd6942ac46d5c4970ef08b16d1 (diff) | |
| download | iot-contact-3b857fd34c9e92eed346b7ea73706f50a193fe14.tar iot-contact-3b857fd34c9e92eed346b7ea73706f50a193fe14.tar.zst iot-contact-3b857fd34c9e92eed346b7ea73706f50a193fe14.zip | |
fw: app: Re-design web page
This enables simple.css also for the device-hosted website and
restructures the HTML a bit.
| -rw-r--r-- | fw/app/CMakeLists.txt | 7 | ||||
| -rw-r--r-- | fw/app/src/http.c | 16 | ||||
| -rw-r--r-- | fw/app/src/index.html | 17 | ||||
| l--------- | fw/app/src/simple.css | 1 |
4 files changed, 35 insertions, 6 deletions
diff --git a/fw/app/CMakeLists.txt b/fw/app/CMakeLists.txt index 1a9d1cf..1a63b77 100644 --- a/fw/app/CMakeLists.txt +++ b/fw/app/CMakeLists.txt @@ -42,6 +42,13 @@ generate_inc_file_for_target( generate_inc_file_for_target( app + src/simple.css + ${ZEPHYR_BINARY_DIR}/include/generated/simple.css.gz.inc + --gzip +) + +generate_inc_file_for_target( + app src/iot-contact.js ${ZEPHYR_BINARY_DIR}/include/generated/iot-contact.js.gz.inc --gzip diff --git a/fw/app/src/http.c b/fw/app/src/http.c index e206f86..08b59c1 100644 --- a/fw/app/src/http.c +++ b/fw/app/src/http.c @@ -34,6 +34,21 @@ struct http_resource_detail_static index_resource_detail = { .static_data_len = sizeof(index_html_gz), }; +static const uint8_t css_gz[] = { + #include "simple.css.gz.inc" +}; + +struct http_resource_detail_static css_resource_detail = { + .common = { + .type = HTTP_RESOURCE_TYPE_STATIC, + .bitmask_of_supported_http_methods = BIT(HTTP_GET), + .content_encoding = "gzip", + .content_type = "text/css", + }, + .static_data = css_gz, + .static_data_len = sizeof(css_gz), +}; + static const uint8_t js_html_gz[] = { #include "iot-contact.js.gz.inc" }; @@ -95,6 +110,7 @@ HTTP_SERVICE_DEFINE(http_service, NULL, &http_port, 1, 10, NULL, NULL); HTTP_RESOURCE_DEFINE(index_resource, http_service, "/", &index_resource_detail); HTTP_RESOURCE_DEFINE(websocket_resource, http_service, "/", &websocket_resource_detail); HTTP_RESOURCE_DEFINE(favicon_resource, http_service, "/favicon.ico", &favicon_resource_detail); +HTTP_RESOURCE_DEFINE(css_resource, http_service, "/simple.css", &css_resource_detail); HTTP_RESOURCE_DEFINE(js_resource, http_service, "/iot-contact.js", &js_resource_detail); int init_http_server(void) { diff --git a/fw/app/src/index.html b/fw/app/src/index.html index 5817818..d4ccd45 100644 --- a/fw/app/src/index.html +++ b/fw/app/src/index.html @@ -8,14 +8,19 @@ <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> - <title>iot-contact</title> + <title>IoT contact</title> + <link rel="stylesheet" type="text/css" href="simple.css"> <script type="text/javascript" src="/iot-contact.js"></script> </head> <body> - <h4>iot-contact</h4> - <p> - <label for="heartbeat">Heartbeat</label> - <meter id="heartbeat" min="0" max="1" value="0"></meter> - </p> + <header> + <h1>IoT contact</h1> + </header> + <main> + <p class="notice"> + <label for="heartbeat">Heartbeat</label> + <meter id="heartbeat" min="0" max="1" value="0"></meter> + </p> + </main> </body> </html> diff --git a/fw/app/src/simple.css b/fw/app/src/simple.css new file mode 120000 index 0000000..5483eb1 --- /dev/null +++ b/fw/app/src/simple.css @@ -0,0 +1 @@ +../../../simple.css/simple.css
\ No newline at end of file |