<?php
  $creds = json_decode(file_get_contents('/etc/menlo/conf/test_page_secrets', false), true);
  $site_key = $creds['recaptcha_v2_invisible']['site_key'];
?>
<html>
  <head>
    <title>reCAPTCHA v2 invisible: Automatically binding the challenge to a button</title>
    <!-- See https://developers.google.com/recaptcha/docs/invisible#auto_render. -->
    <script>
      function onloadCallback() {
        document.getElementById("submit_button").disabled = false;
      }

      function onRecaptchaComplete(token) {
        document.getElementById("demo-form").submit();
      }
    </script>
  </head>
  <body>
    <form id="demo-form" action="verify_token.php" method="POST">
      <!-- reCAPTCHA creates a <div> as a sibling of the button when it
        searches for elements with class="g-recaptcha", and puts a
        <div class=grecaptcha-badge> inside it which contains a <textarea
        id=g-recaptcha-response> which is where the response value is
        filled in by the recaptcha code. -->
      <!-- Using class="g-recaptcha" on the button causes reCAPTCHA to
        automatically bind to it. -->
      <button id="submit_button"
              class="g-recaptcha"
              disabled
              data-sitekey="<?php echo $site_key ?>"
              data-callback="onRecaptchaComplete">Submit</button>
    </form>
    <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback" async defer></script>
  </body>
</html>
