Files
mpc-hello/client-server/index.html
2025-01-31 14:45:53 +00:00

60 lines
1.9 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>MPC Hello (client-server)</title>
<link rel="stylesheet" href="src/styles.css" />
</head>
<body>
<div class="app">
<div class="header">MPC Hello</div>
<div class="step-container">
<div id="step-1" class="step">
<div style="text-align: left">
Welcome to the hello-world of MPC (<a
href="https://github.com/cedoor/mpc-hello-client-server"
>view source</a
>).
</div>
<div style="text-align: left; margin-top: 1em">
In this app you'll make a MPC computation with a server connected
with WebSocket.
</div>
<div style="text-align: left; margin-top: 1em">
Once connected, both parties will enter a number. Each party will
only be informed whether their number is the largest or not, but
both numbers are kept cryptographically secret.
</div>
<div style="text-align: left; margin-top: 1em">
This is just a simple example, but mpc-framework makes it easy to do
this with any function.
</div>
<div style="text-align: left; margin-top: 1em">
<label for="number-input">Enter your number:</label>
<input type="number" id="number-input" />
</div>
<div>
<button id="submit-number-btn">Submit</button>
</div>
</div>
<div id="step-2" class="step hidden">
<p>Waiting...</p>
<div class="spinner-container">
<div class="spinner"></div>
</div>
</div>
<div id="step-3" class="step hidden">
<h2><span id="result-value"></span></h2>
</div>
</div>
</div>
<script type="module" src="src/main.ts"></script>
</body>
</html>