2728 bug signed rotated document different than preview ()

# Description of Changes

Please provide a summary of the changes, including:

- Change the maths for accounting for rotation in add image and sign.
- Images are now placed in the expected place


Closes  

---

## Checklist

### General

- [x] I have read the [Contribution
Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md)
- [x] I have read the [Stirling-PDF Developer
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/DeveloperGuide.md)
(if applicable)
- [x] I have read the [How to add new languages to
Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/HowToAddNewLanguage.md)
(if applicable)
- [x] I have performed a self-review of my own code
- [x] My changes generate no new warnings

### Documentation

- [ ] I have updated relevant docs on [Stirling-PDF's doc
repo](https://github.com/Stirling-Tools/Stirling-Tools.github.io/blob/main/docs/)
(if functionality has heavily changed)
- [ ] I have read the section [Add New Translation
Tags](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/HowToAddNewLanguage.md#add-new-translation-tags)
(for new translation tags only)

### UI Changes (if applicable)

- [ ] Screenshots or videos demonstrating the UI changes are attached
(e.g., as comments or direct attachments in the PR)

### Testing (if applicable)

- [ ] I have tested my changes locally. Refer to the [Testing
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/DeveloperGuide.md#6-testing)
for more details.
This commit is contained in:
ConnorYoh 2025-04-16 16:21:08 +01:00 committed by GitHub
parent a1013a339a
commit 3fda82e39d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 36 additions and 33 deletions
src/main/resources/static/js

@ -544,21 +544,17 @@ const DraggableUtils = {
angle: rotateAngle, // Store rotation angle: rotateAngle, // Store rotation
}; };
// Auxiliary variables const pageRotation = page.getRotation();
let widthAdjusted = page.getWidth();
let heightAdjusted = page.getHeight();
const rotation = page.getRotation();
// Normalize page rotation angle // Normalize page rotation angle
let normalizedAngle = rotation.angle % 360; let normalizedAngle = pageRotation.angle % 360;
if (normalizedAngle < 0) { if (normalizedAngle < 0) {
normalizedAngle += 360; normalizedAngle += 360;
} }
// Adjust page dimensions for rotated pages // Determine the viewed page dimensions based on the normalized rotation angle
if (normalizedAngle === 90 || normalizedAngle === 270) { let viewedPageWidth = (normalizedAngle === 90 || normalizedAngle === 270) ? page.getHeight() : page.getWidth();
[widthAdjusted, heightAdjusted] = [heightAdjusted, widthAdjusted]; let viewedPageHeight = (normalizedAngle === 90 || normalizedAngle === 270) ? page.getWidth() : page.getHeight();
}
const draggablePositionRelative = { const draggablePositionRelative = {
x: draggablePositionPixels.x / offsetWidth, x: draggablePositionPixels.x / offsetWidth,
@ -569,51 +565,58 @@ const DraggableUtils = {
}; };
const draggablePositionPdf = { const draggablePositionPdf = {
x: draggablePositionRelative.x * widthAdjusted, x: draggablePositionRelative.x * viewedPageWidth,
y: draggablePositionRelative.y * heightAdjusted, y: draggablePositionRelative.y * viewedPageHeight,
width: draggablePositionRelative.width * widthAdjusted, width: draggablePositionRelative.width * viewedPageWidth,
height: draggablePositionRelative.height * heightAdjusted, height: draggablePositionRelative.height * viewedPageHeight,
}; };
// Calculate position based on normalized page rotation // Calculate position based on normalized page rotation
let x = draggablePositionPdf.x; let x = draggablePositionPdf.x;
let y = heightAdjusted - draggablePositionPdf.y - draggablePositionPdf.height; let y = viewedPageHeight - draggablePositionPdf.y - draggablePositionPdf.height;
let originx = x + draggablePositionPdf.width / 2;
let originy = heightAdjusted - draggablePositionPdf.y - draggablePositionPdf.height / 2;
if (normalizedAngle === 90) { if (normalizedAngle === 90) {
x = draggablePositionPdf.y + draggablePositionPdf.height; x = draggablePositionPdf.y;
y = draggablePositionPdf.x; y = draggablePositionPdf.x;
} else if (normalizedAngle === 180) { } else if (normalizedAngle === 180) {
x = widthAdjusted - draggablePositionPdf.x; x = viewedPageWidth - draggablePositionPdf.x - draggablePositionPdf.width;
y = draggablePositionPdf.y + draggablePositionPdf.height; y = draggablePositionPdf.y;
} else if (normalizedAngle === 270) { } else if (normalizedAngle === 270) {
x = heightAdjusted - draggablePositionPdf.y - draggablePositionPdf.height; x = viewedPageHeight - draggablePositionPdf.y - draggablePositionPdf.height;
y = widthAdjusted - draggablePositionPdf.x; y = viewedPageWidth - draggablePositionPdf.x - draggablePositionPdf.width;
} }
// let angle = draggablePositionPixels.angle % 360;
// if (angle < 0) angle += 360; // Normalize to positive angle // Convert rotation angle to radians
const radians = -draggablePositionPixels.angle; // Convert angle to radians let pageRotationInRadians = PDFLib.degreesToRadians(normalizedAngle);
const rotationInRadians = pageRotationInRadians - draggablePositionPixels.angle;
// Calculate the center of the image
const imageCenterX = x + draggablePositionPdf.width / 2;
const imageCenterY = y + draggablePositionPdf.height / 2;
// Apply transformations to rotate the image about its center
page.pushOperators( page.pushOperators(
PDFLib.pushGraphicsState(), PDFLib.pushGraphicsState(),
PDFLib.concatTransformationMatrix(1, 0, 0, 1, originx, originy), PDFLib.concatTransformationMatrix(1, 0, 0, 1, imageCenterX, imageCenterY), // Translate to center
PDFLib.concatTransformationMatrix( PDFLib.concatTransformationMatrix(
Math.cos(radians), Math.cos(rotationInRadians),
Math.sin(radians), Math.sin(rotationInRadians),
-Math.sin(radians), -Math.sin(rotationInRadians),
Math.cos(radians), Math.cos(rotationInRadians),
0, 0,
0 0
), ), // Rotate
PDFLib.concatTransformationMatrix(1, 0, 0, 1, -1 * originx, -1 * originy) PDFLib.concatTransformationMatrix(1, 0, 0, 1, -imageCenterX, -imageCenterY) // Translate back
); );
page.drawImage(pdfImageObject, { page.drawImage(pdfImageObject, {
x: x, x: x,
y: y, y: y,
width: draggablePositionPdf.width, width: draggablePositionPdf.width,
height: draggablePositionPdf.height, height: draggablePositionPdf.height,
}); });
// Restore the graphics state
page.pushOperators(PDFLib.popGraphicsState()); page.pushOperators(PDFLib.popGraphicsState());
} }
} }

@ -170,7 +170,7 @@ function setupFileInput(chooser) {
inputContainer.querySelector('#fileInputText').innerHTML = window.fileInput.loading; inputContainer.querySelector('#fileInputText').innerHTML = window.fileInput.loading;
async function checkZipFile() { async function checkZipFile() {
const hasZipFiles = allFiles.some(file => file.type && zipTypes.includes(file.type)); const hasZipFiles = allFiles.some(file => ((typeof(file.type) != undefined) && zipTypes.includes(file.type)));
// Only change to extractPDF message if we actually have zip files // Only change to extractPDF message if we actually have zip files
if (hasZipFiles) { if (hasZipFiles) {