updated and connected webview to C#

2026-03-28 05:18:05 -04:00
parent a5772d7579
commit 0bb3aa28b1
8 changed files with 411 additions and 21 deletions
--- a/RelayClient/Resources/Raw/wwwroot/index.css
+++ b/RelayClient/Resources/Raw/wwwroot/index.css
--- a/RelayClient/Resources/Raw/wwwroot/index.html
+++ b/RelayClient/Resources/Raw/wwwroot/index.html
@@ -0,0 +1,124 @@
+<!DOCTYPE html>
+
+<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
+<head>
+    <meta charset="utf-8" />
+    <title></title>
+    <link rel="icon" href="data:,">
+    <link rel="stylesheet" href="styles/app.css">
+    <link rel="stylesheet" href="index.css">
+    <script src="_framework/hybridwebview.js"></script>
+    <script>
+        function LogMessage(msg) {
+            var messageLog = document.getElementById("messageLog");
+            messageLog.value += '\r\n' + msg;
+        }
+
+        window.addEventListener(
+            "HybridWebViewMessageReceived",
+            function (e) {
+                LogMessage("Raw message: " + e.detail.message);
+            });
+
+        function AddNumbers(a, b) {
+            var result = {
+                "result": a + b,
+                "operationName": "Addition"
+            };
+            return result;
+        }
+
+        var count = 0;
+
+        async function EvaluateMeWithParamsAndAsyncReturn(s1, s2) {
+            const response = await fetch("/asyncdata.txt");
+            if (!response.ok) {
+                throw new Error(`HTTP error: ${response.status}`);
+            }
+            var jsonData = await response.json();
+
+            jsonData[s1] = s2;
+
+            const msg = 'JSON data is available: ' + JSON.stringify(jsonData);
+            window.HybridWebView.SendRawMessage(msg)
+
+            return jsonData;
+        }
+
+        async function InvokeDoSyncWork() {
+            LogMessage("Invoking DoSyncWork");
+            await window.HybridWebView.InvokeDotNet('DoSyncWork');
+            LogMessage("Invoked DoSyncWork");
+        }
+
+        async function InvokeDoSyncWorkParams() {
+            LogMessage("Invoking DoSyncWorkParams");
+            await window.HybridWebView.InvokeDotNet('DoSyncWorkParams', [123, 'hello']);
+            LogMessage("Invoked DoSyncWorkParams");
+        }
+
+        async function InvokeDoSyncWorkReturn() {
+            LogMessage("Invoking DoSyncWorkReturn");
+            const retValue = await window.HybridWebView.InvokeDotNet('DoSyncWorkReturn');
+            LogMessage("Invoked DoSyncWorkReturn, return value: " + retValue);
+        }
+
+        async function InvokeDoSyncWorkParamsReturn() {
+            LogMessage("Invoking DoSyncWorkParamsReturn");
+            const retValue = await window.HybridWebView.InvokeDotNet('DoSyncWorkParamsReturn', [123, 'hello']);
+            LogMessage("Invoked DoSyncWorkParamsReturn, return value: message=" + retValue.Message + ", value=" + retValue.Value);
+        }
+
+        async function InvokeDoAsyncWork() {
+            LogMessage("Invoking DoAsyncWork");
+            await window.HybridWebView.InvokeDotNet('DoAsyncWork');
+            LogMessage("Invoked DoAsyncWork");
+        }
+
+        async function InvokeDoAsyncWorkParams() {
+            LogMessage("Invoking DoAsyncWorkParams");
+            await window.HybridWebView.InvokeDotNet('DoAsyncWorkParams', [123, 'hello']);
+            LogMessage("Invoked DoAsyncWorkParams");
+        }
+
+        async function InvokeDoAsyncWorkReturn() {
+            LogMessage("Invoking DoAsyncWorkReturn");
+            const retValue = await window.HybridWebView.InvokeDotNet('DoAsyncWorkReturn');
+            LogMessage("Invoked DoAsyncWorkReturn, return value: " + retValue);
+        }
+
+        async function InvokeDoAsyncWorkParamsReturn() {
+            LogMessage("Invoking DoAsyncWorkParamsReturn");
+            const retValue = await window.HybridWebView.InvokeDotNet('DoAsyncWorkParamsReturn', [123, 'hello']);
+            LogMessage("Invoked DoAsyncWorkParamsReturn, return value: message=" + retValue.Message + ", value=" + retValue.Value);
+        }
+
+    </script>
+</head>
+<body>
+<div>
+    Hybrid sample!
+</div>
+<div>
+    <button onclick="window.HybridWebView.SendRawMessage('Message from JS! ' + (count++))">Send message to C#</button>
+</div>
+<div>
+    <button onclick="InvokeDoSyncWork()">Call C# sync method (no params)</button>
+    <button onclick="InvokeDoSyncWorkParams()">Call C# sync method (params)</button>
+    <button onclick="InvokeDoSyncWorkReturn()">Call C# method (no params) and get simple return value</button>
+    <button onclick="InvokeDoSyncWorkParamsReturn()">Call C# method (params) and get complex return value</button>
+</div>
+<div>
+    <button onclick="InvokeDoAsyncWork()">Call C# async method (no params)</button>
+    <button onclick="InvokeDoAsyncWorkParams()">Call C# async method (params)</button>
+    <button onclick="InvokeDoAsyncWorkReturn()">Call C# async method (no params) and get simple return value</button>
+    <button onclick="InvokeDoAsyncWorkParamsReturn()">Call C# async method (params) and get complex return value</button>
+</div>
+<div>
+    Log: <textarea readonly id="messageLog" style="width: 80%; height: 10em;"></textarea>
+</div>
+<div>
+    Consider checking out this PDF: <a href="docs/sample.pdf">sample.pdf</a>
+</div>
+</body>
+</html>