JohnHancock
Saving signatures has never been easier!
Installation
Add this line to your application's Gemfile:
gem 'john_hancock'
And then execute:
$ bundle
Or install it yourself as:
$ gem install john_hancock
Setup (< Rails 7)
With the gem installed, simply include it in the relevant JS manifest
//= require john_hancock
Setup (Rails 7 and above using Import Maps)
- In config/initializers/assets.rb add:
Rails.application.config.assets.precompile += %w(john_hancock.js)
- In config/importmap.rb add:
pin "john_hancock", to: 'john_hancock.js', preload: true
- Lastly, in app/javascript/application.js:
import "john_hancock"
Usage
Then you are free to use it in the view
<%= form_for @user do |f| %>
<%= f.signature_field :signature %>
<%= f.submit %>
<% end %>
Once this is saved, you can output the string as an image.
<%= image_tag @user.signature %>
The signature_field method generates a canvas as well as a hidden field. If you would like more flexibility in the placement of these elements you can use them separately.
<%= form_for @user do |f| %>
<%= f.signature_canvas %>
<p>some text about the form</p>
<%= f.hidden_signature_field :signature %>
<%= f.submit %>
<% end %>
Example
Credit
This gem is maintained by Brandon Lawrence and Ben Miller.
The underlying JS library, Signature Pad, is written by Thomas J Bradley.
Contributing
Bug reports and pull requests are welcome on GitHub at https://github.com/Brantron/john_hancock.
License
The gem is available as open source under the terms of the MIT License.