From 1da577feadfd06539698b662b974f48da70ac5f5 Mon Sep 17 00:00:00 2001
From: James Campos <james.r.campos@gmail.com>
Date: Thu, 1 Sep 2011 02:10:54 -0700
Subject: [PATCH] captcha caching

---
 4chan_x.user.js | 29 ++++++++++++++++++++++++++---
 script.coffee   | 22 +++++++++++++++++++---
 2 files changed, 45 insertions(+), 6 deletions(-)

diff --git a/4chan_x.user.js b/4chan_x.user.js
index ff01a9cd1..ba0814b3c 100644
--- a/4chan_x.user.js
+++ b/4chan_x.user.js
@@ -1234,11 +1234,15 @@
       QR.challengeNode({
         target: holder.firstChild
       });
-      return $.bind(window, 'message', QR.receive);
+      $.bind(window, 'message', QR.receive);
+      return $('#recaptcha_response_field').id = '';
     },
     challengeNode: function(e) {
+      var c;
+      c = e.target.value;
+      $('img', qr.el).src = "http://www.google.com/recaptcha/api/image?c=" + c;
       return QR.captcha = {
-        challenge: e.target.value,
+        challenge: c,
         time: Date.now()
       };
     },
@@ -1259,14 +1263,33 @@
       qr.el = ui.dialog('qr', {
         top: '0',
         left: '0'
-      }, "    <a class=close title=close>X</a><input type=checkbox id=autohide title=autohide>    <div class=move><input placeholder=Name name=name form=qr_form>Quick Reply</div>    <form enctype=multipart/form-data method=post action=http://sys.4chan.org/" + g.BOARD + "/post target=iframe id=qr_form>      <input type=hidden name=resto value=" + g.THREAD_ID + ">      <input type=hidden name=mode value=regist>      <input type=hidden name=recaptcha_challenge_field id=challenge>      <input type=hidden name=recaptcha_response_field id=response>      <div><input placeholder=Email name=email></div>      <div><input placeholder=Subject name=sub><button>Submit</button></div>      <div><textarea placeholder=Comment name=com>" + text + "</textarea></div>      <div><img src=http://www.google.com/recaptcha/api/image?c=" + QR.captcha.challenge + "></div>      <div><input placeholder=Verification autocomplete=off id=recaptcha_response_field ></div>      <div><input name=upfile type=file></div>      <div><input placeholder=Password name=pwd type=password></div>    </form>    <a class=error></a>    ");
+      }, "    <a class=close title=close>X</a><input type=checkbox id=autohide title=autohide>    <div class=move><input placeholder=Name name=name form=qr_form>Quick Reply</div>    <form enctype=multipart/form-data method=post action=http://sys.4chan.org/" + g.BOARD + "/post target=iframe id=qr_form>      <input type=hidden name=resto value=" + g.THREAD_ID + ">      <input type=hidden name=mode value=regist>      <input type=hidden name=recaptcha_challenge_field id=challenge>      <input type=hidden name=recaptcha_response_field id=response>      <div><input placeholder=Email name=email></div>      <div><input placeholder=Subject name=sub><button>Submit</button></div>      <div><textarea placeholder=Comment name=com>" + text + "</textarea></div>      <div><img src=http://www.google.com/recaptcha/api/image?c=" + QR.captcha.challenge + "></div>      <div><input placeholder=Verification autocomplete=off id=recaptcha_response_field><span id=cl>" + ($.get('captchas', []).length) + " captchas</span></div>      <div><input name=upfile type=file></div>      <div><input placeholder=Password name=pwd type=password></div>    </form>    <a class=error></a>    ");
       $.bind($('form', qr.el), 'submit', QR.submit);
+      $.bind($('#recaptcha_response_field', qr.el), 'keydown', QR.keydown);
       $.append(d.body, qr.el);
       ta = $('textarea', qr.el);
       l = text.length;
       ta.setSelectionRange(l, l);
       return ta.focus();
     },
+    keydown: function(e) {
+      var captcha, captchas;
+      if (!(e.keyCode === 13 && this.value)) {
+        return;
+      }
+      if ($('textarea', qr.el).value || $('[type=file]', qr.el).files.length) {
+        return;
+      }
+      e.preventDefault();
+      captcha = QR.captcha;
+      captcha.response = this.value;
+      captchas = $.get('captchas', []);
+      captchas.push(captcha);
+      $.set('captchas', captchas);
+      this.value = '';
+      Recaptcha.reload();
+      return this.nextSibling.textContent = captchas.length + ' captchas';
+    },
     submit: function(e) {
       $('#challenge', qr.el).value = QR.captcha.challenge;
       return $('#response', qr.el).value = $('#recaptcha_response_field', qr.el).value;
diff --git a/script.coffee b/script.coffee
index 8b09bbd45..2c5d8fc0e 100644
--- a/script.coffee
+++ b/script.coffee
@@ -970,9 +970,13 @@ QR =
     $.bind holder, 'DOMNodeInserted', QR.challengeNode
     QR.challengeNode target: holder.firstChild
     $.bind window, 'message', QR.receive
+    # nuke id so qr's field focuses on recaptcha reload, instead of normal form's
+    $('#recaptcha_response_field').id = ''
   challengeNode: (e) ->
+    c = e.target.value
+    $('img', qr.el).src = "http://www.google.com/recaptcha/api/image?c=#{c}"
     QR.captcha =
-      challenge: e.target.value
+      challenge: c
       time: Date.now()
   node: (root) ->
     quote = $ 'a.quotejs + a', root
@@ -993,18 +997,31 @@ QR =
       <div><input placeholder=Subject name=sub><button>Submit</button></div>
       <div><textarea placeholder=Comment name=com>#{text}</textarea></div>
       <div><img src=http://www.google.com/recaptcha/api/image?c=#{QR.captcha.challenge}></div>
-      <div><input placeholder=Verification autocomplete=off id=recaptcha_response_field ></div>
+      <div><input placeholder=Verification autocomplete=off id=recaptcha_response_field><span id=cl>#{$.get('captchas', []).length} captchas</span></div>
       <div><input name=upfile type=file></div>
       <div><input placeholder=Password name=pwd type=password></div>
     </form>
     <a class=error></a>
     "
     $.bind $('form', qr.el), 'submit', QR.submit
+    $.bind $('#recaptcha_response_field', qr.el), 'keydown', QR.keydown
     $.append d.body, qr.el
     ta = $ 'textarea', qr.el
     l = text.length
     ta.setSelectionRange l, l
     ta.focus()
+  keydown: (e) ->
+    return unless e.keyCode is 13 and @value #enter, captcha filled
+    return if $('textarea', qr.el).value or $('[type=file]', qr.el).files.length #not blank
+    e.preventDefault()
+    {captcha} = QR
+    captcha.response = @value
+    captchas = $.get 'captchas', []
+    captchas.push captcha
+    $.set 'captchas', captchas
+    @value = ''
+    Recaptcha.reload()
+    @nextSibling.textContent = captchas.length + ' captchas'
   submit: (e) ->
     $('#challenge', qr.el).value = QR.captcha.challenge
     $('#response',  qr.el).value = $('#recaptcha_response_field', qr.el).value
@@ -1015,7 +1032,6 @@ QR =
         data = JSON.stringify {textContent, href}
       parent.postMessage data, '*'
       location = 'about:blank'
-
   receive: (e) ->
     {data} = e
     if data