From 23d621e6f418664b3a7a1380486d4c66bca6080c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Olivier=20Potonni=C3=A9e?= Date: Sat, 17 Feb 2024 12:47:15 +0100 Subject: [PATCH] Add web explorer --- explorer/css/aaguids-explorer.css | 127 ++++++++++++++++++++++++++++++ explorer/img/favicon.ico | Bin 0 -> 15086 bytes explorer/img/github-mark.svg | 1 + explorer/index.html | 37 +++++++++ explorer/js/aaguids-explorer.js | 97 +++++++++++++++++++++++ 5 files changed, 262 insertions(+) create mode 100644 explorer/css/aaguids-explorer.css create mode 100644 explorer/img/favicon.ico create mode 100644 explorer/img/github-mark.svg create mode 100644 explorer/index.html create mode 100644 explorer/js/aaguids-explorer.js diff --git a/explorer/css/aaguids-explorer.css b/explorer/css/aaguids-explorer.css new file mode 100644 index 0000000..f1663f3 --- /dev/null +++ b/explorer/css/aaguids-explorer.css @@ -0,0 +1,127 @@ +html, +body { + margin: 0; +} + +body { + margin: 0; + padding: 15px; + font-family: sans-serif; + background-color: whitesmoke; +} + +h1 { + font-weight: bold; + text-overflow: ellipsis; + vertical-align: middle; + width: 100%; + margin: -15px 0 15px -15px; + padding: 15px; + background-color: lightsteelblue; + border-bottom: 1px solid black; + box-shadow: 0 2px 2px 1px #888; +} + + +h2 { + width: 100%; + margin: 10px 0 10px -15px; + padding: 5px; + background-color: lightgray; + border-bottom: 1px solid black; + border-top: 1px solid rgb(186, 186, 186); + box-shadow: 0 2px 2px 1px #888; +} + +/* for 480px or less */ +@media screen and (max-width: 480px) { + h1 { + font-size: 24px; + } + + h2 { + font-size: 18px; + } +} + +pre { + white-space: pre-wrap; + /* css-3 */ + white-space: -moz-pre-wrap; + /* Mozilla, since 1999 */ + white-space: -pre-wrap; + /* Opera 4-6 */ + white-space: -o-pre-wrap; + /* Opera 7 */ + word-wrap: break-word; + /* Internet Explorer 5.5+ */ +} + +#about { + float: right; +} + +#about img { + max-width: 32px; +} + +#main, +#loading-error { + display: none; + margin: 10px; +} + +#aaguids { + border-collapse: collapse; +} + +#aaguids td, +#aaguids th { + border: black 1px solid; + padding: 10px; + vertical-align: top; +} + +a { + color: cadetblue; + text-decoration: none; +} + +#aaguids td.icon { + text-align: center; +} + +#aaguids img { + max-width: 100px; + max-width: 50; +} + +#aaguids td.dark, +#aaguids th.dark { + background-color: #555; + color: white; +} + +#aaguids th { + background-color: #DDD; +} + +#aaguids th:last-of-type { + background-color: #333; +} + +#aaguids th:nth-of-type(1) { + min-width: 19em; +} +#aaguids th:nth-of-type(2) { + min-width: 20em; +} +#filter { + width: 80%; +} +footer { + color: grey; + font-size: 80%; + text-align: left; + margin-top: 10px; +} \ No newline at end of file diff --git a/explorer/img/favicon.ico b/explorer/img/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..0a29c54009d72e45ed904881b0a6540ad2187232 GIT binary patch literal 15086 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 \ No newline at end of file diff --git a/explorer/index.html b/explorer/index.html new file mode 100644 index 0000000..a20b40b --- /dev/null +++ b/explorer/index.html @@ -0,0 +1,37 @@ + + + + + + Passkey AAGUIDs Explorer + + + + + +

+ Passkey AAGUIDs Explorer + + + + + +

+ +
Loading...
+
+

Error

+ Failed to load the AAGUIDs data :( +
+ +
+
+ +
+
+ +
+ This is a community-driven list of known passkey provider AAGUIDs to assist with naming passkeys in end user passkey management interfaces (e.g. account settings). It is not intended to be used for any other purpose and could go away at any time.
+ This does not replace FIDO's Metadata Service (MDS), which should continue to be used for all authoritative security details about FIDO authenticators. Some AAGUIDs in this list may not appear in FIDO MDS. +
+ diff --git a/explorer/js/aaguids-explorer.js b/explorer/js/aaguids-explorer.js new file mode 100644 index 0000000..b542962 --- /dev/null +++ b/explorer/js/aaguids-explorer.js @@ -0,0 +1,97 @@ +'use strict'; + +function imageTag(src) { + return src ? "" : ""; +} + +function $(query) { + return document.querySelector(query); +} + +function $toggle(query, show) { + return $(query).style.display = (show ? 'block' : 'none'); +} + +function $$(query) { + return document.querySelectorAll(query); +} + +function appendRow(table, html) { + const row = document.createElement("tr"); + row.innerHTML = html; + table.appendChild(row); +} + +document.onreadystatechange = async () => { + if (document.readyState == "complete") { + + try { + let file, switchJsonUrl, switchJsonText; + if (location.search === "?combined") { + file = "combined_aaguid.json"; + switchJsonUrl = "."; + switchJsonText = "Exclude MDS authenticators" + } else { + file = "aaguid.json"; + switchJsonUrl = "./?combined"; + switchJsonText = "Include MDS authenticators" + } + $("#switch-json").setAttribute("href", switchJsonUrl); + $("#switch-json").innerText = switchJsonText; + + const response = await fetch("../" + file); + + const json = await response.json(); + + $toggle("#loading", false); + $toggle("#main", true); + const table = $("#aaguids"); + appendRow(table, ` + + AAGUID
+ Name
+ + X + + Icon light + Icon dark + + `); + + for (const aaguid in json) { + if (Object.hasOwnProperty.call(json, aaguid)) { + appendRow(table, ` + + ${aaguid} + ${json[aaguid].name} + ${imageTag(json[aaguid].icon_light)} + ${imageTag(json[aaguid].icon_dark)} + + `); + } + } + + function applyFilter(filter) { + $$("#aaguids tr").forEach( (row) => { + const name = row.querySelector("td.name")?.innerText?.toLowerCase(); + const show = !filter || (!name || name.indexOf(filter.toLowerCase()) >= 0); + row.style.display = (show ? 'table-row' : 'none'); + }); + } + + $("#filter").addEventListener("keyup", () => { + applyFilter($("#filter").value); + }); + + $("#clear-filter").addEventListener("click", (event) => { + $("#filter").value = ""; + applyFilter(); + event.preventDefault(); + }); + + } catch (err) { + $toggle("#loading-error", true); + console.error(err); + } + } +}