feat(public_network_access): improve public window link display and set custom port (#100)

jinzhongjia · web-flow · commit 25e8142c76d1 · 2025-06-22T01:20:40.000+08:00
- set public window port to 9090 for network access
- display both localhost and full URL in private window
- update private.html to show two URL spans for public window
- fix script src path in private.html and public.html
diff --git a/examples/public_network_access/main.zig b/examples/public_network_access/main.zig
@@ -26,17 +26,23 @@ fn public_window_events(e: *webui.Event) void {
 
 fn private_window_events(e: *webui.Event) void {
     if (e.event_type == .EVENT_CONNECTED) {
+
+        // get the public window URL and port
+        const public_win_port = public_window.getPort() catch unreachable;
         const public_win_url: [:0]const u8 = public_window.getUrl() catch return;
+
         var buf = std.mem.zeroes([1024]u8);
-        const js = std.fmt.bufPrintZ(&buf, "document.getElementById('urlSpan').innerHTML = '{s}';", .{public_win_url}) catch unreachable;
-        private_window.run(js);
+        const js_1 = std.fmt.bufPrintZ(&buf, "document.getElementById('urlSpan1').innerHTML = 'http://localhost:{}';", .{public_win_port}) catch unreachable;
+        private_window.run(js_1);
+        const js_2 = std.fmt.bufPrintZ(&buf, "document.getElementById('urlSpan2').innerHTML = '{s}';", .{public_win_url}) catch unreachable;
+        private_window.run(js_2);
     }
 }
 
 pub fn main() !void {
     // Create windows
     private_window = webui.newWindow();
-    public_window =  webui.newWindow();
+    public_window = webui.newWindow();
 
     // App
     webui.setTimeout(0); // Wait forever (never timeout)
@@ -48,6 +54,8 @@ pub fn main() !void {
     // Bind all events
     _ = try public_window.bind("", public_window_events);
 
+    _ = try public_window.setPort(9090); // Set port for public access
+
     // Set public window HTML
     try public_window.showBrowser(public_html, .NoBrowser);
 
diff --git a/examples/public_network_access/private.html b/examples/public_network_access/private.html
@@ -2,7 +2,7 @@
 <html>
   <head>
     <meta charset="UTF-8" />
-    <script src="/webui.js"></script>
+    <script src="webui.js"></script>
     <title>Public Network Access Example</title>
     <style>
       body {
@@ -42,13 +42,14 @@
   <body>
     <h1>WebUI - Public Network Access Example</h1>
     <br />
-    The second public window is configured to be accessible from <br />
-    any device in the public network. <br />
+    The public window is configured to be accessible from <br>
+    any device in the network. <br>
     <br />
-    Second public window link: <br />
-    <h1 id="urlSpan" style="color: #c9913d">...</h1>
-    Second public window events: <br />
-    <textarea id="Logs" rows="4" cols="50" style="width: 80%"></textarea>
+    Public window links: <br>
+    <h1 id="urlSpan1" style="color:#c9913d">...</h1>
+    <h1 id="urlSpan2" style="color:#c9913d">...</h1>
+    Public window events: <br>
+    <textarea id="Logs" rows="4" cols="50" style="width:60%"></textarea>
     <br />
     <button id="Exit">Exit</button>
   </body>
diff --git a/examples/public_network_access/public.html b/examples/public_network_access/public.html
@@ -2,7 +2,7 @@
 <html>
   <head>
     <meta charset="UTF-8" />
-    <script src="/webui.js"></script>
+    <script src="webui.js"></script>
     <title>Welcome to Public UI</title>
   </head>
   <body>
