From 5f4bc8c76bf23a13b72c882c4a166eea6127eebc Mon Sep 17 00:00:00 2001
From: Nicolas Stepien <mayhemydg@gmail.com>
Date: Mon, 2 Jan 2012 00:50:41 +0100
Subject: [PATCH] Create a new thread or select a thread to reply to UI.

---
 4chan_x.user.js | 24 +++++++++++++++++++-----
 script.coffee   | 28 +++++++++++++++++++---------
 2 files changed, 38 insertions(+), 14 deletions(-)

diff --git a/4chan_x.user.js b/4chan_x.user.js
index 2a03c818f..6c5a446fc 100644
--- a/4chan_x.user.js
+++ b/4chan_x.user.js
@@ -1281,7 +1281,16 @@
       return $.addClass(qr.el, 'dump');
     },
     dialog: function() {
-      var input, mimeTypes, name, _ref;
+      var input, mimeTypes, name, thread, threads, _i, _len, _ref, _ref2;
+      if (!g.REPLY) {
+        threads = '<option value=new>New thread</option>';
+        _ref = $$('.op');
+        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+          thread = _ref[_i];
+          threads += "<option value=" + thread.id + ">Thread " + thread.id;
+        }
+        threads = "<select>" + threads + "</select>";
+      }
       mimeTypes = $('.rules').textContent.toLowerCase().match(/: (.+)/)[1].replace(/\w+/g, function(type) {
         switch (type) {
           case 'jpg':
@@ -1293,7 +1302,12 @@
         }
       });
       qr.mimeTypes = mimeTypes.split(', ');
-      qr.el = ui.dialog('qr', 'top:0;right:0;', "<style>.autohide:not(:hover) > form {  display: none;}#qr > .move {  min-width: 300px;  text-align: right;}#qr > form {  margin: 0;}#dump {  background: -webkit-linear-gradient(#EEE, #CCC);  background: -moz-linear-gradient(#EEE, #CCC);  background: -o-linear-gradient(#EEE, #CCC);  background: linear-gradient(#EEE, #CCC);  width: 10%;}#dump:hover, #dump:focus {  background: -webkit-linear-gradient(#FFF, #DDD);  background: -moz-linear-gradient(#FFF, #DDD);  background: -o-linear-gradient(#FFF, #DDD);  background: linear-gradient(#FFF, #DDD);}#dump:active, .dump #dump:not(:hover):not(:focus) {  background: -webkit-linear-gradient(#CCC, #DDD);  background: -moz-linear-gradient(#CCC, #DDD);  background: -o-linear-gradient(#CCC, #DDD);  background: linear-gradient(#CCC, #DDD);}#qr:not(.dump) #replies {  display: none;}.field {  border: 1px solid #CCC;  color: #333;  font: 13px sans-serif;  margin: 0;  padding: 2px 4px 3px;  width: 30%;  -webkit-transition: color .25s, border .25s;  -moz-transition: color .25s, border .25s;  -o-transition: color .25s, border .25s;  transition: color .25s, border .25s;}.field:-moz-placeholder,.field:hover:-moz-placeholder {  color: #AAA;}.field:hover, .field:focus {  border-color: #999;  color: #000;  outline: none;}textarea.field {  min-height: 120px;  width: 100%;}.captcha {  background: #FFF;  text-align: center;}.captcha > img {  height: 57px;  width: 300px;}.field[name=captcha] {  width: 100%;}#qr [type=file] {  width: 80%;}#qr [type=submit] {  padding: 0 -moz-calc(1px); /* Gecko does not respect box-sizing: border-box */  width: 20%;}</style><div class=move>  Quick Reply  <input type=checkbox name=autohide id=autohide title=Auto-hide>  <a class=close>⨯</a></div><form>  <div><input id=dump class=field type=button title='Dump mode' value=+><input name=name title=Name placeholder=Name class=field size=1><input name=email title=E-mail placeholder=E-mail class=field size=1><input name=subject title=Subject placeholder=Subject class=field size=1></div>  <div id=replies></div>  <div><textarea title=Comment placeholder=Comment class=field></textarea></div>  <div class=captcha><img></div>  <div><input name=captcha title=Verification placeholder=Verification class=field size=1></div>  <div><input type=file name=upfile max=" + ($('[name=MAX_FILE_SIZE]').value) + " accept='" + mimeTypes + "' multiple><input type=submit value=" + (g.dead ? '404 disabled' : 'Submit') + "></div>  <div class=error></div></form>");
+      qr.el = ui.dialog('qr', 'top:0;right:0;', "<style>.autohide:not(:hover) > form {  display: none;}#qr > .move {  min-width: 300px;  overflow: hidden;}#qr > .move > span {  float: right;}#qr > form {  margin: 0;}#dump {  background: -webkit-linear-gradient(#EEE, #CCC);  background: -moz-linear-gradient(#EEE, #CCC);  background: -o-linear-gradient(#EEE, #CCC);  background: linear-gradient(#EEE, #CCC);  width: 10%;}#dump:hover, #dump:focus {  background: -webkit-linear-gradient(#FFF, #DDD);  background: -moz-linear-gradient(#FFF, #DDD);  background: -o-linear-gradient(#FFF, #DDD);  background: linear-gradient(#FFF, #DDD);}#dump:active, .dump #dump:not(:hover):not(:focus) {  background: -webkit-linear-gradient(#CCC, #DDD);  background: -moz-linear-gradient(#CCC, #DDD);  background: -o-linear-gradient(#CCC, #DDD);  background: linear-gradient(#CCC, #DDD);}#qr:not(.dump) #replies {  display: none;}.field {  border: 1px solid #CCC;  color: #333;  font: 13px sans-serif;  margin: 0;  padding: 2px 4px 3px;  width: 30%;  -webkit-transition: color .25s, border .25s;  -moz-transition: color .25s, border .25s;  -o-transition: color .25s, border .25s;  transition: color .25s, border .25s;}.field:-moz-placeholder,.field:hover:-moz-placeholder {  color: #AAA;}.field:hover, .field:focus {  border-color: #999;  color: #000;  outline: none;}textarea.field {  min-height: 120px;  width: 100%;}.captcha {  background: #FFF;  text-align: center;}.captcha > img {  height: 57px;  width: 300px;}.field[name=captcha] {  width: 100%;}#qr [type=file] {  width: 80%;}#qr [type=submit] {  padding: 0 -moz-calc(1px); /* Gecko does not respect box-sizing: border-box */  width: 20%;}</style><div class=move>  Quick Reply " + threads + "  <span><input type=checkbox name=autohide id=autohide title=Auto-hide> <a class=close>⨯</a></span></div><form>  <div><input id=dump class=field type=button title='Dump mode' value=+><input name=name title=Name placeholder=Name class=field size=1><input name=email title=E-mail placeholder=E-mail class=field size=1><input name=subject title=Subject placeholder=Subject class=field size=1></div>  <div id=replies></div>  <div><textarea title=Comment placeholder=Comment class=field></textarea></div>  <div class=captcha><img></div>  <div><input name=captcha title=Verification placeholder=Verification class=field size=1></div>  <div><input type=file name=upfile max=" + ($('[name=MAX_FILE_SIZE]').value) + " accept='" + mimeTypes + "' multiple><input type=submit value=" + (g.dead ? '404 disabled' : 'Submit') + "></div>  <div class=error></div></form>");
+      if (!g.REPLY) {
+        $.on($('select', qr.el), 'mousedown', function(e) {
+          return e.stopPropagation();
+        });
+      }
       $.on($('#autohide', qr.el), 'click', qr.hide);
       $.on($('.close', qr.el), 'click', qr.close);
       $.on($('#dump', qr.el), 'click', function() {
@@ -1305,9 +1319,9 @@
         email: $('[name=email]', qr.el)
       };
       if (conf['Remember Subject']) qr.inputs.subject = $('[name=subject]', qr.el);
-      _ref = qr.inputs;
-      for (name in _ref) {
-        input = _ref[name];
+      _ref2 = qr.inputs;
+      for (name in _ref2) {
+        input = _ref2[name];
         input.value = $.get("qr_" + name, null);
       }
       $.on(window, 'storage', function(e) {
diff --git a/script.coffee b/script.coffee
index eb2f9da95..db9294b23 100644
--- a/script.coffee
+++ b/script.coffee
@@ -944,7 +944,13 @@ qr =
     $.addClass qr.el, 'dump'
 
   dialog: ->
-    # chose only allowed files
+    # create a new thread or select thread to reply to
+    unless g.REPLY
+      threads = '<option value=new>New thread</option>'
+      for thread in $$ '.op'
+        threads += "<option value=#{thread.id}>Thread #{thread.id}"
+      threads = "<select>#{threads}</select>"
+    # chose only supported files
     mimeTypes = $('.rules').textContent.toLowerCase().match(/: (.+)/)[1].replace /\w+/g, (type) ->
       switch type
         when 'jpg'
@@ -961,7 +967,10 @@ qr =
 }
 #qr > .move {
   min-width: 300px;
-  text-align: right;
+  overflow: hidden;
+}
+#qr > .move > span {
+  float: right;
 }
 #qr > form {
   margin: 0;
@@ -1034,9 +1043,8 @@ textarea.field {
 </style>
 
 <div class=move>
-  Quick Reply
-  <input type=checkbox name=autohide id=autohide title=Auto-hide>
-  <a class=close>⨯</a>
+  Quick Reply #{threads}
+  <span><input type=checkbox name=autohide id=autohide title=Auto-hide> <a class=close>⨯</a></span>
 </div>
 <form>
   <div><input id=dump class=field type=button title='Dump mode' value=+><input name=name title=Name placeholder=Name class=field size=1><input name=email title=E-mail placeholder=E-mail class=field size=1><input name=subject title=Subject placeholder=Subject class=field size=1></div>
@@ -1047,10 +1055,12 @@ textarea.field {
   <div><input type=file name=upfile max=#{$('[name=MAX_FILE_SIZE]').value} accept='#{mimeTypes}' multiple><input type=submit value=#{if g.dead then '404 disabled' else 'Submit'}></div>
   <div class=error></div>
 </form>"
-    $.on $('#autohide', qr.el), 'click',  qr.hide
-    $.on $('.close',    qr.el), 'click',  qr.close
-    $.on $('#dump',     qr.el), 'click',  -> qr.el.classList.toggle 'dump'
-    $.on $('form',      qr.el), 'submit', qr.submit
+    unless g.REPLY
+      $.on $('select',  qr.el), 'mousedown',  (e) -> e.stopPropagation()
+    $.on $('#autohide', qr.el), 'click',      qr.hide
+    $.on $('.close',    qr.el), 'click',      qr.close
+    $.on $('#dump',     qr.el), 'click',      -> qr.el.classList.toggle 'dump'
+    $.on $('form',      qr.el), 'submit',     qr.submit
 
     # save & load inputs' value with localStorage
     qr.inputs =