feat: add EncryptID passkey login to frontend templates
Add SDK browser bundle to base template and shared space login page. Passkey auth alongside existing password form. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
629e61de0a
commit
0f76ae63a4
|
|
@ -135,6 +135,7 @@
|
|||
<a href="{% url 'portal:upload' %}" class="{% if request.resolver_match.url_name == 'upload' %}active{% endif %}">Upload</a>
|
||||
<a href="{% url 'portal:files' %}" class="{% if request.resolver_match.url_name == 'files' %}active{% endif %}">Files</a>
|
||||
<a href="/admin/" target="_blank">Admin</a>
|
||||
<span id="encryptid-auth" style="display:inline-block;margin-left:1rem;"></span>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
|
|
@ -143,6 +144,15 @@
|
|||
|
||||
{% block extra_js %}{% endblock %}
|
||||
|
||||
{% load static %}
|
||||
<script src="{% static 'portal/encryptid.browser.js' %}"></script>
|
||||
<script>
|
||||
// Initialize EncryptID auth button in nav
|
||||
if (typeof EncryptID !== 'undefined') {
|
||||
EncryptID.renderAuthButton('encryptid-auth');
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
if ('serviceWorker' in navigator) {
|
||||
navigator.serviceWorker.register('/sw.js', { scope: '/' })
|
||||
|
|
|
|||
|
|
@ -167,11 +167,23 @@
|
|||
<div class="error-message">{{ error }}</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- EncryptID passkey auth -->
|
||||
<div id="encryptid-auth" style="margin-bottom:1.5rem;"></div>
|
||||
|
||||
<div style="position:relative;margin-bottom:1.5rem;">
|
||||
<div style="position:absolute;inset:0;display:flex;align-items:center;">
|
||||
<span style="width:100%;border-top:1px solid var(--border);"></span>
|
||||
</div>
|
||||
<div style="position:relative;display:flex;justify-content:center;">
|
||||
<span style="background:var(--surface);padding:0 0.75rem;color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;">Or enter with password</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form method="post">
|
||||
{% csrf_token %}
|
||||
<div class="form-group">
|
||||
<label for="password">Password</label>
|
||||
<input type="password" id="password" name="password" placeholder="Enter ZOME password" required autofocus>
|
||||
<input type="password" id="password" name="password" placeholder="Enter ZOME password" required>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Enter ZOME</button>
|
||||
</form>
|
||||
|
|
@ -181,5 +193,19 @@
|
|||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% load static %}
|
||||
<script src="{% static 'portal/encryptid.browser.js' %}"></script>
|
||||
<script>
|
||||
if (typeof EncryptID !== 'undefined') {
|
||||
EncryptID.renderAuthButton('encryptid-auth');
|
||||
|
||||
// After passkey auth, set cookie and reload to get access
|
||||
document.getElementById('encryptid-auth').addEventListener('encryptid-login', function(e) {
|
||||
document.cookie = 'encryptid_token=' + e.detail.token + ';path=/;max-age=900;SameSite=Lax';
|
||||
window.location.reload();
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in New Issue