feat(ui): add port mapping table

LizardByte · Sep 29, 2023 · 7b1088a · 7b1088a
1 parent 17a320b
commit 7b1088a
Show file tree

Hide file tree

Showing 3 changed files with 82 additions and 4 deletions.
diff --git a/src/config.cpp b/src/config.cpp
@@ -16,6 +16,8 @@
 
 #include "config.h"
 #include "main.h"
+#include "nvhttp.h"
+#include "rtsp.h"
 #include "utility.h"
 
 #include "platform/common.h"
@@ -1049,7 +1051,7 @@ namespace config {
     bool_f(vars, "always_send_scancodes", input.always_send_scancodes);
 
     int port = sunshine.port;
-    int_f(vars, "port"s, port);
+    int_between_f(vars, "port"s, port, { 1024 + nvhttp::PORT_HTTPS, 65535 - rtsp_stream::RTSP_SETUP_PORT });
     sunshine.port = (std::uint16_t) port;
 
     string_restricted_f(vars, "address_family", sunshine.address_family, { "ipv4"sv, "both"sv });

diff --git a/src/main.cpp b/src/main.cpp
@@ -836,7 +836,13 @@ write_file(const char *path, const std::string_view &contents) {
  */
 std::uint16_t
 map_port(int port) {
-  // TODO: Ensure port is in the range of 21-65535
+  // Ensure port is in the range of 1024-65535
+  if (port < 1024 || port > 65535) {
+    BOOST_LOG(warning) << "Port out of range: "sv << port;
+    return 0;
+  }
+
   // TODO: Ensure port is not already in use by another application
+
   return (std::uint16_t)((int) config::sunshine.port + port);
 }
diff --git a/src_assets/common/assets/web/config.html b/src_assets/common/assets/web/config.html
@@ -625,14 +625,74 @@ <h1 class="my-4">Configuration</h1>
         <label for="port" class="form-label">Port</label>
         <input
           type="number"
-          min="0"
-          max="65529"
+          min="1029"
+          max="65514"
           class="form-control"
           id="port"
           placeholder="47989"
           v-model="config.port"
         />
         <div class="form-text">Set the family of ports used by Sunshine</div>
+        <!-- Add warning if any port is less than 1024 -->
+        <div class="alert alert-danger" v-if="(+effectivePort - 5) < 1024">
+          <b>Warning:</b> Ports below 1024 are not recommended!
+        </div>
+        <!-- Add warning if any port is above 65535 -->
+        <div class="alert alert-danger" v-if="(+effectivePort + 21) > 65535">
+          <b>Danger:</b> Ports above 65535 are not available!
+        </div>
+        <!-- Create a port table for the various ports needed by Sunshine -->
+        <table class="table">
+          <thead>
+            <tr>
+              <th scope="col">Description</th>
+              <th scope="col">Protocol</th>
+              <th scope="col">Port</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td>HTTPS</td>
+              <td>TCP</td>
+              <td>{{+effectivePort - 5}}</td>
+            </tr>
+            <tr>
+              <td>HTTP</td>
+              <td>TCP</td>
+              <td>{{+effectivePort}}</td>
+            </tr>
+            <tr>
+              <td>Web UI</td>
+              <td>TCP</td>
+              <td>{{+effectivePort + 1}}</td>
+            </tr>
+            <tr>
+              <td>RTSP</td>
+              <td>TCP</td>
+              <td>{{+effectivePort + 21}}</td>
+            </tr>
+            <tr>
+              <td>Video</td>
+              <td>UDP</td>
+              <td>{{+effectivePort + 9}}</td>
+            </tr>
+            <tr>
+              <td>Control</td>
+              <td>UDP</td>
+              <td>{{+effectivePort + 10}}</td>
+            </tr>
+            <tr>
+              <td>Audio</td>
+              <td>UDP</td>
+              <td>{{+effectivePort + 11}}</td>
+            </tr>
+            <tr>
+              <td>Mic (unused)</td>
+              <td>UDP</td>
+              <td>{{+effectivePort + 13}}</td>
+            </tr>
+          </tbody>
+        </table>
       </div>
       <!-- Quantization Parameter -->
       <div class="mb-3">
@@ -1309,6 +1369,16 @@ <h2 class="accordion-header">
         this.global_prep_cmd.push(template);
       },
     },
+    computed: {
+      effectivePort() {
+        // Convert config.port to a number.
+        const port = +this.config?.port;
+
+        // Check if port is NaN or a falsy value (like 0, empty string, etc.).
+        // If so, default to config port. Otherwise, use the value of port.
+        return port ? port : 47989;
+      }
+    }
   });
 </script>