WEBDIENSTE/OpenSign
1
0
Fork 0
mirror of https://github.com/OpenSignLabs/OpenSign.git synced 2026-08-17 21:25:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1413 from OpenSignLabs/raktima-patch-9

Browse Source 
fix: text size issue after complete signature in mobile view
This commit is contained in:
prafull-opensignlabs
2024-11-04 18:15:30 +05:30
committed by GitHub
parent dc90d412ca 24ce6eae3b
commit 6146fe5f86
10 changed files with 55 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
+2 -2
View File
@@ -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 (
apps/OpenSign/src/components/pdf/Placeholder.js
+4 -4
View File
@@ -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) {
<span>{t("font-size")} :</span>
<select
className="ml-[3px] md:ml:[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
value={props.fontSize || clickonWidget.options?.fontSize || "12"}
onChange={(e) => props.setFontSize(e.target.value)}
value={props.fontSize || clickonWidget.options?.fontSize || 12}
onChange={(e) => props.setFontSize(parseInt(e.target.value))}
>
{fontsizeArr.map((size, ind) => {
return (
apps/OpenSign/src/components/pdf/TextFontSetting.js
+4 -2
View File
@@ -21,9 +21,11 @@ function TextFontSetting(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 (
apps/OpenSign/src/components/pdf/WidgetNameModal.js
+2 -2
View File
@@ -276,9 +276,9 @@ const WidgetNameModal = (props) => {
<select
className="ml-[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
value={
props.fontSize || props.defaultdata?.options?.fontSize || "12"
props.fontSize || props.defaultdata?.options?.fontSize || 12
}
onChange={(e) => props.setFontSize(e.target.value)}
onChange={(e) => props.setFontSize(parseInt(e.target.value))}
>
{fontsizeArr.map((size, ind) => {
return (
apps/OpenSign/src/constant/Utils.js
+21 -41
View File
@@ -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 {
apps/OpenSign/src/pages/DraftTemplate.js
+5 -5
View File
@@ -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 ||
apps/OpenSign/src/pages/PdfRequestFiles.js
+1 -3
View File
@@ -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
apps/OpenSign/src/pages/PlaceHolderSign.js
+6 -8
View File
@@ -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 ||
apps/OpenSign/src/pages/SignyourselfPdf.js
+5 -14
View File
@@ -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"
}
apps/OpenSign/src/pages/TemplatePlaceholder.js
+5 -5
View File
@@ -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 ||