AppOS module excerpt

recaptcha.coffee

class AppOS.Component.Recaptcha extends AppOS.Component
  name: "recaptcha"
  API_URL: "https://www.google.com/recaptcha/api.js?onload=%callback&render=explicit&hl=%hl"

  init: ->
    @pending = []
    @apiState = "unloaded"

    # init event
    $(document).on "recaptcha:init", (ev, el) =>
      if el
        @initRecaptcha(el)
      else
        $("div.g-recaptcha").each (i, el) => @initRecaptcha(el)

    # global callback for API
    window.AppOSRecaptchaAPILoaded = =>
      @apiState = "loaded" if @apiState == "loading"
      @_initElement(@pending.shift()) while @pending.length

  pageLoad: -> $(document).trigger("recaptcha:init")

  initRecaptcha: (el) ->
    if @apiState == "unloaded"
      @apiState = "loading"
      @pending.push(el)
      $.getScript(@API_URL.replace("%callback", "AppOSRecaptchaAPILoaded").replace("%hl", $(el).data("hl"))).fail =>
        @apiState = "blocked"
        window.AppOSRecaptchaAPILoaded()
    else if @apiState == "loading"
      @pending.push(el)
    else
      @_initElement(el)

  _initElement: (el) ->
    if @apiState == "blocked"
      $(el).html("<strong>Google ReCaptcha got blocked by your browser, login is not possible! Disable content blocking for this site.</strong>")
      return

    grecaptcha.render $(el).get(0),
      sitekey: $(el).data("sitekey")
      theme: $(el).data("theme") || "light"
      size: $(el).data("size") || "normal"