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

fix: text box font size issue

Browse Source
This commit is contained in:
RaktimaNXG
2024-10-09 18:05:10 +05:30
parent 244cc30eb6
commit 404785bf29
7 changed files with 44 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/OpenSign/src/components/pdf/Placeholder.js
+23 -4
View File
@@ -651,6 +651,21 @@ function Placeholder(props) {
}
}
};
//function to calculate font size
const calculateFont = (size, isMinHeight) => {
const containerScale = getContainerScale(
props.pdfOriginalWH,
props.pageNumber,
props.containerWH
);
const fontSize = (size || 12) * containerScale * props.scale;
//isMinHeight to set text box minimum height
if (isMinHeight) {
return fontSize * 1.5;
} else {
return fontSize + "px";
}
};
const getCursor = () => {
if (props.data && props.isNeedSign) {
@@ -745,12 +760,16 @@ function Placeholder(props) {
? "auto"
: props.posHeight(props.pos, props.isSignYourself)
}}
minHeight={calculateFont(props.pos.options?.fontSize, true)}
maxHeight="auto"
onResizeStart={() => {
setDraggingEnabled(true);
props.setIsResize && props.setIsResize(true);
}}
onResizeStop={(e, direction, ref) => {
props.setIsResize && props.setIsResize(false);
setTimeout(() => {
props.setIsResize && props.setIsResize(false);
}, 500);
props.handleSignYourselfImageResize &&
props.handleSignYourselfImageResize(
ref,
@@ -785,7 +804,7 @@ function Placeholder(props) {
h: ref.offsetHeight / (props.scale * containerScale)
});
}}
onClick={() => handleOnClickPlaceholder()}
onClick={() => !props.isResize && handleOnClickPlaceholder()}
>
{props.isShowBorder &&
props.pos.type !== radioButtonWidget &&
@@ -872,7 +891,7 @@ function Placeholder(props) {
startDate={startDate}
handleSaveDate={handleSaveDate}
xPos={props.xPos}
posHeight={props.posHeight}
calculateFont={calculateFont}
/>
</div>
) : (
@@ -900,7 +919,7 @@ function Placeholder(props) {
startDate={startDate}
handleSaveDate={handleSaveDate}
xPos={props.xPos}
posHeight={props.posHeight}
calculateFont={calculateFont}
/>
</>
)}
apps/OpenSign/src/components/pdf/PlaceholderType.js
+1 -3
View File
@@ -29,9 +29,7 @@ function PlaceholderType(props) {
const [textValue, setTextValue] = useState();
const [selectedCheckbox, setSelectedCheckbox] = useState([]);
const years = range(1990, getYear(new Date()) + 16, 1);
const height = props.posHeight(props.pos, props.isSignYourself);
const fontSize =
(props.pos.options?.fontSize || (height ? height - 4 : 12)) + "px";
const fontSize = props.calculateFont(props.pos.options?.fontSize);
const fontColor = props.pos.options?.fontColor || "black";
const months = [
"January",
apps/OpenSign/src/components/pdf/RenderPdf.js
+10 -1
View File
@@ -65,7 +65,8 @@ function RenderPdf({
fontSize,
setFontSize,
fontColor,
setFontColor
setFontColor,
isResize
}) {
const { t } = useTranslation();
const isMobile = window.innerWidth < 767;
@@ -104,6 +105,7 @@ function RenderPdf({
}
}
};
const posHeight = (pos, signYourself) => {
const containerScale = getContainerScale(
pdfOriginalWH,
@@ -207,6 +209,7 @@ function RenderPdf({
pageNumber={pageNumber}
ispublicTemplate={ispublicTemplate}
handleUserDetails={handleUserDetails}
isResize={isResize}
/>
</React.Fragment>
)
@@ -357,6 +360,7 @@ function RenderPdf({
setFontSize={setFontSize}
fontColor={fontColor}
setFontColor={setFontColor}
isResize={isResize}
/>
</React.Fragment>
);
@@ -417,6 +421,8 @@ function RenderPdf({
setFontSize={setFontSize}
fontColor={fontColor}
setFontColor={setFontColor}
isResize={isResize}
setIsResize={setIsResize}
/>
)
);
@@ -548,6 +554,7 @@ function RenderPdf({
setFontSize={setFontSize}
fontColor={fontColor}
setFontColor={setFontColor}
isResize={isResize}
/>
</React.Fragment>
);
@@ -611,6 +618,8 @@ function RenderPdf({
setFontSize={setFontSize}
fontColor={fontColor}
setFontColor={setFontColor}
isResize={isResize}
setIsResize={setIsResize}
/>
</React.Fragment>
);
apps/OpenSign/src/constant/Utils.js
+4 -10
View File
@@ -1289,14 +1289,8 @@ export const changeImageWH = async (base64Image) => {
};
//function to calculate font size of text area widgets
const calculateFontSize = (
position,
containerScale,
signyourself,
widgetHeight
) => {
const font =
position?.options?.fontSize || (widgetHeight ? widgetHeight / 2 : 12);
const calculateFontSize = (position, containerScale, signyourself) => {
const font = position?.options?.fontSize || 12;
if (!signyourself && position?.isMobile && position?.scale) {
return font / position?.scale / containerScale;
} else {
@@ -1506,8 +1500,7 @@ export const multiSignEmbed = async (
const fontSize = calculateFontSize(
position,
containerScale,
signyourself,
position.Height
signyourself
);
parseInt(fontSize);
let textContent;
@@ -1688,6 +1681,7 @@ 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/PlaceHolderSign.js
+1
View File
@@ -2058,6 +2058,7 @@ function PlaceHolderSign() {
setSignerPos={setSignerPos}
containerWH={containerWH}
setIsResize={setIsResize}
isResize={isResize}
setZIndex={setZIndex}
setIsPageCopy={setIsPageCopy}
signersdata={signersdata}
apps/OpenSign/src/pages/SignyourselfPdf.js
+4 -1
View File
@@ -132,6 +132,7 @@ function SignYourSelf() {
const [isRotate, setIsRotate] = useState({ status: false, degree: 0 });
const [isSubscribe, setIsSubscribe] = useState({ plan: "", isValid: true });
const [isDownloadModal, setIsDownloadModal] = useState(false);
const [isResize, setIsResize] = useState(false);
const divRef = useRef(null);
const nodeRef = useRef(null);
const [, drop] = useDrop({
@@ -785,7 +786,7 @@ function SignYourSelf() {
const handleStop = (event, dragElement) => {
setFontSize();
setFontColor();
if (isDragging && dragElement) {
if (!isResize && isDragging && dragElement) {
event.preventDefault();
const containerScale = getContainerScale(
pdfOriginalWH,
@@ -1402,6 +1403,8 @@ function SignYourSelf() {
setFontSize={setFontSize}
fontColor={fontColor}
setFontColor={setFontColor}
isResize={isResize}
setIsResize={setIsResize}
/>
)}
</div>
apps/OpenSign/src/pages/TemplatePlaceholder.js
+1
View File
@@ -1600,6 +1600,7 @@ const TemplatePlaceholder = () => {
setFontSize={setFontSize}
fontColor={fontColor}
setFontColor={setFontColor}
isResize={isResize}
/>
)}
</div>