@raincatcher/step-signature

Signature generic step

FeedHenry RainCatcher generic step implementing signatures.

Setup

This module is packaged in a CommonJS format, exporting the name of the Angular namespace. The module can be included in an angular.js as follows:

Require the browserify dependency as an angular module

angular.module('app', [require('fh-wfm-signature').ngModule])

Client-side usage

Collecting signatures

The Base64 encoded signature will be assigned to the value attribute of the signature-form directive.

Default mime-type is image/png, however, this can be overriden by passing mime-type value via encoding attribute.

The image quality can also be adjusted by setting the image-quality attribute. See table below for details.

Name	Low	medium	High
image/jpeg	0.1	0.5	1
image/png	0.1	0.5	1
image/webp	0.1	0.5	1

<signature-form value="ctrl.model" encoding="image/jpeg" image-quality="0.5"></signature-form>

Displaying signatures

The src attribute of the image tag is bound to the value attribute of the signature tag. To display a base64 encoded string, prefix it with the string: data:image/png;base64,

<signature value="ctrl.model"></signature>

Signature CSS styles

Include the module SASS file in your application sass:

@import 'node_modules/@raincatcher/step-signature/lib/signature.scss

Directives

Name	Attributes
signature-form	value, options, encoding, image-quality
signature	value