From b3f7a5a13860b4a94656834c8c6cf40afdde6ef3 Mon Sep 17 00:00:00 2001
From: James Campos <james.r.campos@gmail.com>
Date: Wed, 21 Sep 2011 14:46:25 -0700
Subject: [PATCH 1/4] #qr doesn't overflow-y anymore

---
 4chan_x.user.js | 2 --
 script.coffee   | 2 --
 2 files changed, 4 deletions(-)

diff --git a/4chan_x.user.js b/4chan_x.user.js
index 04d96c014..8818bef6c 100644
--- a/4chan_x.user.js
+++ b/4chan_x.user.js
@@ -3099,8 +3099,6 @@
         display: block;\
       }\
       #qr {\
-        max-height: 100%;\
-        overflow-y: auto;\
         position: fixed;\
       }\
       #qr #autohide, #qr .close {\
diff --git a/script.coffee b/script.coffee
index 8979e9c2a..10eba1ddb 100644
--- a/script.coffee
+++ b/script.coffee
@@ -2430,8 +2430,6 @@ Main =
         display: block;
       }
       #qr {
-        max-height: 100%;
-        overflow-y: auto;
         position: fixed;
       }
       #qr #autohide, #qr .close {

From 0c974d6556f42be8d8358f347894044700790239 Mon Sep 17 00:00:00 2001
From: James Campos <james.r.campos@gmail.com>
Date: Wed, 21 Sep 2011 16:20:48 -0700
Subject: [PATCH 2/4] - div / span, + ul / li

---
 4chan_x.user.js | 9 ++++++---
 script.coffee   | 9 ++++++---
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/4chan_x.user.js b/4chan_x.user.js
index 8818bef6c..5e87df49e 100644
--- a/4chan_x.user.js
+++ b/4chan_x.user.js
@@ -1258,7 +1258,7 @@
     attach: function() {
       var box, file, files;
       files = $('#files', QR.qr);
-      box = $.el('span', {
+      box = $.el('li', {
         innerHTML: "<input type=file name=upfile accept='" + QR.accept + "'><img alt='click here'><a class=x>X</a>"
       });
       file = $('input', box);
@@ -1371,7 +1371,7 @@
         text = '';
       }
       tid || (tid = g.THREAD_ID || '');
-      QR.qr = qr = ui.dialog('qr', 'top: 0; left: 0;', "    <a class=close>X</a>    <input type=checkbox id=autohide title=autohide>    <div class=move>      <span class=click>        <button>File</button>        <input form=qr_form placeholder=Name name=name>        <input form=qr_form placeholder=Email name=email>        <input form=qr_form placeholder=Subject name=sub>      </span>    </div>    <div class=autohide>      <textarea form=qr_form placeholder=Comment name=com></textarea>      <div id=files></div>      <form enctype=multipart/form-data method=post action=http://sys.4chan.org/" + g.BOARD + "/post target=iframe id=qr_form>        <div hidden>          <input name=pwd>          <input name=mode value=regist>          <input name=recaptcha_challenge_field id=challenge>          <input name=recaptcha_response_field id=response>        </div>        <div id=captcha>          <div><img></div>          <span id=cl>120 Captchas</span>          <input id=recaptcha_response_field autocomplete=off>        </div>        <div>          <button>Submit</button>          " + (g.REPLY ? "<label>[<input type=checkbox id=autopost title=autopost> Autopost]</label>" : '') + "          <input form=qr_form placeholder=Thread name=resto value=" + tid + " " + (g.REPLY ? 'hidden' : '') + ">          " + QR.spoiler + "        </div>      </form>    </div>    <a class=error></a>    ");
+      QR.qr = qr = ui.dialog('qr', 'top: 0; left: 0;', "    <a class=close>X</a>    <input type=checkbox id=autohide title=autohide>    <div class=move>      <span class=click>        <button>File</button>        <input form=qr_form placeholder=Name name=name>        <input form=qr_form placeholder=Email name=email>        <input form=qr_form placeholder=Subject name=sub>      </span>    </div>    <div class=autohide>      <textarea form=qr_form placeholder=Comment name=com></textarea>      <ul id=files></ul>      <form enctype=multipart/form-data method=post action=http://sys.4chan.org/" + g.BOARD + "/post target=iframe id=qr_form>        <div hidden>          <input name=pwd>          <input name=mode value=regist>          <input name=recaptcha_challenge_field id=challenge>          <input name=recaptcha_response_field id=response>        </div>        <div id=captcha>          <div><img></div>          <span id=cl>120 Captchas</span>          <input id=recaptcha_response_field autocomplete=off>        </div>        <div>          <button>Submit</button>          " + (g.REPLY ? "<label>[<input type=checkbox id=autopost title=autopost> Autopost]</label>" : '') + "          <input form=qr_form placeholder=Thread name=resto value=" + tid + " " + (g.REPLY ? 'hidden' : '') + ">          " + QR.spoiler + "        </div>      </form>    </div>    <a class=error></a>    ");
       c = d.cookie;
       $('[name=name]', qr).value = (m = c.match(/4chan_name=([^;]+)/)) ? decodeURIComponent(m[1]) : '';
       $('[name=email]', qr).value = (m = c.match(/4chan_email=([^;]+)/)) ? decodeURIComponent(m[1]) : '';
@@ -3129,9 +3129,12 @@
         width: 300px;\
         white-space: nowrap;\
         overflow: auto;\
+        margin: 0;\
+        padding: 0;\
       }\
-      #qr #files span {\
+      #qr #files li {\
         position: relative;\
+        display: inline;\
       }\
       #qr #files a {\
         position: absolute;\
diff --git a/script.coffee b/script.coffee
index 10eba1ddb..6c5132df8 100644
--- a/script.coffee
+++ b/script.coffee
@@ -972,7 +972,7 @@ QR =
   attach: ->
     #$('#autopost', QR.qr).checked = true
     files = $ '#files', QR.qr
-    box = $.el 'span',
+    box = $.el 'li',
       innerHTML: "<input type=file name=upfile accept='#{QR.accept}'><img alt='click here'><a class=x>X</a>"
     file = $ 'input', box
     $.bind file, 'change', QR.change
@@ -1060,7 +1060,7 @@ QR =
     </div>
     <div class=autohide>
       <textarea form=qr_form placeholder=Comment name=com></textarea>
-      <div id=files></div>
+      <ul id=files></ul>
       <form enctype=multipart/form-data method=post action=http://sys.4chan.org/#{g.BOARD}/post target=iframe id=qr_form>
         <div hidden>
           <input name=pwd>
@@ -2460,9 +2460,12 @@ Main =
         width: 300px;
         white-space: nowrap;
         overflow: auto;
+        margin: 0;
+        padding: 0;
       }
-      #qr #files span {
+      #qr #files li {
         position: relative;
+        display: inline;
       }
       #qr #files a {
         position: absolute;

From 0716c42a3372c5e6f6499ca37f5a9e2a397657d0 Mon Sep 17 00:00:00 2001
From: James Campos <james.r.campos@gmail.com>
Date: Wed, 21 Sep 2011 16:49:23 -0700
Subject: [PATCH 3/4] input { visibility: hidden; }

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

diff --git a/4chan_x.user.js b/4chan_x.user.js
index 5e87df49e..b79b7a565 100644
--- a/4chan_x.user.js
+++ b/4chan_x.user.js
@@ -3152,7 +3152,11 @@
         width: 100%;\
       }\
       #qr #files input {\
-        display: none;\
+        /* cannot use `display: none;`\
+        https://bugs.webkit.org/show_bug.cgi?id=58208\
+        http://code.google.com/p/chromium/issues/detail?id=78961\
+        */\
+        visibility: hidden;\
       }\
       #qr #files img {\
         max-height: 100px;\
diff --git a/script.coffee b/script.coffee
index 6c5132df8..03a55ed7e 100644
--- a/script.coffee
+++ b/script.coffee
@@ -2483,7 +2483,11 @@ Main =
         width: 100%;
       }
       #qr #files input {
-        display: none;
+        /* cannot use `display: none;`
+        https://bugs.webkit.org/show_bug.cgi?id=58208
+        http://code.google.com/p/chromium/issues/detail?id=78961
+        */
+        visibility: hidden;
       }
       #qr #files img {
         max-height: 100px;

From 0aeab06b7bc058b926dcb442110d0eb990c4878e Mon Sep 17 00:00:00 2001
From: James Campos <james.r.campos@gmail.com>
Date: Wed, 21 Sep 2011 19:13:38 -0700
Subject: [PATCH 4/4] vaguely works on chrom

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

diff --git a/4chan_x.user.js b/4chan_x.user.js
index b79b7a565..867191fc5 100644
--- a/4chan_x.user.js
+++ b/4chan_x.user.js
@@ -3134,7 +3134,10 @@
       }\
       #qr #files li {\
         position: relative;\
-        display: inline;\
+        display: inline-block;\
+        width: 100px;\
+        height: 100px;\
+        overflow: hidden;\
       }\
       #qr #files a {\
         position: absolute;\
@@ -3161,6 +3164,7 @@
       #qr #files img {\
         max-height: 100px;\
         max-width:  100px;\
+        float: left;\
       }\
       #qr input[name=resto] {\
         width: 80px;\
diff --git a/script.coffee b/script.coffee
index 03a55ed7e..4a7605ff8 100644
--- a/script.coffee
+++ b/script.coffee
@@ -2465,7 +2465,10 @@ Main =
       }
       #qr #files li {
         position: relative;
-        display: inline;
+        display: inline-block;
+        width: 100px;
+        height: 100px;
+        overflow: hidden;
       }
       #qr #files a {
         position: absolute;
@@ -2492,6 +2495,7 @@ Main =
       #qr #files img {
         max-height: 100px;
         max-width:  100px;
+        float: left;
       }
       #qr input[name=resto] {
         width: 80px;