diff --git a/frontend/identities.html b/frontend/identities.html
index ac0a887..ba611e1 100755
--- a/frontend/identities.html
+++ b/frontend/identities.html
@@ -153,14 +153,21 @@ function getIdentities(id) {
div.textContent = "Related faces " + identity.relatedFaces.length;
block.appendChild(div);
- const random = Math.floor(Math.random() * identity.relatedFaces.length);
- const facePhoto = createFace(identity.relatedFaces[random].faceId, identity.relatedFaces[random].photoId);
- const distance = document.createElement("div");
- distance.classList.add("distance");
- distance.textContent = Math.round(100 * identity.relatedFaces[random].distance) / 100;
- facePhoto.appendChild(distance);
- block.appendChild(facePhoto);
+ identity.relatedFaces.sort((a, b) => {
+ return a.distance - b.distance;
+ });
+ div = document.createElement("div");
+ div.classList.add("face-block");
+ for (let i = 0; i < identity.relatedFaces.length && i < 4; i++) {
+ const facePhoto = createFace(identity.relatedFaces[i].faceId, identity.relatedFaces[i].photoId),
+ distance = document.createElement("div");
+ distance.classList.add("distance");
+ distance.textContent = identity.relatedFaces[i].distance.toFixed(2);
+ facePhoto.appendChild(distance);
+ div.appendChild(facePhoto);
+ }
+ block.appendChild(div);
identitiesBlock.appendChild(block);
});
});
@@ -222,6 +229,10 @@ body {
padding: 0;
}
+* {
+ box-sizing: border-box;
+}
+
.more {
cursor: pointer;
}
@@ -249,6 +260,22 @@ body {
filter: grayscale(100%);
}
+.face-block {
+ display: flex;
+ flex-wrap: wrap;
+ margin: 0.5em;
+ min-width: 128px;
+ max-width: 128px;
+ min-height: 128px;
+ max-height: 128px;
+}
+
+.face-block .face {
+ max-width: 64px;
+ max-height: 64px;
+ margin: 0;
+}
+
.face {
position: relative;
max-width: 128px;
@@ -270,11 +297,13 @@ body {
.face .distance {
position: absolute;
background: black;
- opacity: 0.8;
+ opacity: 0.5;
text-align: center;
left: 0;
right: 0;
bottom: 0;
+ color: white;
+ box-sizing: border-box;
}
.editor-row {
diff --git a/server/routes/identities.js b/server/routes/identities.js
index bdcb7f9..5b111b8 100755
--- a/server/routes/identities.js
+++ b/server/routes/identities.js
@@ -169,6 +169,8 @@ router.get("/:id?", (req, res) => {
return;
}
+ /* For each face's descriptor returned for this identity, compute the distance between the
+ * requested photo and that face descriptor */
descriptors.forEach((descriptor) => {
for (let i = 0; i < identity.relatedFaces.length; i++) {
if (identity.relatedFaces[i].faceId == descriptor.faceId) {
@@ -179,6 +181,8 @@ router.get("/:id?", (req, res) => {
}
});
});
+ }, {
+ maxConcurrency: 5
}).then(() => {
return identities;
});