Model release / contract e-signature step #6

Closed
opened 2026-07-07 21:38:33 -06:00 by jhodgkin · 0 comments
Owner

Goal

Step 5 — client reads the model release / session contract and signs it with a canvas signature. The signed PDF is generated server-side and emailed to both parties.

Frontend

  • Embed the contract PDF using PDF.js (rendered inline, not a download link)
  • Scrollable PDF viewer — Next button disabled until client has scrolled to the bottom
  • HTML5 canvas signature pad below the document
    • "Clear" button to redo the signature
    • Signature captured as base64 PNG
  • Client must type their full name to confirm identity
  • Submit sends { signaturePng, fullName, bookingId } to POST /api/bookings/:id/sign

Backend (POST /api/bookings/:id/sign)

  • Use pdf-lib to open the contract template PDF from api/contracts/model-release.pdf
  • Stamp the signature image and printed name onto the signature page
  • Stamp the date and booking ID
  • Save the signed PDF to api/signed-contracts/<bookingId>.pdf
  • Update booking record: contract_signed_at, contract_pdf_path
  • Trigger n8n webhook to email signed PDF to client and photographer

Contract template

  • Photographer provides api/contracts/model-release.pdf
  • Signature field position configurable in api/.env (CONTRACT_SIG_X, CONTRACT_SIG_Y, CONTRACT_SIG_PAGE)

Acceptance

  • Client can read full contract, sign, and submit
  • Signed PDF stored on disk with stamped signature
  • Booking record updated with signed timestamp
## Goal Step 5 — client reads the model release / session contract and signs it with a canvas signature. The signed PDF is generated server-side and emailed to both parties. ## Frontend - Embed the contract PDF using PDF.js (rendered inline, not a download link) - Scrollable PDF viewer — Next button disabled until client has scrolled to the bottom - HTML5 canvas signature pad below the document - "Clear" button to redo the signature - Signature captured as base64 PNG - Client must type their full name to confirm identity - Submit sends `{ signaturePng, fullName, bookingId }` to `POST /api/bookings/:id/sign` ## Backend (`POST /api/bookings/:id/sign`) - Use `pdf-lib` to open the contract template PDF from `api/contracts/model-release.pdf` - Stamp the signature image and printed name onto the signature page - Stamp the date and booking ID - Save the signed PDF to `api/signed-contracts/<bookingId>.pdf` - Update booking record: `contract_signed_at`, `contract_pdf_path` - Trigger n8n webhook to email signed PDF to client and photographer ## Contract template - Photographer provides `api/contracts/model-release.pdf` - Signature field position configurable in `api/.env` (`CONTRACT_SIG_X`, `CONTRACT_SIG_Y`, `CONTRACT_SIG_PAGE`) ## Acceptance - Client can read full contract, sign, and submit - Signed PDF stored on disk with stamped signature - Booking record updated with signed timestamp
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: jhodgkin/lisilou-portfolio#6