Improve PDF previewer of Joplin
The aim of this project is to replace the built-in PDF renderer with a new 3rd party library and add multiple new pdf related features and improvements to the app.
Full screen viewer
What was done
We replaced the built-in pdf viewer of chrome with a custom built one. We used pdf.js as our main rendering library and built around it 2 versions of the pdf-viewer one meant to be embedded within the note view (replacement of the existing one) and another full-screen viewer (new) for better readibility and more features. Both of them are complete react apps that are embedded in the main app using iframes.
- Annotation editing
- Scroll progress persistence
- Link a particular page number
- Theming support
- Open in external app from viewer
- Open same page in full-screen
- Scroll locking to avoid unintentional scrolling
- Copy/select text
- Zoom in/out
- Thumbnail view
- Go to a page input box
- current page / total pages indicator
- show annotations
Features not existing
- 2 Page view
- Rotate page
A detailed and updated comparison between all the viewers can be found in this post.
What is left to do
Almost all the vital and proposed features have been worked on. But there are a few minor improvements and features that I would like to work on after gsoc ends.
- Search in pdf.
- Create 2 seperate build targets for the two viewers and look into webpack code-splitting for better performance.
- Support for password encrypted pdfs (shouldn't be very hard to integrate since pdf.js already has support for it).
Challenges and learning
- Time management proved to be a big challenge for me, tossing between college exams, deadlines and GSoC.
- New to hooks api of react, I initially found it bit challenging to get it right, but gradually I have gotten a better grip on it.
- Communication skills - being bit of an introvert I often tend to interact less.
- Since most of my PRs focused on same set of files on average, opening multiple PRs at the same time proved to be difficult.