Merge pull request #87 from DroneBridge/v2.0dev

V2.0RC3

.github/actions/esp-idf-5_3-with-node/Dockerfile

@@ -0,0 +1,6 @@
+FROM espressif/idf:release-v5.3
+RUN apt update
+RUN apt-get install -y curl
+RUN curl -fsSL https://deb.nodesource.com/setup_18.x -o nodesource_setup.sh
+RUN bash nodesource_setup.sh
+RUN apt -y install nodejs

.github/actions/esp-idf-5_3-with-node/action.yml

@@ -0,0 +1,22 @@
+name: "Espressif IoT Development Framework (ESP-IDF), plus node.js and npm"
+branding:
+  color: red
+  icon: wifi
+inputs:
+  target:
+    description: "ESP32 variant to build for"
+    default: "esp32"
+    required: false
+  command:
+    description: "Command to run inside the docker container (default: builds the project)"
+    default: "idf.py build"
+    required: false
+runs:
+  using: 'docker'
+  image: 'Dockerfile'
+  env:
+    IDF_TARGET: "${{inputs.target}}"
+  args:
+    - "/bin/bash"
+    - "-c"
+    - "${{inputs.command}}"

.github/workflows/esp_idf.yml

@@ -42,3 +42,20 @@ jobs:
       with:
         target: "${{ matrix.target }}"
         command: "idf.py set-target ${{matrix.target}} build"
+  build_esp32_v5_3:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        target: ["esp32", "esp32s2", "esp32s3", "esp32c3", "esp32c6"]
+      fail-fast: false
+    steps:
+    - name: Checkout repo
+      uses: actions/checkout@v4
+      with:
+        ref: ${{ github.ref }}
+        submodules: 'recursive'
+    - name: ESP-IDF v5.3 build
+      uses: ./.github/actions/esp-idf-5_3-with-node
+      with:
+        target: "${{ matrix.target }}"
+        command: "idf.py set-target ${{matrix.target}} build"

.gitignore

@@ -18,3 +18,4 @@ dependencies.lock
 .openocd_setup.ps1
 frontend/node_modules
 *.old
+/node_modules

CMakeLists.txt

@@ -22,6 +22,6 @@ add_custom_command (
         POST_BUILD
         COMMAND cmake -E remove_directory "${CMAKE_SOURCE_DIR}/frontend/build"
 )
-set(PROJECT_VER "2.0RC2")
+set(PROJECT_VER "2.0RC3")
 include($ENV{IDF_PATH}/tools/cmake/project.cmake)
 project(db_esp32)

README.md

@@ -59,33 +59,32 @@ These boards are very low in price, have everything you need and are also very s
   <img src="https://github.com/DroneBridge/ESP32/assets/24637325/e3b2975d-7de4-41af-b052-e4fa024d905e" alt="Official Boadrd DroneBridge for ESP32" width="350">
 * **Official board for easy use as ground station coming soon!**
 
-[For further info please check the wiki!](https://github.com/DroneBridge/ESP32/wiki/Supported-Hardware)
+[For further info please check the wiki!](https://dronebridge.gitbook.io/docs/dronebridge-for-esp32/hardware-and-wiring)
 
 ## Installation/Flashing using precompiled binaries
 
-First download the latest release from this repository.
-[You can find them here](https://github.com/DroneBridge/ESP32/releases).
+[It is recommended that you use the official online flashing tool!](https://dronebridge.github.io/ESP32/install.html)
 
-There are multiple ways how to flash the firmware.  
-**[For further info please check the wiki!](https://github.com/DroneBridge/ESP32/wiki/Flashing-DroneBridge-for-ESP32)**
+In any other case there are multiple ways how to flash the firmware.  
+**[For further info please check the wiki!](https://dronebridge.gitbook.io/docs/dronebridge-for-esp32/installation)**
 
 ## Wiring
 
 1.  Connect the UART of the ESP32 to a 3.3V UART of your flight controller. It is not recommended to use the ESP32s pins that are marked with TX & RX since they often are connected to the internal serial ouput. Go for any other pin instead!
 2.  Set the flight controller port to the desired protocol.
 
 **Check out the manufacturer datasheet! Only some modules can take more than 3.3V. Follow the recommendations by the ESP32 board manufacturer for powering the device**  
-**[For further info please check the wiki!](https://github.com/DroneBridge/ESP32/wiki/Wiring-Instructions)**
+**[For further info please check the wiki!](https://dronebridge.gitbook.io/docs/dronebridge-for-esp32/hardware-and-wiring)**
 
 ## Configuration
-1.  Connect to the wifi `DroneBridge ESP32` with password `dronebridge`
+1.  Connect to the WiFi `DroneBridge ESP32` with password `dronebridge`
 2.  In your browser type: `dronebridge.local` (Chrome: `http://dronebridge.local`) or `192.168.2.1` into the address bar.
  **You might need to disable the cellular connection to force the browser to use the WiFi connection**
 3.  Configure as you please and hit `save`
 
 ![DroneBridge for ESP32 web interface](wiki/dbesp32_webinterface.png)
 
-**[For further info please check the wiki!](https://github.com/DroneBridge/ESP32/wiki/Configuration)**
+**[For further info please check the wiki!](https://dronebridge.gitbook.io/docs/dronebridge-for-esp32/configuration)**
 
 ## Use with QGroundControl, Mission Planner or any other GCS
 
@@ -109,123 +108,6 @@ For questions or general chatting regarding DroneBridge for ESP32 please visit t
 </a>
 </div>
 
-## Developers
-
-### Compile
- You will need the Espressif SDK: esp-idf + toolchain. Check out their website for more info and on how to set it up.
- The code is written in pure C using the esp-idf (no Arduino libs).  
-Compile using esp-idf v5.1 or esp-idf v5.2
--   ESP32   `idf.py set-target esp32 build`
--   ESP32S2 `idf.py set-target esp32s2 build`
--   ESP32S3 `idf.py set-target esp32s3 build`
--   ESP32C3 `idf.py set-target esp32c3 build`
-
-Or compile all at once with release configuration running the release scripts for bash or powershell `create_release_zip.sh` or `create_release_zip.ps1`
-
- **This project supports the v5.1.2 & v5.2.2 of ESP-IDF**  
- Compile and flash by running: `idf.py build`, `idf.py flash`
-
-The web interface is built using the command `idf.py frontend`. This is done automatically when compiling the entire project using `idf.py build`. 
-The frontend is built to `build/frontend`.  
-Alternatively, the frontend can be built using `npm install && npm i -D shx && npm run build` within `/frontend/`, then manually copy the content of `/frontend/build` to `/build/frontend`
-
- ### API
-The web interface communicates with a REST: API on the ESP32. You can use that API to set configurations not selectable 
-via the web interface (e.g. baud rate). It also allows you to easily integrate DroneBridge for ESP32.
-
-
-#### Request settings
-```http request
-GET http://dronebridge.local/api/settings
-```
-
-#### Request stats
-```http request
-GET http://dronebridge.local/api/system/stats
-```
-
-#### Request ESP32 info
-```http request
-GET http://dronebridge.local/api/system/info
-```
-
-#### Request IP and port of active UDP connections
-```http request
-GET http://dronebridge.local/api/system/clients
-```
-
-#### Trigger a reboot
-```http request
-POST http://dronebridge.local/api/system/reboot
-```
-
-#### Trigger a general settings change:
-Send a valid JSON
-```json
-{
-  "esp32_mode":	2,
-  "wifi_ssid":	"DroneBridge",
-  "wifi_pass":	"dronebridge",
-  "ap_channel":	6,
-  "trans_pack_size":	128,
-  "tx_pin":	4,
-  "rx_pin":	5,
-  "cts_pin":	0,
-  "rts_pin":	0,
-  "rts_thresh":	64,
-  "baud":	115200,
-  "telem_proto":	4,
-  "ltm_pp":	2,
-  "ap_ip":	"192.168.2.1",
-  "static_client_ip":	"",
-  "static_netmask":	"",
-  "static_gw_ip":	""
-  }
-```
-to
-```http request
-POST http://dronebridge.local/api/settings
-```
-
-#### Manually add a UDP connection target:
-Send a valid JSON
-```json
-{
-  "ip": "XXX.XXX.XXX.XXX",
-  "port": 452
-}
-```
-to
-```http request
-POST http://dronebridge.local/api/settings/clients/udp
-```
-
-#### Assign a static IP to the ESP32 when in WiFi client mode:
-Send a valid JSON to set static IP and send the same JSON but with empty strings (`"client_ip": ""`) to remove the static IP setting
-```json
- {
-  "client_ip": "XXX.XXX.XXX.XXX",
-  "netmask": "XXX.XXX.XXX.XXX",
-  "gw_ip": "XXX.XXX.XXX.XXX"
- }
-```
-to
-```http request
-POST http://dronebridge.local/api/settings/static-ip
-```
-
- ### Testing
-Check `/test` for scripts triggering the API.
-
- To test the frontend without the ESP32 run 
-
- ```sh
- npm install -g json-server
- json-server db.json --routes routes.json
- ```
-Set `const ROOT_URL = "http://localhost:3000/"` inside `index.html` and the `<script>` block
-
-
 [contributors-shield]: https://img.shields.io/github/contributors/DroneBridge/ESP32.svg?style=for-the-badge
 [contributors-url]: https://github.com/DroneBridge/ESP32/graphs/contributors
 [forks-shield]: https://img.shields.io/github/forks/DroneBridge/ESP32.svg?style=for-the-badge

create_release_zip.ps1

@@ -1,8 +1,8 @@
 # Execute in an esp-idf enabled PowerShell
 # This script will create a combined zip file containing binaries for all supported esp32 boards
 
-$release_foldername = "DroneBridge_ESP32_vXX"
-$release_name_zip = "DroneBridge_ESP32_vXX.zip"
+$release_foldername = "DroneBridge_ESP32_v2.0RC3"
+$release_name_zip = "DroneBridge_ESP32_v2.0RC3.zip"
 
 mkdir $release_foldername
 mkdir build

frontend/dronebridge.css

@@ -22,8 +22,7 @@ body {
     height: 100%;
     margin: 0;
     color: #fff;
-    background: #003166;
-    background: linear-gradient(180deg, #003166 0, #135ba8 100%)
+    background-image: linear-gradient(127deg, #001f3f 5%, #0074D9 100%);
 }
 
 h2 {
@@ -66,3 +65,68 @@ input, select {
 .dot_red {
     background-color: #f63e3e
 }
+
+.small_text {
+    font-size: small
+}
+
+.img_button:hover {
+    cursor: pointer;
+    filter: invert(60%) sepia(100%) saturate(509%) hue-rotate(334deg) brightness(101%) contrast(101%);
+}
+
+.img_button::selection {
+    cursor: pointer;
+    filter: invert(60%) sepia(100%) saturate(509%) hue-rotate(334deg) brightness(101%) contrast(101%);
+}
+
+.txt_button:hover {
+    color: #ff9734;
+    cursor: help;
+}
+
+/* Tooltip container */
+.tooltip {
+    position: relative;
+    display: inline-block;
+}
+
+/* Tooltip text */
+.tooltip .tooltiptext {
+    visibility: hidden;
+    width: fit-content;
+    background-color: #555;
+    color: #fff;
+    text-align: center;
+    padding: 5px 5px;
+    border-radius: 6px;
+
+    /* Position the tooltip text */
+    position: absolute;
+    z-index: 1;
+    bottom: 125%;
+    left: 50%;
+    margin-left: -60px;
+
+    /* Fade in tooltip */
+    opacity: 0;
+    transition: opacity 0.3s;
+}
+
+/* Tooltip arrow */
+.tooltip .tooltiptext::after {
+    content: "";
+    position: absolute;
+    top: 100%;
+    left: 50%;
+    margin-left: -5px;
+    border-width: 5px;
+    border-style: solid;
+    border-color: #555 transparent transparent transparent;
+}
+
+/* Show the tooltip text when you mouse over the tooltip container */
+.tooltip:hover .tooltiptext {
+    visibility: visible;
+    opacity: 1;
+}