Use transparent pixel as placeholder

This commit is contained in:
Weitheng Haw 2025-01-28 10:22:46 +00:00
parent 8c197cbcbc
commit d65869e2ab

View File

@ -133,9 +133,16 @@ export default function FaceLibrary() {
setIsCreatingFace(true); setIsCreatingFace(true);
try { try {
// Create a 1x1 transparent WebP image
const canvas = document.createElement('canvas');
canvas.width = 1;
canvas.height = 1;
const blob = await new Promise<Blob>((resolve) =>
canvas.toBlob((b) => resolve(b!), 'image/webp')
);
const formData = new FormData(); const formData = new FormData();
const emptyBlob = new Blob([], { type: 'image/webp' }); formData.append('file', blob, 'placeholder.webp');
formData.append('file', emptyBlob, 'empty.webp');
const resp = await axios.post(`/faces/${newFaceName}`, formData, { const resp = await axios.post(`/faces/${newFaceName}`, formData, {
headers: { headers: {
@ -172,9 +179,16 @@ export default function FaceLibrary() {
setIsRenaming(true); setIsRenaming(true);
try { try {
// Create a 1x1 transparent WebP image for the new face directory
const canvas = document.createElement('canvas');
canvas.width = 1;
canvas.height = 1;
const blob = await new Promise<Blob>((resolve) =>
canvas.toBlob((b) => resolve(b!), 'image/webp')
);
const formData = new FormData(); const formData = new FormData();
const emptyBlob = new Blob([], { type: 'image/webp' }); formData.append('file', blob, 'placeholder.webp');
formData.append('file', emptyBlob, 'empty.webp');
await axios.post(`/faces/${renameData.newName}`, formData); await axios.post(`/faces/${renameData.newName}`, formData);
const oldFaceImages = faceData[renameData.oldName] || []; const oldFaceImages = faceData[renameData.oldName] || [];