zgapdfsigner/test.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Test for ZgaPdfSigner </title>
<script src="https://unpkg.com/pdf-lib@1.17.1/dist/pdf-lib.min.js" type="text/javascript"></script>
<script src="https://unpkg.com/@pdf-lib/fontkit/dist/fontkit.umd.min.js" type="text/javascript"></script>
<script src="https://unpkg.com/node-forge@1.3.1/dist/forge.min.js" type="text/javascript"></script>
<script src="dist/zgapdfsigner.min.js" type="text/javascript"></script>
<script type="text/javascript">
/**
 * @param {string} fid
 * @return {Promise<ArrayBuffer>}
 */
function readFile(fid){
	return new Promise((resolve, reject) => {
		var f = document.getElementById(fid).files[0];
		if(f){
			var reader = new FileReader();
			reader.onload = function(a_evt){
				resolve(a_evt.target.result);
			};
			reader.readAsArrayBuffer(f);
		}else{
			resolve(null);
		}
	});
}
/**
 * @param {string} fid
 * @return {string}
 */
function getFilExt(fid){
	var n = document.getElementById(fid).files[0].name;
	var i = n.lastIndexOf(".");
	if(i >= 0){
		return n.slice(i + 1);
	}else{
		return null;
	}
}
async function testMe(){
	/** @type {ArrayBuffer} */
	var pdf = await readFile("fff");
	if(!pdf){
		alert("The target pdf is not specified.");
		return;
	}

	/** @type {ArrayBuffer} */
	var pfx = await readFile("kkk");
	/** @type {string} */
	var ps = document.getElementById("pwd").value;
	if(pfx && !ps){
		alert("The passphrase is not specified.");
		return;
	}

	/** @type {ArrayBuffer} */
	var img = await readFile("img");
	/** @type {string} */
	var imgType = "";
	if(img){
		imgType = getFilExt("img");
	}
	/** @type {string} */
	var txt = document.getElementById("txt").value;
	/** @type {ArrayBuffer} */
	var font = await readFile("font");

	/** @type {ArrayBuffer} */
	var pubcert = await readFile("pubcert");
	/** @type {string} */
	var upwd = document.getElementById("upwd").value;

	/** @type {SignOption} */
	var sopt = null;
	if(pfx){
		sopt = {
			p12cert: pfx,
			pwd: ps,
			permission: parseInt(document.getElementById("sperm").value),
			reason: document.getElementById("tReason").value,
			location: document.getElementById("tLocation").value,
			contact: document.getElementById("tContact").value,
			debug: true,
		};
		if(img || txt){
			sopt.drawinf = {
				area: {
					x: 25, // left
					y: 150, // top
					w: txt ? undefined : 60,
					h: txt ? undefined : 100,
				},
				pageidx: "-",
				imgInfo: img ? {
					imgData: img,
					imgType: imgType,
				} : undefined,
				textInfo: txt ? {
					text: txt,
					fontData: font,
					color: "f00",
					size: 16,
					align: 2,
					wMax: 80,
					yOffset: 10,
					xOffset: 20,
					noBreaks: "[あいうえおA-Za-z0-9]",
				} : undefined,
			};
		}
	}

	/** @type {EncryptOption} */
	var eopt = undefined;
	if(pubcert || upwd){
		eopt = {
			mode: parseInt(document.getElementById("mode").value),
			permissions: [],
		};
		Array.from(document.getElementsByName("perms")).forEach((a_chk) => {
			if(!a_chk.checked){
				eopt.permissions.push(a_chk.value);
			}
		});
		if(pubcert){
			eopt.pubkeys = [{
				c: pubcert,
			}];
		}else if(upwd){
			eopt.userpwd = upwd;
		}
	}

	/** @type {Uint8Array} */
	var u8dat = null;
	if(sopt){
		/** @type {Zga.PdfSigner} */
		var ser = new Zga.PdfSigner(sopt);
		u8dat = await ser.sign(pdf, eopt);
	}else if(eopt){
		/** @type {Zga.PdfCryptor} */
		var crypr = new Zga.PdfCryptor(eopt);
		/** @type {PDFLib.PDFDocument} */
		var pdfdoc = await crypr.encryptPdf(pdf);
		u8dat = await pdfdoc.save({"useObjectStreams": false});
	}else{
		alert("Nothing to do.");
		return;
	}

	document.getElementById("download").download = "test_test.pdf";
	document.getElementById("download").href = window.URL.createObjectURL(new Blob([u8dat], {"type" : "application/pdf"}));
	document.getElementById("download").click();
}
function test(){
	testMe().catch((err) => {
		console.error(err);
		alert(err.message);
	});
}
function clearFiles(){
	["fff","kkk","img","font","pubcert"].forEach((a_id) => {
		document.getElementById(a_id).value = "";
	});
}
function changeSperm(){
	/** @type {Element} */
	var sel = window.event.currentTarget || window.event.srcElement || window.event.target;
	/** @type {Element} */
	var spn = document.getElementById("spcmt");
	switch(sel.value){
	case "1":
		spn.innerText = "No changes to the document are permitted; any change to the document invalidates the signature.";
		break;
	case "2":
		spn.innerText = "Permitted changes are filling in forms, instantiating page templates, and signing; other changes invalidate the signature.";
		break;
	case "3":
		spn.innerText = "Permitted changes are the same as for 2, as well as annotation creation, deletion, and modification; other changes invalidate the signature.";
		break;
	default:
		spn.innerText = "";
		break;
	}
}
</script>
<style>
body {
	line-height: 1.5em;
}
span.header {
	font-weight: bold;
	color: blue;
}
</style>
</head>
<body>
<label>pdf </label><input type="file" id="fff" /><br />
<hr />
<span class="header">Sign the PDF:</span><br />
<label>certificate </label><input type="file" id="kkk" /><br />
<label>passphrase </label><input type="password" id="pwd" /><br />
<label>signature image </label><input type="file" id="img" /><br />
<label>signature text </label><input type="text" id="txt" /><br />
<label>text font </label><input type="file" id="font" /><br />
<label>permission </label>
<select id="sperm" onchange="changeSperm()">
<option value="0">No DocMDP</option>
<option value="1">DocMDP pattern 1</option>
<option value="2">DocMDP pattern 2</option>
<option value="3">DocMDP pattern 3</option>
</select>
<span id="spcmt"></span><br />
<label>reason </label><input type="text" id="tReason" value="I have a test reason." /><br />
<label>location </label><input type="text" id="tLocation" value="I am on the earth." /><br />
<label>contact </label><input type="text" id="tContact" value="zga@zga.com" /><br />
<hr />
<span class="header">Encrypt the PDF:</span><br />
<label>encryption </label>
<select id="mode">
<option value="0">RC4-40</option>
<option value="1">RC4-128</option>
<option value="2">AES-128</option>
<option value="3">AES-256</option>
</select><br />
<label>user password </label><input type="password" id="upwd" /><br />
<label>public certificate </label><input type="file" id="pubcert" /><br />
<label>permissions: </label><br />
<input type="checkbox" id="pCopy" name="perms" value="copy" checked><label for="pCopy">"copy": Copy text and graphics from the document. (Only valid on public-key mode)</label><br />
<input type="checkbox" id="pPrint" name="perms" value="print" checked><label for="pPrint">"print": Print the document.</label><br />
<input type="checkbox" id="pModify" name="perms" value="modify" checked><label for="pModify">"modify": Modify the contents of the document by operations other than those controlled by 'fill-forms', 'extract' and 'assemble'.</label><br />
<input type="checkbox" id="pCopyExtract" name="perms" value="copy-extract" checked><label for="pCopyExtract">"copy-extract": Copy or otherwise extract text and graphics from the document.</label><br />
<input type="checkbox" id="pAnnotForms" name="perms" value="annot-forms" checked><label for="pAnnotForms">"annot-forms": Add or modify text annotations, fill in interactive form fields, and, if 'modify' is also set, create or modify interactive form fields (including signature fields).</label><br />
<input type="checkbox" id="pFillForms" name="perms" value="fill-forms" checked><label for="pFillForms">"fill-forms": Fill in existing interactive form fields (including signature fields), even if 'annot-forms' is not specified.</label><br />
<input type="checkbox" id="pExtract" name="perms" value="extract" checked><label for="pExtract">"extract": Extract text and graphics (in support of accessibility to users with disabilities or for other purposes).</label><br />
<input type="checkbox" id="pAssemble" name="perms" value="assemble" checked><label for="pAssemble">"assemble": Assemble the document (insert, rotate, or delete pages and create bookmarks or thumbnail images), even if 'modify' is not set.</label><br />
<input type="checkbox" id="pPrintHigh" name="perms" value="print-high" checked><label for="pPrintHigh">"print-high": Print the document to a representation from which a faithful digital copy of the PDF content could be generated. When this is not set, printing is limited to a low-level representation of the appearance, possibly of degraded quality.</label><br />
<hr />
<input type="button" value="test" onclick="test()" />
<input type="button" value="clear files" onclick="clearFiles()" />
<a id="download" href="#" download="" style="display: none;" target="_blank">dummy</a>
</body>
</html>
The first commit. 2022-09-17 14:55:09 +02:00			`<!DOCTYPE html>`
			`<html lang="en">`
			`<head>`
			`<meta http-equiv="content-type" content="text/html; charset=UTF-8">`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0">`
			`<title> Test for ZgaPdfSigner </title>`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`<script src="https://unpkg.com/pdf-lib@1.17.1/dist/pdf-lib.min.js" type="text/javascript"></script>`
Fixed a bug of break line. 2024-08-10 13:12:19 +02:00			`<script src="https://unpkg.com/@pdf-lib/fontkit/dist/fontkit.umd.min.js" type="text/javascript"></script>`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`<script src="https://unpkg.com/node-forge@1.3.1/dist/forge.min.js" type="text/javascript"></script>`
			`<script src="dist/zgapdfsigner.min.js" type="text/javascript"></script>`
The first commit. 2022-09-17 14:55:09 +02:00			`<script type="text/javascript">`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`/**`
			`* @param {string} fid`
			`* @return {Promise<ArrayBuffer>}`
			`*/`
			`function readFile(fid){`
			`return new Promise((resolve, reject) => {`
			`var f = document.getElementById(fid).files[0];`
			`if(f){`
			`var reader = new FileReader();`
			`reader.onload = function(a_evt){`
			`resolve(a_evt.target.result);`
			`};`
			`reader.readAsArrayBuffer(f);`
			`}else{`
			`resolve(null);`
			`}`
			`});`
The first commit. 2022-09-17 14:55:09 +02:00			`}`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`/**`
			`* @param {string} fid`
			`* @return {string}`
			`*/`
			`function getFilExt(fid){`
			`var n = document.getElementById(fid).files[0].name;`
The first commit. 2022-09-17 14:55:09 +02:00			`var i = n.lastIndexOf(".");`
			`if(i >= 0){`
			`return n.slice(i + 1);`
			`}else{`
			`return null;`
			`}`
			`}`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`async function testMe(){`
			`/** @type {ArrayBuffer} */`
			`var pdf = await readFile("fff");`
			`if(!pdf){`
			`alert("The target pdf is not specified.");`
			`return;`
			`}`

			`/** @type {ArrayBuffer} */`
			`var pfx = await readFile("kkk");`
			`/** @type {string} */`
			`var ps = document.getElementById("pwd").value;`
			`if(pfx && !ps){`
			`alert("The passphrase is not specified.");`
			`return;`
			`}`

			`/** @type {ArrayBuffer} */`
			`var img = await readFile("img");`
			`/** @type {string} */`
			`var imgType = "";`
			`if(img){`
			`imgType = getFilExt("img");`
			`}`
Fixed a bug of break line. 2024-08-10 13:12:19 +02:00			`/** @type {string} */`
			`var txt = document.getElementById("txt").value;`
			`/** @type {ArrayBuffer} */`
			`var font = await readFile("font");`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00
			`/** @type {ArrayBuffer} */`
			`var pubcert = await readFile("pubcert");`
			`/** @type {string} */`
			`var upwd = document.getElementById("upwd").value;`

			`/** @type {SignOption} */`
			`var sopt = null;`
			`if(pfx){`
			`sopt = {`
			`p12cert: pfx,`
			`pwd: ps,`
			`permission: parseInt(document.getElementById("sperm").value),`
			`reason: document.getElementById("tReason").value,`
			`location: document.getElementById("tLocation").value,`
			`contact: document.getElementById("tContact").value,`
			`debug: true,`
			`};`
Fixed a bug of break line. 2024-08-10 13:12:19 +02:00			`if(img \|\| txt){`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`sopt.drawinf = {`
			`area: {`
			`x: 25, // left`
			`y: 150, // top`
Fixed a bug of break line. 2024-08-10 13:12:19 +02:00			`w: txt ? undefined : 60,`
			`h: txt ? undefined : 100,`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`},`
Fixed a bug of break line. 2024-08-10 13:12:19 +02:00			`pageidx: "-",`
			`imgInfo: img ? {`
			`imgData: img,`
			`imgType: imgType,`
			`} : undefined,`
			`textInfo: txt ? {`
			`text: txt,`
			`fontData: font,`
			`color: "f00",`
			`size: 16,`
			`align: 2,`
			`wMax: 80,`
			`yOffset: 10,`
			`xOffset: 20,`
			`noBreaks: "[あいうえおA-Za-z0-9]",`
			`} : undefined,`
The first commit. 2022-09-17 14:55:09 +02:00			`};`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`}`
			`}`

			`/** @type {EncryptOption} */`
			`var eopt = undefined;`
			`if(pubcert \|\| upwd){`
			`eopt = {`
			`mode: parseInt(document.getElementById("mode").value),`
			`permissions: [],`
			`};`
			`Array.from(document.getElementsByName("perms")).forEach((a_chk) => {`
			`if(!a_chk.checked){`
			`eopt.permissions.push(a_chk.value);`
The first commit. 2022-09-17 14:55:09 +02:00			`}`
			`});`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`if(pubcert){`
			`eopt.pubkeys = [{`
			`c: pubcert,`
			`}];`
			`}else if(upwd){`
			`eopt.userpwd = upwd;`
			`}`
			`}`

			`/** @type {Uint8Array} */`
			`var u8dat = null;`
			`if(sopt){`
			`/** @type {Zga.PdfSigner} */`
			`var ser = new Zga.PdfSigner(sopt);`
			`u8dat = await ser.sign(pdf, eopt);`
			`}else if(eopt){`
			`/** @type {Zga.PdfCryptor} */`
			`var crypr = new Zga.PdfCryptor(eopt);`
			`/** @type {PDFLib.PDFDocument} */`
			`var pdfdoc = await crypr.encryptPdf(pdf);`
			`u8dat = await pdfdoc.save({"useObjectStreams": false});`
			`}else{`
			`alert("Nothing to do.");`
			`return;`
			`}`

			`document.getElementById("download").download = "test_test.pdf";`
			`document.getElementById("download").href = window.URL.createObjectURL(new Blob([u8dat], {"type" : "application/pdf"}));`
			`document.getElementById("download").click();`
			`}`
			`function test(){`
			`testMe().catch((err) => {`
			`console.error(err);`
			`alert(err.message);`
			`});`
			`}`
			`function clearFiles(){`
Fixed a bug of break line. 2024-08-10 13:12:19 +02:00			`["fff","kkk","img","font","pubcert"].forEach((a_id) => {`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`document.getElementById(a_id).value = "";`
The first commit. 2022-09-17 14:55:09 +02:00			`});`
			`}`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`function changeSperm(){`
			`/** @type {Element} */`
			`var sel = window.event.currentTarget \|\| window.event.srcElement \|\| window.event.target;`
			`/** @type {Element} */`
			`var spn = document.getElementById("spcmt");`
			`switch(sel.value){`
			`case "1":`
			`spn.innerText = "No changes to the document are permitted; any change to the document invalidates the signature.";`
			`break;`
			`case "2":`
			`spn.innerText = "Permitted changes are filling in forms, instantiating page templates, and signing; other changes invalidate the signature.";`
			`break;`
			`case "3":`
			`spn.innerText = "Permitted changes are the same as for 2, as well as annotation creation, deletion, and modification; other changes invalidate the signature.";`
			`break;`
			`default:`
			`spn.innerText = "";`
			`break;`
			`}`
			`}`
The first commit. 2022-09-17 14:55:09 +02:00			`</script>`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`<style>`
			`body {`
			`line-height: 1.5em;`
			`}`
			`span.header {`
			`font-weight: bold;`
			`color: blue;`
			`}`
			`</style>`
The first commit. 2022-09-17 14:55:09 +02:00			`</head>`
			`<body>`
			`<label>pdf </label><input type="file" id="fff" /><br />`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`<hr />`
			`<span class="header">Sign the PDF:</span><br />`
The first commit. 2022-09-17 14:55:09 +02:00			`<label>certificate </label><input type="file" id="kkk" /><br />`
			`<label>passphrase </label><input type="password" id="pwd" /><br />`
			`<label>signature image </label><input type="file" id="img" /><br />`
Fixed a bug of break line. 2024-08-10 13:12:19 +02:00			`<label>signature text </label><input type="text" id="txt" /><br />`
			`<label>text font </label><input type="file" id="font" /><br />`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`<label>permission </label>`
			`<select id="sperm" onchange="changeSperm()">`
			`<option value="0">No DocMDP</option>`
			`<option value="1">DocMDP pattern 1</option>`
			`<option value="2">DocMDP pattern 2</option>`
			`<option value="3">DocMDP pattern 3</option>`
			`</select>`
			`<span id="spcmt"></span><br />`
			`<label>reason </label><input type="text" id="tReason" value="I have a test reason." /><br />`
			`<label>location </label><input type="text" id="tLocation" value="I am on the earth." /><br />`
			`<label>contact </label><input type="text" id="tContact" value="zga@zga.com" /><br />`
			`<hr />`
			`<span class="header">Encrypt the PDF:</span><br />`
			`<label>encryption </label>`
			`<select id="mode">`
			`<option value="0">RC4-40</option>`
			`<option value="1">RC4-128</option>`
			`<option value="2">AES-128</option>`
			`<option value="3">AES-256</option>`
			`</select><br />`
			`<label>user password </label><input type="password" id="upwd" /><br />`
			`<label>public certificate </label><input type="file" id="pubcert" /><br />`
			`<label>permissions: </label><br />`
			`<input type="checkbox" id="pCopy" name="perms" value="copy" checked><label for="pCopy">"copy": Copy text and graphics from the document. (Only valid on public-key mode)</label><br />`
			`<input type="checkbox" id="pPrint" name="perms" value="print" checked><label for="pPrint">"print": Print the document.</label><br />`
			`<input type="checkbox" id="pModify" name="perms" value="modify" checked><label for="pModify">"modify": Modify the contents of the document by operations other than those controlled by 'fill-forms', 'extract' and 'assemble'.</label><br />`
			`<input type="checkbox" id="pCopyExtract" name="perms" value="copy-extract" checked><label for="pCopyExtract">"copy-extract": Copy or otherwise extract text and graphics from the document.</label><br />`
			`<input type="checkbox" id="pAnnotForms" name="perms" value="annot-forms" checked><label for="pAnnotForms">"annot-forms": Add or modify text annotations, fill in interactive form fields, and, if 'modify' is also set, create or modify interactive form fields (including signature fields).</label><br />`
			`<input type="checkbox" id="pFillForms" name="perms" value="fill-forms" checked><label for="pFillForms">"fill-forms": Fill in existing interactive form fields (including signature fields), even if 'annot-forms' is not specified.</label><br />`
			`<input type="checkbox" id="pExtract" name="perms" value="extract" checked><label for="pExtract">"extract": Extract text and graphics (in support of accessibility to users with disabilities or for other purposes).</label><br />`
			`<input type="checkbox" id="pAssemble" name="perms" value="assemble" checked><label for="pAssemble">"assemble": Assemble the document (insert, rotate, or delete pages and create bookmarks or thumbnail images), even if 'modify' is not set.</label><br />`
			`<input type="checkbox" id="pPrintHigh" name="perms" value="print-high" checked><label for="pPrintHigh">"print-high": Print the document to a representation from which a faithful digital copy of the PDF content could be generated. When this is not set, printing is limited to a low-level representation of the appearance, possibly of degraded quality.</label><br />`
			`<hr />`
The first commit. 2022-09-17 14:55:09 +02:00			`<input type="button" value="test" onclick="test()" />`
Added support to DocMDP and improved the way of appending TSA timestamp. 2022-10-14 14:12:43 +02:00			`<input type="button" value="clear files" onclick="clearFiles()" />`
			`<a id="download" href="#" download="" style="display: none;" target="_blank">dummy</a>`
The first commit. 2022-09-17 14:55:09 +02:00			`</body>`
			`</html>`