-
Notifications
You must be signed in to change notification settings - Fork 3.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Feature: Support manual redaction #2433
base: main
Are you sure you want to change the base?
Feature: Support manual redaction #2433
Conversation
- Add redact.html which contains the nav-bar, file chooser, outer container and print container (used by PDF.JS viewer) and lastly the footer. - Add redact.css which is used specifically to style redaction operation and the redaction page (except for PDF.js viewer). - Add viewer-redact.css which is used to style PDF.js viewer that's used in the page (Changed the background to correspond with Stirling's themes). - Add redact.js which contains the redaction related logic.
- Add submit button. - Add hidden redactions input. - Rename fileSelector from pdf-upload to fileInput.
- Scale x, y, width and height to match PDF page points accurately.
- Fix formula for redaction points and dimensions as x, y, height and width should be the original width rather than the width after adjusting it to the zoom level (zoom level is mainly used for correct display positioning, while scale factor is used for correct positioning in the actual PDF).
- Slightly refactor redact.js for more readability and to reduce code duplication.
…ion-based Redaction mode buttons - Now, when one button is clicked, the other is automatically deselected, ensuring only one mode can be active at a time.
- Support page-based redactions by providing page numbers, page ranges and functions.
- Rename pageNumbers's input id to be more meaningful
Looking better and better. I think you made the right call on the confirm redaction button. The main issue now is the double scrolling which is a bit confusing (main page scroll and view window scroll). I think perhaps we should ditch the drag and drop file uploader for this feature and integrate a file upload into the viewer instead, alongside any other features that are still in the window above the viewer. This way the viewer can take up the whole page below the Stirling PDF toolbar, I think that will be a cleaner layout for this feature |
- Hide nav bar, footer and form on file selection. - Add a properties button in the toolbar to give users the choice to change their page settings.
/deploypr :) |
🚀 PR Test DeploymentYour PR has been deployed for testing! 🔗 Test URL: http://185.252.234.121:2433 This deployment will be automatically cleaned up when the PR is closed. |
Hi @omar-ahmed42 I think there is some clarity lacking here either way. Also, could we bring back the Stirling toolbar at the top, there's no way off this page right now. |
Hi @reecebrowne
It is, I thought of calling it "Page-based Redaction" but this won't represent the checkbox "Convert PDF to PDF-Image ... etc", so I thought I would go with "Properties" to be more generic.
Bringing the nav bar back would bring the second scroll back 😅, we could instead make Stirling clickable and redirect the user to the home page, and upon clicking on it, a popup should come up "You will be redirected to the home page ["Cancel"] ["Proceed"]", why the popup? there's a possibility of mis-clicking on the Stirling icon by the user and if that happens the user will lose all the progress made so far, so we can say that's some kind of a protective measure, what do you think? |
I'm thinking more of a dropdown? this way the user would know what this option does (if it's just a button the user might not figure out what it does without a tutorial) or we can have 2 buttons, 1 for page based redactions (the one above), and the other would be a generic button containing options and fields related to the file or the operations in general, why? We might need in the future to integrate extra features that might not have a specific category into the feature, example: output filename, in this case, the user will find the generic ones over there, what do you think?
Let me know what you think
I think I managed to accomplish that after reading your instructions, thanks for your help! |
Convert to image should be a simple enough concept to convey via a tooltip, we also have an existing icon for it so I wouldn't be too worried about this.
Page based redactions should definitely be it's own thing, some kind of dropdown or submenu is necessary for functionality but it's not really something I think should be bundled into a settings/properties menu.
Code looks good, thanks for sorting that. |
/deploypr |
🚀 PR Test DeploymentYour PR has been deployed for testing! 🔗 Test URL: http://185.252.234.121:2433 This deployment will be automatically cleaned up when the PR is closed. |
Looking good! Thinking the following icon for full page redaction Rotated pages aren't working at the moment, see below. I know we use it elsewhere but the drag box for box selection isn't great, it would be much better if it was click then drag, the current behaviour was weird. There may be some library out there you could use instead. Would be great if you can look into this but it is a bit out of scope so no pressure if you don't fancy it. |
Additional issue, if you do some redactions, download that redacted pdf then upload a new pdf and do redactions on that the redactions from the first pdf will apply to the second but don't show up in the UI |
I think either the icon you suggested or this one https://fonts.google.com/icons?selected=Material+Symbols+Outlined:post_add:FILL@0;wght@400;GRAD@0;opsz@20&icon.query=page&icon.size=16&icon.color=%23e8eaed
I will take a look at it, worst case scenario, might disable pdf rotation until the issue is resolved.
I will take a look at this one as well but I think I have an idea why it happens
It's okay I can take a look at it, but I will prioritize the issues mentioned earlier in this thread/conversation then I will start looking into it |
- Fix a bug that caused redactions that were applied to old files to apply to newly uploaded files as redactions input and redactions array weren't reset on new uploads.
|
Description
Manual Redaction:
Text Selection-based redaction:
ctrl + s
shortcut or by pressing on apply/save/disk icon in the toolbar.delete/trash
icon or by using the shortcutdelete
.color palette
icon and choosing the color they want.Draw/Area-based redaction:
ctrl + s
shortcut or by pressing on apply/save/disk icon in the toolbar.delete/trash
icon or by using the shortcutdelete
(requires temporarily turning off drawing mode).color palette
icon and choosing the color they want.Page-based redaction:
Redaction modes:
There are three modes of redaction/operation currently supported
How to use:
Text Selection-based redaction: click on this icon in the toolbar to enable
text-selection redaction mode
then select the text you want to redact then pressctrl + s
or click on the disk/save icon .Draw/Area-based redaction: click on this icon in the toolbar to enable
draw/area-based redaction
thenleft mouse click (LMB)
on the starting point of the rectangle, then once you are satisfied with the rectangle's placement/dimensions thenleft mouse click (LMB)
again to apply the redaction.Left mouse click (LMB)
then move mouse to the right then bottom thenLeft mouse click (LMB)
.Page-based redactions:: Insert the page number(s), range(s) and/or functions (separated by
,
) then select your preferred color and click onRedact
to submit.Color Customizations:
Left mouse click LMB
) then clicking on color palette (highlighted in red in the picture) then select your preferred color.Deletions:
Left mouse click LMB
) then clicking on the trash icon (highlighted in red in the picture) .Card in the home page:
Closes #465
Checklist