tabbing and click events for enter and spacebar

This commit is contained in:
trinkey 2024-03-01 07:20:31 -05:00 committed by GitHub
parent 67683868cf
commit 1eb08692e2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -22,28 +22,37 @@
<body>
<h1>Welcome, {{DISPL_NAME}}!</h1>
<div onclick="window.location.href = '/editor'" class="home-container">
<div tabindex="1" onclick="window.location.href = '/editor'" class="home-container">
<p>Edit your profile</p>
{{DISPL_NAME}} (@{{USERNAME}})<br>
</div>
<br>
<div onclick="toggleVisibility()" class="home-container">
<div tabindex="2" onclick="toggleVisibility()" class="home-container">
<p>Toggle visibility</p>
Visibility: <span id="public-thing"></span>Public
</div>
<br>
<div onclick="window.location.href = '/browse'" class="home-container">
<div tabindex="3" onclick="window.location.href = '/browse'" class="home-container">
<p>Browse other profiles</p>
Total public profiles: <span id="total">{{TOTAL}}</span>
</div>
<br>
<div onclick="window.location.href = '/u/{{USERNAME}}'" class="home-container">
<div tabindex="4" onclick="window.location.href = '/u/{{USERNAME}}'" class="home-container">
<p>Preview your profile</p>
Shortened url:<br>
https://infopg.web.app/u/{{USERNAME}}
</div>
<script>
[...document.querySelectorAll("[onclick][tabindex]")].forEach(function(val, index) {
val.addEventListener("keyup", function(event) {
event.preventDefault();
if (event.keyCode === 13 || event.keyCode === 32) {
val.click();
}
});
})
dom("public-thing").innerText = public ? "" : "Not "
function toggleVisibility() {
@ -60,4 +69,4 @@
}
</script>
</body>
</html>
</html>