Implement Text Wrapping and Resizing for FreeText Annotations

[shivansh84ya]

Description:
This PR introduces enhancements to the FreeTextAnnotationElement to ensure that text within the annotation wraps correctly.

Changes:

CSS Adjustments:

• Added overflow-wrap: break-word and white-space: pre-wrap to ensure text wrapping.
• Enabled resizing with resize: both.
• Applied box-sizing: border-box for consistent sizing with padding and borders.

JavaScript Enhancements:

• Updated the FreeTextAnnotationElement class:
  • Ensured text content wraps correctly within the container.
  • Added _addResizeHandles and _addResizeListeners methods to enable and handle resizing of the annotation box.
  • Listened for zoom changes and applied scaling to maintain proper layout and functionality.

Testing:

• Verified that the text wraps correctly when the annotation box is resized.
• Ensured that resizing handles appear and function as expected.
• Confirmed that zoom functionality scales the annotation correctly.

[calixteman]

I just opened test/pdfs/freetexts.pdf with your patch applied, I tried to play with the gray squares and I'm sorry but I don't understand what it's supposed to do. I'm probably missing some context...

[shivansh84ya]

Hello @calixteman,

I have attached a screen recording that demonstrates the intended functionality of the FreeText annotations after applying my patch. Please review it at your convenience. If there are any areas that need improvement, I would appreciate your feedback.
https://github.com/user-attachments/assets/5c782d05-39ab-4ce9-bf1f-882b413f89d8

Thank you!

[nicolo-ribaudo]

Testing:

* Verified that the text wraps correctly when the annotation box is resized.

* Ensured that resizing handles appear and function as expected.

* Confirmed that zoom functionality scales the annotation correctly.

Can you also test that when saving the PDF and re-opening it, the annotation text still wraps correctly?

[shivansh84ya]

Hi @nicolo-ribaudo,

I appreciate the feedback and I’m currently revising and improving the code to make it proficient as per the requirements. I will also test that when saving the PDF and re-opening it, the annotation text still wraps correctly.

[calixteman]

Ok I managed to do something similar to what you shew in your video.
That said, the box is resized when I try to move the box outside of the page but only on the right !
Once I release the mouse button, the box just gets its original dimensions, so I'm sorry, but I don't understand what's the problem you're trying to solve.

[shivansh84ya]

Hi @calixteman,

To clarify, the primary issue I addressed was ensuring that FreeText annotations wrap text correctly.
Previously, resizing the annotation box caused it to revert to its original size, and there were issues when moving it outside the page boundary. These behaviors have been corrected in my patch.

I have attached before and after screen recordings to demonstrate the resolved issues.
Before: https://github.com/user-attachments/assets/cda44851-ac3c-444e-a99c-95a593989c4d
After: https://github.com/user-attachments/assets/0abb8852-e74e-4401-be70-ac8bfbfa2ff2

Thank you for reviewing this.

[shivansh84ya]

Testing:

* Verified that the text wraps correctly when the annotation box is resized.

* Ensured that resizing handles appear and function as expected.

* Confirmed that zoom functionality scales the annotation correctly.

Can you also test that when saving the PDF and re-opening it, the annotation text still wraps correctly?

Hi @nicolo-ribaudo
Currently working on ensuring that the annotation text wraps correctly when saving and re-opening the PDF. Actively troubleshooting and seeking solutions to resolve these issues. Once the issue is resolved, I plan to raise a PR for the changes.

[shivansh84ya]

I am currently working on saving the PDF, reopening it, and displaying annotated wraps correctly. However, this task requires additional time as I need to understand the project's folder structure and codebase fully.

Best regards,