# Recaptcha Element

Getting Started | API | Elements | Actions | Validators | Handlers | Configuration Options | About

## Table of Contents

- 1 Recaptcha Element - #recaptcha{}

## 1 Recaptcha Element - #recaptcha{}

### Overview

The recaptcha element produces a recaptcha element. For more information about recaptchas you may refer to https://developers.google.com/recaptcha/

The element is rendered and evaluated by an external library.

The captcha is processed as follows:

- The user solves the captcha.
- If the solution is wrong the captcha gets refreshed until the user gives up or the solution is correct.
- If the solution is correct the Page:event callback is called.
- The return value of the Page:event callback is evaluated as follows:
  - If the value is 'ok' nothing is done.
  - If the return value is 'error', the captcha gets refreshed.
  - If the return value is {'error', Msg}, the captcha gets refreshed and the Msg is shown as the error message.

### Preparations

Before you can use the the recaptcha element, you have to register at https://www.google.com/recaptcha/admin/create.

After that you have to enter your credentials and link information into /rel/nitrogen/etc/app.config as follows:

    [
     {nitrogen, [
                 {recaptcha,
                  [{public_key, "recaptcha_public_key"},
                   {private_key, "recaptcha_private_key"},
                   {challenge_url, "http://www.google.com/recaptcha/api/challenge"},
                   {verify_url, "http://www.google.com/recaptcha/api/verify"}]}
                   ...
     ]},
     ...
    ].

### Usage

    #recaptcha { }

### Attributes

All attributes are optional

btn_id - (atom)
  The button's id
btn_label - (string)
  The button's label
captcha_opts - (proplist)
  The captcha's options. For more information visit https://developers.google.com/recaptcha/docs/customization

  custom_theme_widget is not supported

delegate (Module)
  The module where the event callback gets called
fail_body (List)
  The fail message. It can be a simple string or an array of element* items

### Example

Code in a page module may looks like this:

    inner_body() ->
        [
            #recaptcha{id=re_captcha, captcha_opts=[{theme,white}]},
        ].

    event({recaptcha, ok}) ->
        case check_user_input() of
            ok     -> wf:remove(re_captcha),
                      ok;
            error  -> {error, "FAIL!"}
        end.

    user_input() ->
    %% your check routine
    .

Date: 2012-10-18 03:24:50 CDT

Author: Steffen Panning

Org version 7.8.02 with Emacs version 23

Validate XHTML 1.0

## Comments

Note:To specify code blocks, just use the generic code block syntax:

    <pre><code>your code here</code></pre>

comments powered by Disqus