diff --git a/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js b/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js index 800ef7adf..697c42917 100644 --- a/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js +++ b/apps/OpenSign/src/components/pdf/DropdownWidgetOption.js @@ -339,9 +339,9 @@ function DropdownWidgetOption(props) { value={ props.fontSize || props.currWidgetsDetails?.options?.fontSize || - "12" + 12 } - onChange={(e) => props.setFontSize(e.target.value)} + onChange={(e) => props.setFontSize(parseInt(e.target.value))} > {fontsizeArr.map((size, ind) => { return ( diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js index 953eb8e14..c401d51cd 100644 --- a/apps/OpenSign/src/components/pdf/Placeholder.js +++ b/apps/OpenSign/src/components/pdf/Placeholder.js @@ -412,7 +412,7 @@ function Placeholder(props) { data?.format, null, null, - props.fontSize || props.pos?.options?.fontSize || "12", + props.fontSize || props.pos?.options?.fontSize || 12, props.fontColor || props.pos?.options?.fontColor || "black" ); setSelectDate({ date: date, format: data?.format }); @@ -651,7 +651,7 @@ function Placeholder(props) { const fontSize = (size || 12) * containerScale * props.scale; //isMinHeight to set text box minimum height if (isMinHeight) { - return fontSize * 1.5 + "px"; + return fontSize * 1.2 + "px"; } else { return fontSize + "px"; } @@ -948,8 +948,8 @@ function Placeholder(props) { {t("font-size")} : props.setFontSize(e.target.value)} + onChange={(e) => props.setFontSize(parseInt(e.target.value))} > {fontsizeArr.map((size, ind) => { return ( diff --git a/apps/OpenSign/src/constant/Utils.js b/apps/OpenSign/src/constant/Utils.js index 2b9770474..079150213 100644 --- a/apps/OpenSign/src/constant/Utils.js +++ b/apps/OpenSign/src/constant/Utils.js @@ -463,29 +463,29 @@ export const defaultWidthHeight = (type) => { case "stamp": return { width: 150, height: 60 }; case "checkbox": - return { width: 15, height: 15 }; + return { width: 15, height: 17 }; case textInputWidget: - return { width: 150, height: 25 }; + return { width: 150, height: 17 }; case "dropdown": return { width: 120, height: 22 }; case "initials": return { width: 50, height: 50 }; case "name": - return { width: 150, height: 25 }; + return { width: 150, height: 17 }; case "company": - return { width: 150, height: 25 }; + return { width: 150, height: 17 }; case "job title": - return { width: 150, height: 25 }; + return { width: 150, height: 17 }; case "date": return { width: 100, height: 20 }; case "image": return { width: 70, height: 70 }; case "email": - return { width: 150, height: 20 }; + return { width: 150, height: 17 }; case radioButtonWidget: return { width: 5, height: 10 }; case textWidget: - return { width: 150, height: 25 }; + return { width: 150, height: 17 }; default: return { width: 150, height: 60 }; } @@ -1013,7 +1013,7 @@ export const calculateInitialWidthHeight = (widgetData) => { const intialText = widgetData; const span = document.createElement("span"); span.textContent = intialText; - span.style.font = `14px`; // here put your text size and font family + span.style.font = `12px`; // here put your text size and font family span.style.display = "hidden"; document.body.appendChild(span); const width = span.offsetWidth; @@ -1303,16 +1303,6 @@ export const changeImageWH = async (base64Image) => { }); }; -//function to calculate font size of text area widgets -const calculateFontSize = (position, containerScale, signyourself) => { - const font = position?.options?.fontSize || 12; - if (!signyourself && position?.isMobile && position?.scale) { - return font / position?.scale / containerScale; - } else { - return font / containerScale; - } -}; - const getWidgetsFontColor = (type) => { switch (type) { case "red": @@ -1328,14 +1318,7 @@ const getWidgetsFontColor = (type) => { } }; //function for embed multiple signature using pdf-lib -export const multiSignEmbed = async ( - widgets, - pdfDoc, - signyourself, - scale, - pdfOriginalWH, - containerWH -) => { +export const multiSignEmbed = async (widgets, pdfDoc, signyourself, scale) => { // `fontBytes` is used to embed custom font in pdf const fontBytes = await fileasbytes( "https://cdn.opensignlabs.com/webfonts/times.ttf" @@ -1345,11 +1328,6 @@ export const multiSignEmbed = async ( let hasError = false; for (let item of widgets) { if (hasError) break; // Stop the outer loop if an error occurred - const containerScale = getContainerScale( - pdfOriginalWH, - item?.pageNumber, - containerWH - ); const typeExist = item.pos.some((data) => data?.type); let updateItem; @@ -1436,7 +1414,17 @@ export const multiSignEmbed = async ( return y; } } else { - return resizePos; + const WidgetsTypeTextExist = [ + textWidget, + textInputWidget, + "name", + "company", + "job title", + "date", + "email" + ].includes(position.type); + const yPosition = WidgetsTypeTextExist ? resizePos + 6 : resizePos; + return yPosition; } }; const color = position?.options?.fontColor; @@ -1512,11 +1500,7 @@ export const multiSignEmbed = async ( }); } } else if (widgetTypeExist) { - const fontSize = calculateFontSize( - position, - containerScale, - signyourself - ); + const fontSize = position?.options?.fontSize || 12; parseInt(fontSize); let textContent; if (position?.options?.response) { @@ -1549,7 +1533,6 @@ export const multiSignEmbed = async ( lines.push(currentLine.trim()); return lines; }; - // Function to break text into lines based on when user go next line on press enter button const breakTextIntoLines = (textContent, width) => { const lines = []; @@ -1570,7 +1553,6 @@ export const multiSignEmbed = async ( return lines; }; - //check if text content have `\n` string it means user press enter to go next line and handle condition //else auto adjust text content according to container width const lines = isNewOnEnterLineExist @@ -1597,7 +1579,6 @@ export const multiSignEmbed = async ( } } else if (position.type === "dropdown") { const fontsize = parseInt(position?.options?.fontSize) || 12; - const dropdownRandomId = "dropdown" + randomId(); const dropdown = form.createDropdown(dropdownRandomId); dropdown.addOptions(position?.options?.values); @@ -1696,7 +1677,6 @@ export const multiSignEmbed = async ( } if (!hasError) { const pdfBytes = await pdfDoc.saveAsBase64({ useObjectStreams: false }); - // console.log("pdf", pdfBytes); return pdfBytes; } else { return { diff --git a/apps/OpenSign/src/pages/DraftTemplate.js b/apps/OpenSign/src/pages/DraftTemplate.js index c84978d04..8f10a4aa9 100644 --- a/apps/OpenSign/src/pages/DraftTemplate.js +++ b/apps/OpenSign/src/pages/DraftTemplate.js @@ -1030,7 +1030,7 @@ const DraftTemplate = () => { isReadOnly: isReadOnly || false, isHideLabel: isHideLabel || false, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1068,7 +1068,7 @@ const DraftTemplate = () => { defaultValue: defaultValue, isHideLabel: isHideLabel || false, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1086,7 +1086,7 @@ const DraftTemplate = () => { values: dropdownOptions, defaultValue: defaultValue, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1161,7 +1161,7 @@ const DraftTemplate = () => { } : {}, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1177,7 +1177,7 @@ const DraftTemplate = () => { status: defaultdata.status, defaultValue: defaultdata.defaultValue, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || diff --git a/apps/OpenSign/src/pages/PdfRequestFiles.js b/apps/OpenSign/src/pages/PdfRequestFiles.js index 0e0748d3f..d327a2371 100644 --- a/apps/OpenSign/src/pages/PdfRequestFiles.js +++ b/apps/OpenSign/src/pages/PdfRequestFiles.js @@ -924,9 +924,7 @@ function PdfRequestFiles(props) { widgets, pdfDoc, isSignYourSelfFlow, - scale, - pdfOriginalWH, - containerWH + scale ); // console.log("pdfte", pdfBytes); //get ExistUserPtr object id of user class to get tenantDetails diff --git a/apps/OpenSign/src/pages/PlaceHolderSign.js b/apps/OpenSign/src/pages/PlaceHolderSign.js index 52eceb41f..4755d8015 100644 --- a/apps/OpenSign/src/pages/PlaceHolderSign.js +++ b/apps/OpenSign/src/pages/PlaceHolderSign.js @@ -814,9 +814,7 @@ function PlaceHolderSign() { placeholder, pdfDoc, isSignYourSelfFlow, - scale, - pdfOriginalWH, - containerWH + scale ); const pdfUrl = await convertBase64ToFile(pdfDetails[0].Name, pdfBase64); const tenantId = localStorage.getItem("TenantId"); @@ -1340,7 +1338,7 @@ function PlaceHolderSign() { isHideLabel: isHideLabel || false, defaultValue: defaultValue, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1378,7 +1376,7 @@ function PlaceHolderSign() { isReadOnly: isReadOnly || false, isHideLabel: isHideLabel || false, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1396,7 +1394,7 @@ function PlaceHolderSign() { values: dropdownOptions, defaultValue: defaultValue, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1469,7 +1467,7 @@ function PlaceHolderSign() { } : {}, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1485,7 +1483,7 @@ function PlaceHolderSign() { status: defaultdata.status, defaultValue: defaultdata.defaultValue, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || diff --git a/apps/OpenSign/src/pages/SignyourselfPdf.js b/apps/OpenSign/src/pages/SignyourselfPdf.js index 9ed7d8ef3..907bdf8e4 100644 --- a/apps/OpenSign/src/pages/SignyourselfPdf.js +++ b/apps/OpenSign/src/pages/SignyourselfPdf.js @@ -424,9 +424,7 @@ function SignYourSelf() { const getWidth = widgetTypeExist ? calculateInitialWidthHeight(dragTypeValue, widgetValue).getWidth : defaultWidthHeight(dragTypeValue).width; - const getHeight = widgetTypeExist - ? calculateInitialWidthHeight(dragTypeValue, widgetValue).getHeight - : defaultWidthHeight(dragTypeValue).height; + const getHeight = defaultWidthHeight(dragTypeValue).height; dropObj = { xPosition: getWidth / 2 + containerWH.width / 2, @@ -457,9 +455,7 @@ function SignYourSelf() { const getWidth = widgetTypeExist ? calculateInitialWidthHeight(widgetValue).getWidth : defaultWidthHeight(dragTypeValue).width; - const getHeight = widgetTypeExist - ? calculateInitialWidthHeight(widgetValue).getHeight - : defaultWidthHeight(dragTypeValue).height; + const getHeight = defaultWidthHeight(dragTypeValue).height; dropObj = { xPosition: getXPosition / (containerScale * scale), yPosition: getYPosition / (containerScale * scale), @@ -661,9 +657,7 @@ function SignYourSelf() { xyPostion, pdfDoc, isSignYourSelfFlow, - scale, - pdfOriginalWH, - containerWH + scale ); // console.log("pdf", pdfBytes); //function for call to embed signature in pdf and get digital signature pdf @@ -1028,7 +1022,6 @@ function SignYourSelf() { const getPageNumer = xyPostion.filter( (data) => data.pageNumber === pageNumber ); - if (getPageNumer.length > 0) { const getXYdata = getPageNumer[0].pos; const getPosData = getXYdata; @@ -1058,7 +1051,7 @@ function SignYourSelf() { isReadOnly: isReadOnly, isHideLabel: isHideLabel || false, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || "black" } @@ -1092,7 +1085,6 @@ function SignYourSelf() { const getPageNumer = xyPostion.filter( (data) => data.pageNumber === pageNumber ); - if (getPageNumer.length > 0) { const getXYdata = getPageNumer[0].pos; const getPosData = getXYdata; @@ -1102,8 +1094,7 @@ function SignYourSelf() { ...position, options: { ...position.options, - fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize: fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || "black" } diff --git a/apps/OpenSign/src/pages/TemplatePlaceholder.js b/apps/OpenSign/src/pages/TemplatePlaceholder.js index 5a0b79085..002ab26b3 100644 --- a/apps/OpenSign/src/pages/TemplatePlaceholder.js +++ b/apps/OpenSign/src/pages/TemplatePlaceholder.js @@ -1123,7 +1123,7 @@ const TemplatePlaceholder = () => { isReadOnly: isReadOnly || false, isHideLabel: isHideLabel || false, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1161,7 +1161,7 @@ const TemplatePlaceholder = () => { defaultValue: defaultValue, isHideLabel: isHideLabel || false, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1179,7 +1179,7 @@ const TemplatePlaceholder = () => { values: dropdownOptions, defaultValue: defaultValue, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1254,7 +1254,7 @@ const TemplatePlaceholder = () => { } : {}, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor || @@ -1270,7 +1270,7 @@ const TemplatePlaceholder = () => { status: defaultdata.status, defaultValue: defaultdata.defaultValue, fontSize: - fontSize || currWidgetsDetails?.options?.fontSize || "12", + fontSize || currWidgetsDetails?.options?.fontSize || 12, fontColor: fontColor || currWidgetsDetails?.options?.fontColor ||