CFLib.org – Common Function Library Project

sigJsonToImage(jsonData)

Last updated October 7, 2011

author

James Moberg

Version: 1 | Requires: CF9 | Library: UtilityLib

Description:
Signature to Image is a simple ColdFusion script that will take the JSON output of Signature Pad (jQuery/HTML5 canvas-based signature pad) and generate an image object to be saved or displayed inline. (Useful when adding signatures via CFDocument since it doesn't render canvas elements.) Written to be consistent with the behavior of the original PHP script: http://thomasjbradley.ca/lab/signature-to-image More info on Signature Pad: http://thomasjbradley.ca/lab/signature-pad

Return Values:
Returns an image object.

Example:

<!--- Use Signature Pad to create a signature JSON packet
http://thomasjbradley.ca/lab/signature-pad --->


<CFSET TheImage = sigJsonToImage(Signature_Pad_JSON_Data)>

<CFIF IsImage(TheImage)>
     <!--- Display Image inline --->
     <cfimage action = "writeToBrowser" source="#TheImage#">

     <!--- Save file --->
     <cfset ImageWrite(TheImage, "c:\signature.png")>
</CFIF>

Parameters:

Name Description Required
jsonData String (JSON) output from Signature Pad Yes

Full UDF Source:

/**
 * A supplemental script for Signature Pad that generates an image of the signature's JSON output server-side.
 * 
 * @param jsonData 	 String (JSON) output from Signature Pad (Required)
 * @return Returns an image object. 
 * @author James Moberg (james@ssmedia.com) 
 * @version 1, October 7, 2011 
 */
function sigJsonToImage(jsonData){
	var options = structNew();
	var lineOptions = structNew();
	options["imagesize"] = listtoarray("198, 55");
	options["bgColour"] = '##ffffff';
	options["penWidth"] = 2;
	options["penColour"]  = '##145394';
	options["drawMultiplier"] = 12;
	if(ArrayLen(arguments) GTE 2 AND isStruct(arguments[2])) {
		structAppend(options, arguments[2], true);
	}
	if(NOT isarray(jsonData) AND isjson(jsonData)){
		jsonData = DeserializeJSON(jsonData);
	}
	if (NOT IsArray(jsonData)){
		return "";
	} else if (NOT isStruct(jsonData[1])){
		return "";
	} else if (NOT structKeyExists(jsonData[1], "lx")){
		return "";
	}
	img = ImageNew("", options["imagesize"][1] * val(options["drawMultiplier"]), options["imagesize"][2] * val(options["drawMultiplier"]), "ARGB");
	ImageSetBackgroundColor(img, options["bgColour"]);
	imageSetAntialiasing(img, "on");
	ImageSetDrawingColor(img, options["penColour"]);
		
	lineOptions["width"] = options["penWidth"] * (options["drawMultiplier"] / 2);
	lineOptions["endcaps"] = "round";
	lineOptions["lineJoins"] = "round";  /* use join for CF9 */
	ImageSetDrawingStroke(img, lineOptions);

	for (v=1;v LTE ArrayLen(jsonData);v=v+1) {
		ImageDrawLine(img, jsonData[v].lx * val(options["drawMultiplier"]), jsonData[v].ly * val(options["drawMultiplier"]), jsonData[v].mx * val(options["drawMultiplier"]), jsonData[v].my * val(options["drawMultiplier"]));
	}

	ImageResize(img, options["imagesize"][1], options["imagesize"][2], "highPerformance");

	return img;
}
blog comments powered by Disqus

Search CFLib.org


Latest Additions

Kevin Cotton added
date2ExcelDate
May 5, 2016

Raymond Camden added
CapFirst
April 25, 2016

Chris Wigginton added
loremIpsum
January 18, 2016

Gary Stanton added
calculateArrival...
November 19, 2015

Sebastiaan Naafs - van Dijk added
getDaysInQuarter
November 13, 2015

Created by Raymond Camden / Design by Justin Johnson