@@ -2076,6 +2084,9 @@ function PdfRequestFiles(props) {
setZoomPercent={setZoomPercent}
zoomPercent={zoomPercent}
isPublicTemplate={isPublicTemplate}
+ clickOnZoomIn={clickOnZoomIn}
+ clickOnZoomOut={clickOnZoomOut}
+ isDisableRotate={true}
/>
diff --git a/apps/OpenSign/src/pages/PlaceHolderSign.js b/apps/OpenSign/src/pages/PlaceHolderSign.js
index 813c27cdb..16bc0d4a4 100644
--- a/apps/OpenSign/src/pages/PlaceHolderSign.js
+++ b/apps/OpenSign/src/pages/PlaceHolderSign.js
@@ -36,7 +36,12 @@ import {
convertPdfArrayBuffer,
getContainerScale,
openInNewTab,
- convertBase64ToFile
+ convertBase64ToFile,
+ onClickZoomIn,
+ onClickZoomOut,
+ rotatePdfPage,
+ handleRemoveWidgets,
+ handleRotateWarning
} from "../constant/Utils";
import RenderPdf from "../components/pdf/RenderPdf";
import { useNavigate } from "react-router-dom";
@@ -57,6 +62,7 @@ import PdfZoom from "../components/pdf/PdfZoom";
import LottieWithLoader from "../primitives/DotLottieReact";
import { paidUrl } from "../json/plansArr";
import { useTranslation } from "react-i18next";
+import RotateAlert from "../components/RotateAlert";
function PlaceHolderSign() {
const { t } = useTranslation();
@@ -134,6 +140,7 @@ function PlaceHolderSign() {
const [pdfArrayBuffer, setPdfArrayBuffer] = useState("");
const isHeader = useSelector((state) => state.showHeader);
const [activeMailAdapter, setActiveMailAdapter] = useState("");
+ const [isRotate, setIsRotate] = useState(false);
const [isAlreadyPlace, setIsAlreadyPlace] = useState({
status: false,
message: ""
@@ -1715,6 +1722,31 @@ function PlaceHolderSign() {
});
}
};
+ const clickOnZoomIn = () => {
+ onClickZoomIn(scale, zoomPercent, setScale, setZoomPercent);
+ };
+ const clickOnZoomOut = () => {
+ onClickZoomOut(zoomPercent, scale, setZoomPercent, setScale);
+ };
+ //`handleRotationFun` function is used to roatate pdf particular page
+ const handleRotationFun = async (rotateDegree) => {
+ const isRotate = handleRotateWarning(signerPos, pageNumber);
+ if (isRotate) {
+ setIsRotate(true);
+ } else {
+ const urlDetails = await rotatePdfPage(
+ pdfDetails[0].URL,
+ rotateDegree,
+ pageNumber - 1,
+ pdfRotateBase64
+ );
+ setPdfArrayBuffer && setPdfArrayBuffer(urlDetails.arrayBuffer);
+ setPdfRotatese64(urlDetails.base64);
+ }
+ };
+ const handleRemovePlaceholder = () => {
+ handleRemoveWidgets(setSignerPos, signerPos, pageNumber, setIsRotate);
+ };
return (
<>
@@ -1768,19 +1800,9 @@ function PlaceHolderSign() {
{/* pdf render view */}
{/* this modal is used show alert set placeholder for all signers before send mail */}
@@ -2026,9 +2048,16 @@ function PlaceHolderSign() {
alertSendEmail={alertSendEmail}
isShowHeader={true}
currentSigner={true}
+ handleRotationFun={handleRotationFun}
+ clickOnZoomIn={clickOnZoomIn}
+ clickOnZoomOut={clickOnZoomOut}
/>
-
+
{containerWH && (
+
);
diff --git a/apps/OpenSign/src/pages/SignyourselfPdf.js b/apps/OpenSign/src/pages/SignyourselfPdf.js
index 2f9049a80..55acc3e7c 100644
--- a/apps/OpenSign/src/pages/SignyourselfPdf.js
+++ b/apps/OpenSign/src/pages/SignyourselfPdf.js
@@ -34,7 +34,10 @@ import {
changeImageWH,
handleSendOTP,
getContainerScale,
- getDefaultSignature
+ getDefaultSignature,
+ onClickZoomIn,
+ onClickZoomOut,
+ rotatePdfPage
} from "../constant/Utils";
import { useParams } from "react-router-dom";
import Tour from "reactour";
@@ -53,6 +56,7 @@ import VerifyEmail from "../components/pdf/VerifyEmail";
import PdfZoom from "../components/pdf/PdfZoom";
import Loader from "../primitives/Loader";
import { useTranslation } from "react-i18next";
+import RotateAlert from "../components/RotateAlert";
//For signYourself inProgress section signer can add sign and complete doc sign.
function SignYourSelf() {
const { t } = useTranslation();
@@ -124,6 +128,7 @@ function SignYourSelf() {
const isHeader = useSelector((state) => state.showHeader);
const [scale, setScale] = useState(1);
const [pdfRotateBase64, setPdfRotatese64] = useState("");
+ const [isRotate, setIsRotate] = useState(false);
const divRef = useRef(null);
const nodeRef = useRef(null);
const [, drop] = useDrop({
@@ -207,6 +212,7 @@ function SignYourSelf() {
return () => clearTimeout(timer);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [divRef.current, isHeader]);
+
//function for get document details for perticular signer with signer'object id
const getDocumentDetails = async (showComplete) => {
try {
@@ -1162,6 +1168,48 @@ function SignYourSelf() {
handleTextSettingModal(false);
}
};
+ const clickOnZoomIn = () => {
+ onClickZoomIn(scale, zoomPercent, setScale, setZoomPercent);
+ };
+ const clickOnZoomOut = () => {
+ onClickZoomOut(zoomPercent, scale, setZoomPercent, setScale);
+ };
+ //`handleRotationFun` function is used to roatate pdf particular page
+ const handleRotationFun = async (rotateDegree) => {
+ const isPlaceholder = handleRotateWarning();
+ if (isPlaceholder) {
+ setIsRotate(true);
+ } else {
+ const urlDetails = await rotatePdfPage(
+ pdfUrl || pdfDetails[0].URL,
+ rotateDegree,
+ pageNumber - 1,
+ pdfRotateBase64
+ );
+ setPdfArrayBuffer && setPdfArrayBuffer(urlDetails.arrayBuffer);
+ setPdfRotatese64(urlDetails.base64);
+ }
+ };
+
+ //function to show warning when user rotate page and there are some already widgets on that page
+ const handleRotateWarning = () => {
+ const placeholderData = xyPostion?.filter(
+ (data) => data.pageNumber === pageNumber
+ );
+ if (placeholderData && placeholderData.length > 0) {
+ return true;
+ } else {
+ return false;
+ }
+ };
+ //function to use remove widgets from current page when user want to rotate page
+ const handleRemoveWidgets = () => {
+ const updatePlaceholder = xyPostion.filter(
+ (data) => data.pageNumber !== pageNumber
+ );
+ setXyPostion(updatePlaceholder);
+ setIsRotate(false);
+ };
return (
@@ -1225,19 +1273,9 @@ function SignYourSelf() {
/>
-
+
{containerWH?.width && containerWH?.height && (
+
{
const { t } = useTranslation();
const navigate = useNavigate();
@@ -64,6 +70,7 @@ const TemplatePlaceholder = () => {
const [isSendAlert, setIsSendAlert] = useState(false);
const [isCreateDocModal, setIsCreateDocModal] = useState(false);
const [isSubscribe, setIsSubscribe] = useState(false);
+ const [isRotate, setIsRotate] = useState(false);
const [isLoading, setIsLoading] = useState({
isLoad: true,
message: t("loading-mssg")
@@ -1317,6 +1324,31 @@ const TemplatePlaceholder = () => {
setIsCheckbox(false);
};
+ const clickOnZoomIn = () => {
+ onClickZoomIn(scale, zoomPercent, setScale, setZoomPercent);
+ };
+ const clickOnZoomOut = () => {
+ onClickZoomOut(zoomPercent, scale, setZoomPercent, setScale);
+ };
+ //`handleRotationFun` function is used to roatate pdf particular page
+ const handleRotationFun = async (rotateDegree) => {
+ const isRotate = handleRotateWarning(signerPos, pageNumber);
+ if (isRotate) {
+ setIsRotate(true);
+ } else {
+ const urlDetails = await rotatePdfPage(
+ pdfDetails[0].URL,
+ rotateDegree,
+ pageNumber - 1,
+ pdfRotateBase64
+ );
+ setPdfRotatese64(urlDetails.base64);
+ }
+ };
+ const handleRemovePlaceholder = () => {
+ handleRemoveWidgets(setSignerPos, signerPos, pageNumber, setIsRotate);
+ };
+
return (
<>
@@ -1364,18 +1396,9 @@ const TemplatePlaceholder = () => {
{/* pdf render view */}
{/* this modal is used show alert set placeholder for all signers before send mail */}
@@ -1518,6 +1541,9 @@ const TemplatePlaceholder = () => {
currentSigner={true}
setIsEditTemplate={handleEditTemplateModal}
dataTut4="reactourFour"
+ handleRotationFun={handleRotationFun}
+ clickOnZoomIn={clickOnZoomIn}
+ clickOnZoomOut={clickOnZoomOut}
/>
{
fontColor={fontColor}
setFontColor={setFontColor}
/>
+
);
diff --git a/apps/OpenSign/src/script/locales/en/translation.json b/apps/OpenSign/src/script/locales/en/translation.json
index 90fde4716..461c4615c 100644
--- a/apps/OpenSign/src/script/locales/en/translation.json
+++ b/apps/OpenSign/src/script/locales/en/translation.json
@@ -606,5 +606,6 @@
"format": "format",
"select-date-format": "Select a date format",
"rotate-right": "Rotate right",
- "rotate-left": "Rotate left"
+ "rotate-left": "Rotate left",
+ "rotate-alert-mssg": "All widgets on this page will be lost. Are you sure you want to proceed?"
}
diff --git a/apps/OpenSign/src/script/locales/fr/translation.json b/apps/OpenSign/src/script/locales/fr/translation.json
index bc8daf3ed..1b1671b85 100644
--- a/apps/OpenSign/src/script/locales/fr/translation.json
+++ b/apps/OpenSign/src/script/locales/fr/translation.json
@@ -605,5 +605,6 @@
"format": "format",
"select-date-format": "Sélectionnez un format de date",
"rotate-right": "Faire pivoter à droite",
- "rotate-left": "Faire pivoter à gauche"
+ "rotate-left": "Faire pivoter à gauche",
+ "rotate-alert-mssg" :"Tous les widgets de cette page seront perdus. Êtes-vous sûr de vouloir continuer ?"
}