Goyslop/4chan-x
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Finish redesign. I'll make the dump mode list later.

Browse Source
This commit is contained in:
Nicolas Stepien 2012-01-01 02:53:45 +01:00
parent 3e0b957ada
commit 7197c8c033
2 changed files with 90 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
4chan_x.user.js
View File

@ -1247,14 +1247,37 @@
#qr > form {\ #qr > form {\
margin: 0;\ 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 {\ .field {\
border: 1px solid #AAA;\ border: 1px solid #CCC;\
box-sizing: border-box;\
font: 13px sans-serif;\
margin: 0;\ margin: 0;\
padding: 2px 4px 3px;\ padding: 2px 4px 3px;\
width: 33%;\ width: 30%;\
}\ }\
textarea.field {\ textarea.field {\
font-family: sans-serif;\
min-height: 120px;\ min-height: 120px;\
width: 100%;\ width: 100%;\
}\ }\
@ -1269,20 +1292,33 @@ textarea.field {\
.field[name=captcha] {\ .field[name=captcha] {\
width: 100%;\ width: 100%;\
}\ }\
#qr [type=file] {\
width: 80%;\
}\
#qr [type=submit] {\
width: 20%;\
}\
</style>\ </style>\
\ \
<div class=move>\ <div class=move>\
Quick Reply\
<input type=checkbox name=autohide id=autohide title=Auto-hide>\ <input type=checkbox name=autohide id=autohide title=Auto-hide>\
<a class=close>⨯</a>\ <a class=close>⨯</a>\
</div>\ </div>\
<form>\ <form>\
<div><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><button id=dump class=field title="Dump mode">+</button><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>\
<textarea title=Comment placeholder=Comment class=field></textarea>\ <div id=replies></div>\
<div><textarea title=Comment placeholder=Comment class=field></textarea><div>\
<div class=captcha><img></div>\ <div class=captcha><img></div>\
<input name=captcha title=Verification placeholder=Verification class=field size=1>\ <div><input name=captcha title=Verification placeholder=Verification class=field size=1></div>\
<div><input type=file name=upfile><input type=submit value=Submit></div>\
<div class=error></div>\
</form>'); </form>');
$.on($('#autohide', qr.el), 'click', qr.hide); $.on($('#autohide', qr.el), 'click', qr.hide);
$.on($('.close', qr.el), 'click', qr.close); $.on($('.close', qr.el), 'click', qr.close);
$.on($('button', qr.el), 'click', function() {
return qr.el.classList.toggle('dump');
});
$.on($('form', qr.el), 'submit', qr.submit); $.on($('form', qr.el), 'submit', qr.submit);
qr.inputs = { qr.inputs = {
name: $('[name=name]', qr.el), name: $('[name=name]', qr.el),
@ -1304,7 +1340,8 @@ textarea.field {\
}, },
submit: function(e) { submit: function(e) {
if (e != null) e.preventDefault(); if (e != null) e.preventDefault();
if (conf['Auto Hide QR']) return qr.hide(); if (conf['Auto Hide QR']) qr.hide();
return $('.error', qr.el).textContent = null;
}, },
response: function(e) { response: function(e) {
var input, name, _ref, _results; var input, name, _ref, _results;
@ -1312,8 +1349,9 @@ textarea.field {\
if (!conf['Persistent QR']) qr.close(); if (!conf['Persistent QR']) qr.close();
if (/sage/i.test(qr.inputs.email.value)) { if (/sage/i.test(qr.inputs.email.value)) {
qr.sage = true; qr.sage = true;
qr.inputs[1].value = null; qr.inputs.email.value = null;
} }
if (!conf['Remember Subject']) $('[name=subject]', qr.el).value = null;
_ref = qr.inputs; _ref = qr.inputs;
_results = []; _results = [];
for (name in _ref) { for (name in _ref) {

51
script.coffee
View File

@ -920,14 +920,37 @@ qr =
#qr > form { #qr > form {
margin: 0; 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 { .field {
border: 1px solid #AAA; border: 1px solid #CCC;
box-sizing: border-box;
font: 13px sans-serif;
margin: 0; margin: 0;
padding: 2px 4px 3px; padding: 2px 4px 3px;
width: 33%; width: 30%;
} }
textarea.field { textarea.field {
font-family: sans-serif;
min-height: 120px; min-height: 120px;
width: 100%; width: 100%;
} }
@ -942,20 +965,31 @@ textarea.field {
.field[name=captcha] { .field[name=captcha] {
width: 100%; width: 100%;
} }
#qr [type=file] {
width: 80%;
}
#qr [type=submit] {
width: 20%;
}
</style> </style>
<div class=move> <div class=move>
Quick Reply
<input type=checkbox name=autohide id=autohide title=Auto-hide> <input type=checkbox name=autohide id=autohide title=Auto-hide>
<a class=close>⨯</a> <a class=close>⨯</a>
</div> </div>
<form> <form>
<div><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><button id=dump class=field title="Dump mode">+</button><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>
<textarea title=Comment placeholder=Comment class=field></textarea> <div id=replies></div>
<div><textarea title=Comment placeholder=Comment class=field></textarea><div>
<div class=captcha><img></div> <div class=captcha><img></div>
<input name=captcha title=Verification placeholder=Verification class=field size=1> <div><input name=captcha title=Verification placeholder=Verification class=field size=1></div>
<div><input type=file name=upfile><input type=submit value=Submit></div>
<div class=error></div>
</form>' </form>'
$.on $('#autohide', qr.el), 'click', qr.hide $.on $('#autohide', qr.el), 'click', qr.hide
$.on $('.close', qr.el), 'click', qr.close $.on $('.close', qr.el), 'click', qr.close
$.on $('button', qr.el), 'click', -> qr.el.classList.toggle 'dump'
$.on $('form', qr.el), 'submit', qr.submit $.on $('form', qr.el), 'submit', qr.submit
# save & load inputs' value with localStorage # save & load inputs' value with localStorage
@ -975,6 +1009,7 @@ textarea.field {
submit: (e) -> submit: (e) ->
e?.preventDefault() e?.preventDefault()
qr.hide() if conf['Auto Hide QR'] qr.hide() if conf['Auto Hide QR']
$('.error', qr.el).textContent = null
# magical xhr2 # magical xhr2
response: (e) -> response: (e) ->
@ -986,7 +1021,9 @@ textarea.field {
if /sage/i.test qr.inputs.email.value if /sage/i.test qr.inputs.email.value
qr.sage = true qr.sage = true
qr.inputs[1].value = null qr.inputs.email.value = null
unless conf['Remember Subject']
$('[name=subject]', qr.el).value = null
for name, input of qr.inputs for name, input of qr.inputs
$.set "qr_#{name}", input.value $.set "qr_#{name}", input.value