27 lines
1.3 KiB
HTML
27 lines
1.3 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Signature verification demo</title>
|
|
<style>
|
|
body { font: 16px system-ui, sans-serif; margin: 2rem auto; max-width: 52rem; padding: 0 1rem; }
|
|
canvas { border: 1px solid #777; border-radius: .4rem; display: block; touch-action: none; width: 100%; }
|
|
button, input { font: inherit; margin: .5rem .4rem .5rem 0; padding: .45rem .7rem; }
|
|
#status { min-height: 1.5em; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Signature verification demo</h1>
|
|
<p>Use a study participant ID (not a real name). Draw a signature, then enroll
|
|
several genuine samples or verify against the enrolled templates.</p>
|
|
<label for="user-id">Participant ID</label>
|
|
<input id="user-id" autocomplete="off" maxlength="200" required>
|
|
<canvas id="pad" width="900" height="320" aria-label="Signature drawing area"></canvas>
|
|
<button id="clear" type="button">Clear</button>
|
|
<button id="enroll" type="button">Enroll this sample</button>
|
|
<button id="verify" type="button">Verify this sample</button>
|
|
<p id="status" role="status" aria-live="polite"></p>
|
|
<script src="/static/capture.js"></script>
|
|
</body>
|
|
</html> |