Optimized profile picture sizes

This commit is contained in:
Mia Rose Winter 2024-02-03 21:07:15 +01:00
parent 5d60c39443
commit 6246362fb5
Signed by: miawinter
GPG key ID: 4B6F6A83178F595E
4 changed files with 20 additions and 6 deletions

View file

@ -45,7 +45,7 @@
<NavLink href="Account/Manage"> <NavLink href="Account/Manage">
<span class="line-clamp-2">@context.User.FindFirst("FullName")!.Value</span> <span class="line-clamp-2">@context.User.FindFirst("FullName")!.Value</span>
<div class="w-8"> <div class="w-8">
<ProfilePictureComponent ProfileId="@context.User.FindFirst("Id")!.Value" /> <ProfilePictureComponent Size="100" ProfileId="@context.User.FindFirst("Id")!.Value" />
</div> </div>
</NavLink> </NavLink>
</li> </li>

View file

@ -1,6 +1,6 @@
<div class="avatar"> <div class="avatar">
<div class="rounded"> <div class="rounded">
<img src="/api/user/pfp/@ProfileId" alt="" loading="lazy" <img src="/api/user/pfp/@ProfileId?size=@Size" alt="" loading="lazy"
onerror="this.remove()" /> onerror="this.remove()" />
</div> </div>
</div> </div>
@ -8,4 +8,7 @@
@code { @code {
[Parameter] [Parameter]
public string ProfileId { get; set; } = string.Empty; public string ProfileId { get; set; } = string.Empty;
[Parameter]
public int Size { get; set; } = 800;
} }

View file

@ -2,7 +2,7 @@
<div class="rounded bg-base-200 text-base-content flex content-center w-full sm:w-56"> <div class="rounded bg-base-200 text-base-content flex content-center w-full sm:w-56">
<div class="w-16 h-16"> <div class="w-16 h-16">
<ProfilePictureComponent ProfileId="@Profile.Id" /> <ProfilePictureComponent Size="200" ProfileId="@Profile.Id" />
</div> </div>
<div class="flex flex-col p-2"> <div class="flex flex-col p-2">

View file

@ -1,4 +1,5 @@
using Microsoft.AspNetCore.Identity; using ImageMagick;
using Microsoft.AspNetCore.Identity;
using Microsoft.AspNetCore.Mvc; using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.OutputCaching; using Microsoft.AspNetCore.OutputCaching;
using Microsoft.EntityFrameworkCore; using Microsoft.EntityFrameworkCore;
@ -17,7 +18,8 @@ public class UserController(ImageService imageService, IDbContextFactory<Applica
[OutputCache(Duration = 60*5)] [OutputCache(Duration = 60*5)]
[ResponseCache(Duration = 60*5, Location = ResponseCacheLocation.Any)] [ResponseCache(Duration = 60*5, Location = ResponseCacheLocation.Any)]
[Route("pfp/{userId}")] [Route("pfp/{userId}")]
public async Task<IActionResult> Get(string userId) { public async Task<IActionResult> Get(string userId, [FromQuery] int size = 800) {
if (size > 800) size = 800;
await using var context = await ContextFactory.CreateDbContextAsync(); await using var context = await ContextFactory.CreateDbContextAsync();
var user = await context.Users.Include(u => u.ProfilePicture).FirstOrDefaultAsync(u => u.Id == userId); var user = await context.Users.Include(u => u.ProfilePicture).FirstOrDefaultAsync(u => u.Id == userId);
if (user is null) return NotFound(); if (user is null) return NotFound();
@ -27,7 +29,16 @@ public class UserController(ImageService imageService, IDbContextFactory<Applica
string? path = ImageService.GetPath(user.ProfilePicture.ImageId); string? path = ImageService.GetPath(user.ProfilePicture.ImageId);
if (path is null) return NotFound(); if (path is null) return NotFound();
if (size < 800) {
var image = new MagickImage(path);
image.Resize(new MagickGeometry(size));
using var memory = new MemoryStream();
await image.WriteAsync(memory);
return File(memory.GetBuffer(), ImageService.ImageMimeType);
}
return File(System.IO.File.OpenRead(path), ImageService.ImageMimeType); return File(System.IO.File.OpenRead(path), ImageService.ImageMimeType);
} }