Add cropping support when modifying the user/org/repo avatar (#33498)

Fixed #33321

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
Kerwin Bryant 2025-02-06 21:07:44 +08:00 committed by GitHub
parent 943cc4f989
commit 40426addfa
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
11 changed files with 35 additions and 28 deletions

View file

@ -6,7 +6,7 @@ type CropperOpts = {
fileInput: HTMLInputElement,
}
export async function initCompCropper({container, fileInput, imageSource}: CropperOpts) {
async function initCompCropper({container, fileInput, imageSource}: CropperOpts) {
const {default: Cropper} = await import(/* webpackChunkName: "cropperjs" */'cropperjs');
let currentFileName = '';
let currentFileLastModified = 0;
@ -38,3 +38,10 @@ export async function initCompCropper({container, fileInput, imageSource}: Cropp
}
});
}
export async function initAvatarUploaderWithCropper(fileInput: HTMLInputElement) {
const panel = fileInput.nextElementSibling as HTMLElement;
if (!panel?.matches('.cropper-panel')) throw new Error('Missing cropper panel for avatar uploader');
const imageSource = panel.querySelector<HTMLImageElement>('.cropper-source');
await initCompCropper({container: panel, fileInput, imageSource});
}