/* * 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/. */ var activeDrawImage; var signaturePadCallback = function () {}; var clientSignatureSvg = ""; function getStampSvg(callback) { getStampSvgWithValues({ name: getStorage("notary_name"), location: getStorage("notary_location"), expires: getStorage("notary_expires"), idnumber: getStorage("notary_idnumber"), state: getStorage("notary_state") }, callback); } function getStampSvgWithValues(values, callback) { $.get("templates/stamps/" + values.state + ".svg", {}, function (data) { data = data + ""; data = data.replaceAll("[[[NAME]]]", values.name); data = data.replaceAll("[[[LOCATION]]]", values.location); data = data.replaceAll("[[[EXPIRES]]]", values.expires); data = data.replaceAll("[[[IDNUMBER]]]", values.idnumber); callback(data); }, "text"); } function makeStampImage(callback) { getStampSvg(function (data) { svgToImage(data, function (err, image) { if (err) { callback(false); return; } callback(image); }); }); } function activateTextTool() { var text = prompt(""); if (text == "") { return; } var canvas = document.createElement('canvas'); canvas.width = 2000; canvas.height = 400; var ctx = canvas.getContext('2d'); ctx.font = "50px sans-serif"; ctx.fillText(text, 0, 50); const image = new Image(); image.src = canvas.toDataURL(); image.width = 500; image.height = 100; activeDrawImage = image; image.onload = function () { enableGuideBox(activeDrawImage); }; } function activateStampDrawTool() { makeStampImage(function (image) { activeDrawImage = image; enableGuideBox(image); }); } function activateNotarySignatureTool() { if (!inStorage("notary_signature")) { alert("Please set a notary signature in the settings."); return; } svgToImage(getStorage("notary_signature"), function (err, image) { if (err) { callback(false); return; } activeDrawImage = image; enableGuideBox(image); }); } function activateNotaryCertificateTool() { initCertificateBuilder(); certificateBuilderCallback = function () { getCertificateSvg(function (svg) { svgToImage(svg, function (err, image) { if (err) { console.error(err); return; } activeDrawImage = image; enableGuideBox(image); }); }); }; } function activateClientSignaturePad() { initSignaturePad(); signaturePadCallback = function () { if (clientSignatureSvg != "" && signaturePad.isEmpty()) { var signature = clientSignatureSvg; } else { var signature = signaturePad.toDataURL("image/svg+xml"); signature = signature.replace("data:image/svg+xml;base64,", ""); signature = atob(signature); signature = trimAndShrinkSVG(signature); clientSignatureSvg = signature; } svgToImage(signature, function (err, image) { if (err) { callback(false); return; } activeDrawImage = image; enableGuideBox(image); }); }; } function drawImageFromUrl(x, y, width, height, src, canvas) { var ctx = canvas.getContext("2d"); const image = new Image(); image.src = src; image.onload = () => { ctx.drawImage(image, x, y, width, height); } } function drawImage(x, y, width, height, image, canvas) { var ctx = canvas.getContext("2d"); ctx.drawImage(image, x, y, width, height); } $("#page-canvas-container").on("click", ".page-canvas", function (evt) { $("#page-canvas-container .page-canvas").removeClass("active"); $(this).addClass("active"); evt.stopPropagation(); }); $("body").on("click", "#page-canvas-container", function (evt) { $("#page-canvas-container .page-canvas").removeClass("active"); disableGuideBox(); }); $("#page-canvas-container").on("click", ".page-canvas.active", function (evt) { if (typeof activeDrawImage == "undefined" || activeDrawImage == null) { return; } var canvas = $(this)[0]; var coords = getMousePos(canvas, evt); var imageWidth = (activeDrawImage.width / 96) * pdfAssumedDPI * pdfPageScale; var imageHeight = (activeDrawImage.height / 96) * pdfAssumedDPI * pdfPageScale; drawImage(coords.x, coords.y, imageWidth, imageHeight, activeDrawImage, canvas); }); function enableGuideBox(image, scalecorrectionfactor) { if (typeof scalecorrectionfactor == "undefined") { scalecorrectionfactor = 1; } var context = $("#placementguidebox")[0].getContext('2d'); context.clearRect(0, 0, $("#placementguidebox")[0].width, $("#placementguidebox")[0].height); $("#placementguidebox").css("display", ""); // calculate size of guide image var pageWidthPx = $("#page-canvas-container .page-canvas")[0].getContext("2d").canvas.width; var pageCanvasCurrentWidthPx = $("#page-canvas-container .page-canvas").css("width").replace("px", "") * 1; var pageWidthInches = pageWidthPx / (pdfAssumedDPI * pdfPageScale); var canvasCurrentDPI = pageCanvasCurrentWidthPx / pageWidthInches; var imageWidth = (image.width / (96 * scalecorrectionfactor)) * canvasCurrentDPI; var imageHeight = (image.height / (96 * scalecorrectionfactor)) * canvasCurrentDPI; var canvas = $("#placementguidebox")[0]; var ctx = canvas.getContext("2d"); ctx.drawImage(image, 0, 0, imageWidth, imageHeight); } function disableGuideBox() { $("#placementguidebox").css("display", "none"); var context = $("#placementguidebox")[0].getContext('2d'); context.clearRect(0, 0, $("#placementguidebox")[0].width, $("#placementguidebox")[0].height); activeDrawImage = null; } $("#page-canvas-container").on("mousemove", function (e) { var posx = 0; var posy = 0; posx = e.pageX + $("#page-canvas-container").scrollLeft() - $("#page-canvas-container").offset().left; posy = e.pageY + $("#page-canvas-container").scrollTop() - $("#page-canvas-container").offset().top; $("#placementguidebox").css({ left: posx, top: posy }); }); /** * https://stackoverflow.com/a/17130415 * @param {type} canvas * @param {type} evt * @returns {getMousePos.pdfAnonym$1} */ function getMousePos(canvas, evt) { var rect = canvas.getBoundingClientRect(), // abs. size of element scaleX = canvas.width / rect.width, // relationship bitmap vs. element for X scaleY = canvas.height / rect.height; // relationship bitmap vs. element for Y return { x: (evt.clientX - rect.left) * scaleX, // scale mouse coordinates after they have y: (evt.clientY - rect.top) * scaleY // been adjusted to be relative to element } } // Hide it at start // doesn't work in CSS because of reasons disableGuideBox();