From e879fe086fd9cc20cf9a43dc9490b067153e391d Mon Sep 17 00:00:00 2001 From: unknown Date: Tue, 17 Sep 2024 09:47:20 -0700 Subject: [PATCH] make redline opacity configurable enable submitting notes with enter key add watermark for nr and duplicate pages --- docker-compose.yml | 1 + web/Dockerfile | 2 ++ web/Dockerfile.local | 2 ++ web/src/components/FOI/Home/Redlining.js | 38 +++++++++++++++++++++++- web/src/constants/constants.ts | 1 + 5 files changed, 43 insertions(+), 1 deletion(-) diff --git a/docker-compose.yml b/docker-compose.yml index d3c57fd9a..790944e6a 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -18,6 +18,7 @@ services: - REACT_APP_REDACTION_SELECT_LIMIT=${REDACTION_SELECT_LIMIT} - REACT_APP_BIG_HTTP_GET_TIMEOUT=${BIG_HTTP_GET_TIMEOUT} - REACT_APP_SESSION_SECURITY_KEY=${REACT_APP_SESSION_SECURITY_KEY} + - REACT_APP_REDLINE_OPACITY=${REACT_APP_REDLINE_OPACITY} volumes: - ".:/web" - "/web/node_modules" diff --git a/web/Dockerfile b/web/Dockerfile index 67fad4772..6f3229bd8 100644 --- a/web/Dockerfile +++ b/web/Dockerfile @@ -15,6 +15,7 @@ ARG REACT_APP_ANNOTATION_PAGE_SIZE ARG REACT_APP_PAGE_SELECT_LIMIT ARG REACT_APP_REDACTION_SELECT_LIMIT ARG REACT_APP_SESSION_SECURITY_KEY +ARG REACT_APP_REDLINE_OPACITY ENV NODE_ENV ${NODE_ENV} @@ -27,6 +28,7 @@ ENV REACT_APP_ANNOTATION_PAGE_SIZE ${REACT_APP_ANNOTATION_PAGE_SIZE} ENV REACT_APP_PAGE_SELECT_LIMIT ${REACT_APP_PAGE_SELECT_LIMIT} ENV REACT_APP_REDACTION_SELECT_LIMIT ${REACT_APP_REDACTION_SELECT_LIMIT} ENV REACT_APP_SESSION_SECURITY_KEY ${REACT_APP_SESSION_SECURITY_KEY} +ENV REACT_APP_REDLINE_OPACITY ${REACT_APP_REDLINE_OPACITY} # add `/app/node_modules/.bin` to $PATH ENV PATH /web/node_modules/.bin:$PATH diff --git a/web/Dockerfile.local b/web/Dockerfile.local index 728ec0f76..1747f09fd 100644 --- a/web/Dockerfile.local +++ b/web/Dockerfile.local @@ -17,6 +17,7 @@ ARG REACT_APP_PAGE_SELECT_LIMIT ARG REACT_APP_REDACTION_SELECT_LIMIT ARG REACT_APP_BIG_HTTP_GET_TIMEOUT ARG REACT_APP_SESSION_SECURITY_KEY +ARG REACT_APP_REDLINE_OPACITY ENV NODE_ENV ${NODE_ENV} ENV GENERATE_SOURCEMAP ${GENERATE_SOURCEMAP} @@ -29,6 +30,7 @@ ENV REACT_APP_PAGE_SELECT_LIMIT ${REACT_APP_PAGE_SELECT_LIMIT} ENV REACT_APP_REDACTION_SELECT_LIMIT ${REACT_APP_REDACTION_SELECT_LIMIT} ENV BIG_HTTP_GET_TIMEOUT ${REACT_APP_BIG_HTTP_GET_TIMEOUT} ENV REACT_APP_SESSION_SECURITY_KEY ${REACT_APP_SESSION_SECURITY_KEY} +ENV REACT_APP_REDLINE_OPACITY ${REACT_APP_REDLINE_OPACITY} # add `/app/node_modules/.bin` to $PATH ENV PATH /web/node_modules/.bin:$PATH diff --git a/web/src/components/FOI/Home/Redlining.js b/web/src/components/FOI/Home/Redlining.js index 79e4cd5e1..ccb2e244e 100644 --- a/web/src/components/FOI/Home/Redlining.js +++ b/web/src/components/FOI/Home/Redlining.js @@ -27,6 +27,7 @@ import { ANNOTATION_PAGE_SIZE, REDACTION_SELECT_LIMIT, BIG_HTTP_GET_TIMEOUT, + REDLINE_OPACITY, } from "../../../constants/constants"; import { errorToast } from "../../../helper/helper"; import { useAppSelector } from "../../../hooks/hook"; @@ -84,7 +85,7 @@ const Redlining = React.forwardRef( }, ref ) => { - const alpha = 0.6; + const alpha = REDLINE_OPACITY; const requestnumber = useAppSelector( (state) => state.documents?.requestnumber @@ -193,6 +194,7 @@ const Redlining = React.forwardRef( } = instance.Core; instance.UI.disableElements(PDFVIEWER_DISABLED_FEATURES.split(",")); instance.UI.enableElements(["attachmentPanelButton"]); + instance.UI.enableNoteSubmissionWithEnter(); documentViewer.setToolMode( documentViewer.getTool(instance.Core.Tools.ToolNames.REDACTION) ); @@ -1336,6 +1338,40 @@ const Redlining = React.forwardRef( if (docInstance && documentList.length > 0) { const document = docInstance?.UI.iframeWindow.document; document.getElementById("create_response_pdf").addEventListener("click", handleCreateResponsePDFClick); + docViewer.setWatermark({ + // Draw custom watermark in middle of the document + custom: (ctx, pageNumber, pageWidth, pageHeight) => { + // ctx is an instance of CanvasRenderingContext2D + // https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D + // Hence being able to leverage those properties + let originalPage = pageMappedDocs['stitchedPageLookup'][pageNumber] + let doc = pageFlags.find(d => d.documentid === originalPage.docid); + let pageFlag = doc.pageflag.find(f => f.page === originalPage.page); + if (pageFlag.flagid === pageFlagTypes["Duplicate"]) { + ctx.fillStyle = "#ff0000"; + ctx.font = "20pt Arial"; + ctx.globalAlpha = 0.4; + + ctx.save(); + ctx.translate(pageWidth / 2, pageHeight / 2); + ctx.rotate(-Math.PI / 4); + ctx.fillText("DUPLICATE", 0, 0); + ctx.restore(); + } + + if (pageFlag.flagid === pageFlagTypes["Not Responsive"]) { + ctx.fillStyle = "#ff0000"; + ctx.font = "20pt Arial"; + ctx.globalAlpha = 0.4; + + ctx.save(); + ctx.translate(pageWidth / 2, pageHeight / 2); + ctx.rotate(-Math.PI / 4); + ctx.fillText("NOT RESPONSIVE", 0, 0); + ctx.restore(); + } + }, + }); } //Cleanup Function: removes previous event listeiner to ensure handleCreateResponsePDFClick event is not called multiple times on click return () => { diff --git a/web/src/constants/constants.ts b/web/src/constants/constants.ts index 0152fc2f3..1a76564a0 100644 --- a/web/src/constants/constants.ts +++ b/web/src/constants/constants.ts @@ -19,3 +19,4 @@ export const ANNOTATION_PAGE_SIZE = window._env_?.REACT_APP_ANNOTATION_PAGE_SIZE export const PAGE_SELECT_LIMIT = window._env_?.REACT_APP_PAGE_SELECT_LIMIT ?? process.env.REACT_APP_PAGE_SELECT_LIMIT ?? 250; export const REDACTION_SELECT_LIMIT = window._env_?.REACT_APP_REDACTION_SELECT_LIMIT ?? process.env.REACT_APP_REDACTION_SELECT_LIMIT ?? 250; export const BIG_HTTP_GET_TIMEOUT = window._env_?.REACT_APP_BIG_HTTP_GET_TIMEOUT ?? process.env.REACT_APP_BIG_HTTP_GET_TIMEOUT ?? 300000; +export const REDLINE_OPACITY = window._env_?.REACT_APP_REDLINE_OPACITY ?? process.env.REACT_APP_REDLINE_OPACITY ?? 0.5;