You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
156 lines
9.6 KiB
HTML
156 lines
9.6 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
Copyright 2021 Netsyms Technologies.
|
|
This Source Code Form is subject to the terms of the Mozilla Public
|
|
License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
|
-->
|
|
<title>IPENtool</title>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css" />
|
|
<link rel="stylesheet" href="node_modules/@fortawesome/fontawesome-free/css/all.min.css" />
|
|
<link rel="stylesheet" href="css/main.css" />
|
|
<link rel="icon" href="img/icon.svg" />
|
|
|
|
<div class="modal fade" id="settingsModal" tabindex="-1" aria-labelledby="settingsModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="settingsModalLabel">Settings</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<div class="col-12 col-lg-6">
|
|
<h4><i class="fas fa-address-card"></i> Notary Profile</h4>
|
|
Name: <input class="form-control" type="text" id="notary_name" />
|
|
Location (county/residing at): <input class="form-control" type="text" id="notary_location" />
|
|
Commission expiration: <input class="form-control" type="text" id="notary_expires" />
|
|
Commission number: <input class="form-control" type="text" id="notary_idnumber" />
|
|
State: <select class="form-control" id="notary_state">
|
|
<option selected></option>
|
|
<option value="mt">Montana</option>
|
|
</select>
|
|
<br>
|
|
Stamp Preview:<br>
|
|
<img src="" id="stamp-preview" />
|
|
<br>
|
|
Notary Signature:<br>
|
|
<img src="" id="signature-preview" /><br>
|
|
<div class="btn btn-primary m-1" onclick="activateNotarySignaturePad()"><i class="fas fa-signature"></i> Draw Signature</div>
|
|
</div>
|
|
<div class="col-12 col-lg-6">
|
|
<h4><i class="fas fa-user-lock"></i> Digital Signature</h4>
|
|
<p>
|
|
<b>MUST READ:</b> When you save a PDF with this tool, a cryptographic signature is attached.
|
|
This signature can be used to prove the PDF is unchanged since notarization,
|
|
and prove that you were the notary involved.
|
|
<br>
|
|
Signatures are generated using your private key, which you must keep secret.
|
|
Someone with the private key can modify a signed PDF without detection.
|
|
<b>Protect your private key like you protect your notary stamp/seal.</b>
|
|
<br>
|
|
A corresponding public key is also available; anyone with your public key can
|
|
verify you signed a document, but cannot do anything else.
|
|
It is recommended to post your public key somewhere public like a website.
|
|
This way, people can ensure documents are valid. It is also recommended to
|
|
<b>back up your private key</b> in case your computer malfunctions. This will ensure you don't need
|
|
to make a new one. A new key won't be able to verify older signatures or vice versa.
|
|
</p>
|
|
<div class="btn btn-primary m-1" onclick="loadKeyFromLocalStorageWithUserFeedback()"><i class="fas fa-unlock"></i> Create/unlock private key</div>
|
|
<div class="btn btn-primary m-1" onclick="unloadKey()"><i class="fas fa-lock"></i> Lock private key</div>
|
|
<div class="btn btn-primary m-1" onclick="exportPublicKey()"><i class="fas fa-file-export"></i> Export public key</div>
|
|
<br>
|
|
<div class="btn btn-danger m-1" onclick="exportPrivateKey()"><i class="fas fa-download"></i> Back up private key</div>
|
|
<div class="btn btn-danger m-1" onclick="importPrivateKey()"><i class="fas fa-upload"></i> Restore private key</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
|
<button type="button" class="btn btn-primary" onclick="saveSettingsModal()"><i class="fas fa-save"></i> Save Settings</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="signatureModal" tabindex="-1" aria-labelledby="signatureModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="signatureModalLabel">Signature Pad</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="btn btn-warning d-inline-block" onclick="resizeSignaturePadCanvas();signaturePad.clear();"><i class="fas fa-eraser"></i> Erase</div>
|
|
<div class="btn btn-primary" onclick="signaturePadUndo();"><i class="fas fa-undo"></i> Undo</div>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="signature-wrapper">
|
|
<img src="img/signature-line.svg" />
|
|
<canvas id="signaturecanvas"></canvas>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
|
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="signaturePadCallback()">Apply</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card d-flex flex-column h-100">
|
|
<div class="card-body">
|
|
<div class="btn-toolbar d-inline-block" role="toolbar">
|
|
<div class="btn-group me-2 mb-2" role="group" aria-label="First group">
|
|
<div class="btn btn-primary" onclick="addPDF();"><i class="fas fa-file-pdf"></i> Add PDF</div>
|
|
<div class="btn btn-primary" onclick="savePDF();"><i class="fas fa-save"></i> Save Signed PDF</div>
|
|
<div class="btn btn-primary" onclick="closePDF(true);"><i class="fas fa-trash"></i> Close PDF</div>
|
|
<div class="btn btn-primary" onclick="openSettingsModal();"><i class="fas fa-cog"></i> Settings</div>
|
|
</div>
|
|
</div>
|
|
<div class="d-inline-block"><span id="lockstatus" title="Private key locked"><i class="fas fa-lock"></i></span> <span id="statustext"></span></div>
|
|
<div class="btn-toolbar" role="toolbar">
|
|
<div class="btn-group me-2 mb-2" role="group" aria-label="First group">
|
|
<div class="btn btn-primary" onclick="pdfZoom('fitheight');"><i class="fas fa-arrows-alt-v"></i> Fit Height</div>
|
|
<div class="btn btn-primary" onclick="pdfZoom('fitwidth');"><i class="fas fa-arrows-alt-h"></i> Fit Width</div>
|
|
<div class="btn btn-primary" onclick="pdfZoom('out');"><i class="fas fa-search-minus"></i> Zoom Out</div>
|
|
<div class="btn btn-primary" onclick="pdfZoom('in');"><i class="fas fa-search-plus"></i> Zoom In</div>
|
|
</div>
|
|
<div class="btn-group me-2 mb-2" role="group" aria-label="Second group">
|
|
<div class="btn btn-primary" onclick="activateStampDrawTool()"><i class="fas fa-stamp"></i> Stamp/Seal</div>
|
|
<div class="btn btn-primary" onclick="activateClientSignaturePad()"><i class="fas fa-file-signature"></i> Sign (Client)</div>
|
|
<div class="btn btn-primary" onclick="activateNotarySignatureTool()"><i class="fas fa-file-signature"></i> Sign (Notary)</div>
|
|
<div class="btn btn-primary" onclick="disableGuideBox()">Cancel</div>
|
|
</div>
|
|
<div class="btn-group mb-2" role="group" aria-label="Third group">
|
|
<div class="btn btn-primary" onclick="addPage()"><i class="fas fa-plus"></i> Append Blank Page</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-body flex-grow-1 w-100 h-100 p-0 position-relative" id="page-canvas-container-container">
|
|
<div id="page-canvas-container" class="p-0 m-0">
|
|
<canvas id="placementguidebox" width="1000" height="1000"></canvas>
|
|
</div>
|
|
<div id="shadowbox"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="svgtrimbox"></div>
|
|
|
|
|
|
<script src="node_modules/jquery/dist/jquery.min.js"></script>
|
|
<script src="node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="node_modules/pdfjs-dist/build/pdf.min.js"></script>
|
|
<script src="node_modules/jspdf/dist/jspdf.umd.min.js"></script>
|
|
<script src="node_modules/signature_pad/dist/signature_pad.umd.min.js"></script>
|
|
<script src="js/kbpgp-2.1.15.js"></script>
|
|
<script src="js/svg-to-image.js"></script>
|
|
<script src="js/util.js"></script>
|
|
<script src="js/storage.js"></script>
|
|
<script src="js/filesystem.js"></script>
|
|
<script src="js/crypto.js"></script>
|
|
<script src="js/drawtools.js"></script>
|
|
<script src="js/pdf.js"></script>
|
|
<script src="js/main.js"></script> |