Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-13 16:23:06 +10:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #22 from ElTimuro/doc-132-doc-133-placement-fixes

Browse Source 
Doc-132-doc-133-placement-fixes
This commit is contained in:
Timur Ercan
2023-03-07 17:37:32 +01:00
committed by GitHub
parent 22d1c4146a 4be341befe
commit 1472f722d8
9 changed files with 25 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
apps/web/components/editor/editable-field.tsx
View File

@ -53,18 +53,15 @@ export default function EditableField(props: FieldPropsType) {
e.stopPropagation();
}}
>
{/* width: 192 height 96 */}
<div
hidden={props.hidden}
ref={nodeRef}
className="cursor-move opacity-80 p-2 m-auto w-48 h-24 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none"
className="cursor-move opacity-80 p-2 m-auto w-48 h-16 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none"
style={{
background: stc(props.field.Recipient.email),
}}
>
<div className="mb-2 pointer-events-none">
<Logo className="w-16 mx-auto"></Logo>
</div>
{/* width: 192 height 96 */}
<div className="m-auto overflow-hidden flex-row-reverse text-lg font-bold text-center">
{field.type}
{field.type === "SIGNATURE" ? (

3
apps/web/components/editor/pdf-editor.tsx
View File

@ -48,6 +48,9 @@ export default function PDFEditor(props: any) {
<>
<div>
<PDFViewer
style={{
cursor: `url("https://place-hold.it/110x64/37f095/FFFFFF&text=${selectedFieldType}") 55 32, auto`,
}}
readonly={false}
document={props.document}
fields={fields}

2
apps/web/components/editor/pdf-signer.tsx
View File

@ -45,6 +45,8 @@ export default function PDFSigner(props: any) {
return;
}
if (!dialogResult) return;
const signature = {
fieldId: dialogField.id,
type: dialogResult.type,

3
apps/web/components/editor/pdf-viewer.jsx
View File

@ -60,8 +60,7 @@ export default function PDFViewer(props) {
key={short.generate().toString()}
style={{
position: "relative",
cursor:
'url("https://place-hold.it/110x64/37f095/FFFFFF&text=Signature"), auto',
...props.style,
}}
className="mx-auto w-fit"
>

18
apps/web/components/editor/signable-field.tsx
View File

@ -43,26 +43,26 @@ export default function SignableField(props: FieldPropsType) {
if (!field?.signature) props.onClick(props.field);
}}
ref={nodeRef}
className="cursor-pointer opacity-80 p-2 m-auto w-auto flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none hover:brightness-50"
className="cursor-pointer opacity-80 m-auto w-48 h-16 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none hover:brightness-50"
style={{
background: stc(props.field.Recipient.email),
}}
>
<div
hidden={field?.signature}
className="m-auto w-auto flex-row-reverse font-medium text-center px-12 py-2"
>
<div hidden={field?.signature} className="font-medium my-4">
{field.type === "SIGNATURE" ? "SIGN HERE" : ""}
</div>
<div
hidden={!field?.signature}
className="font-qwigley text-5xl m-auto w-auto flex-row-reverse font-medium text-center"
>
{field?.signature?.type === "type"
? field?.signature.typedSignature
: ""}
{field?.signature?.type === "type" ? (
<div className="my-4">{field?.signature.typedSignature}</div>
) : (
""
)}
{field?.signature?.type === "draw" ? (
<img className="w-50 h-20" src={field?.signature?.signatureImage} />
<img className="w-48 h-16" src={field?.signature?.signatureImage} />
) : (
""
)}

15
apps/web/pages/documents/[id]/recipients.tsx
View File

@ -117,7 +117,6 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
color="primary"
icon={PaperAirplaneIcon}
onClick={() => {
setLoading(true);
setOpen(true);
}}
disabled={
@ -361,12 +360,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
</div>
</div>
<Transition.Root show={open} as={Fragment}>
<Dialog
as="div"
className="relative z-10"
initialFocus={cancelButtonRef}
onClose={setOpen}
>
<Dialog as="div" className="relative z-10" onClose={setOpen}>
<Transition.Child
as={Fragment}
enter="ease-out duration-300"
@ -417,16 +411,13 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
</div>
</div>
<div className="mt-5 sm:mt-6 sm:grid sm:grid-flow-row-dense sm:grid-cols-2 sm:gap-3">
<Button
color="secondary"
onClick={() => setOpen(false)}
ref={cancelButtonRef}
>
<Button color="secondary" onClick={() => setOpen(false)}>
Cancel
</Button>
<Button
onClick={() => {
setOpen(false);
setLoading(true);
sendSigningRequests(props.document).finally(() => {
setLoading(false);
});

2
packages/features/editor/createField.ts
View File

@ -8,7 +8,7 @@ export const createField = (
customText = ""
): any => {
var rect = e.target.getBoundingClientRect();
const fieldSize = { width: 192, height: 96 };
const fieldSize = { width: 192, height: 64 };
var newFieldX = e.clientX - rect.left - fieldSize.width / 2; //x position within the element.
var newFieldY = e.clientY - rect.top - fieldSize.height / 2; //y position within the element.
if (newFieldX < 0) newFieldX = 0;

2
packages/pdf/insertImageInPDF.ts
View File

@ -12,7 +12,7 @@ export async function insertImageInPDF(
const pages = pdfDoc.getPages();
const pdfPage = pages[page];
const pngImage = await pdfDoc.embedPng(image);
const drawSize = { width: 213, height: 50 };
const drawSize = { width: 192, height: 64 };
pdfPage.drawImage(pngImage, {
x: positionX,

4
packages/pdf/insertTextInPDF.ts
View File

@ -24,10 +24,12 @@ export async function insertTextInPDF(
const textSize = useHandwritingFont ? 50 : 15;
const textWidth = customFont.widthOfTextAtSize(text, textSize);
const textHeight = customFont.heightAtSize(textSize);
const fieldSize = { width: 192, height: 64 };
const invertedYPosition = pdfPage.getHeight() - positionY - fieldSize.height;
pdfPage.drawText(text, {
x: positionX,
y: pdfPage.getHeight() - positionY - textHeight / 2,
y: invertedYPosition,
size: textSize,
font: useHandwritingFont ? customFont : helveticaFont,
color: rgb(0, 0, 0),