github-mirrors/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2026-03-22 11:19:37 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix(web): show the correct cursor at crop bounds when editing an asset (#26748)

Browse Source
This commit is contained in:
Snowknight26
2026-03-09 13:39:01 -05:00
committed by GitHub
parent a47b232235
commit 4791d9c0c3
2 changed files with 41 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
web/src/lib/components/asset-viewer/editor/transform-tool/crop-area.spec.ts
View File

@@ -36,4 +36,44 @@ describe('CropArea', () => {
expect(document.body.style.cursor).toBe(''); expect(document.body.style.cursor).toBe('');
expect(cropArea.style.cursor).toBe(''); expect(cropArea.style.cursor).toBe('');
}); });
it('sets cursor style at x: $x, y: $y to be $cursor', () => {
const data = [
{ x: 299, y: 84, cursor: '' },
{ x: 299, y: 85, cursor: 'nesw-resize' },
{ x: 299, y: 115, cursor: 'nesw-resize' },
{ x: 299, y: 116, cursor: 'ew-resize' },
{ x: 299, y: 284, cursor: 'ew-resize' },
{ x: 299, y: 285, cursor: 'nwse-resize' },
{ x: 299, y: 300, cursor: 'nwse-resize' },
{ x: 299, y: 301, cursor: '' },
{ x: 300, y: 84, cursor: '' },
{ x: 300, y: 85, cursor: 'nesw-resize' },
{ x: 300, y: 86, cursor: 'nesw-resize' },
{ x: 300, y: 114, cursor: 'nesw-resize' },
{ x: 300, y: 115, cursor: 'nesw-resize' },
{ x: 300, y: 116, cursor: 'ew-resize' },
{ x: 300, y: 284, cursor: 'ew-resize' },
{ x: 300, y: 285, cursor: 'nwse-resize' },
{ x: 300, y: 286, cursor: 'nwse-resize' },
{ x: 300, y: 300, cursor: 'nwse-resize' },
{ x: 300, y: 301, cursor: '' },
{ x: 301, y: 300, cursor: '' },
{ x: 301, y: 301, cursor: '' },
];
const element = document.createElement('div');
for (const { x, y, cursor } of data) {
const message = `x: ${x}, y: ${y} - ${cursor}`;
transformManager.reset();
transformManager.region = { x: 100, y: 100, width: 200, height: 200 };
transformManager.cropImageSize = { width: 600, height: 600 };
transformManager.cropAreaEl = element;
transformManager.cropImageScale = 0.5;
transformManager.updateCursor(x, y);
expect(element.style.cursor, message).toBe(cursor);
expect(document.body.style.cursor, message).toBe(cursor);
}
});
}); });

2
web/src/lib/managers/edit/transform-manager.svelte.ts
View File

@@ -677,7 +677,7 @@ class TransformManager implements EditToolManager {
const { x, y, width, height } = this.region; const { x, y, width, height } = this.region;
const sensitivity = 10; const sensitivity = 10;
const cornerSensitivity = 15; const cornerSensitivity = 15;
const { width: imgWidth, height: imgHeight } = this.cropImageSize; const { width: imgWidth, height: imgHeight } = this.previewImageSize;
const outOfBound = mouseX > imgWidth || mouseY > imgHeight || mouseX < 0 || mouseY < 0; const outOfBound = mouseX > imgWidth || mouseY > imgHeight || mouseX < 0 || mouseY < 0;
if (outOfBound) { if (outOfBound) {