diff options
Diffstat (limited to 'js/quick-reply.js')
| -rw-r--r-- | js/quick-reply.js | 660 |
1 files changed, 335 insertions, 325 deletions
diff --git a/js/quick-reply.js b/js/quick-reply.js index 267b6915..a3cf1404 100644 --- a/js/quick-reply.js +++ b/js/quick-reply.js @@ -12,354 +12,364 @@ * */ -var do_css = function() { - $('#quick-reply-css').remove(); +(function() { + var settings = new script_settings('quick-reply'); - // Find background of reply posts - var dummy_reply = $('<div class="post reply"></div>').appendTo($('body')); - var reply_background = dummy_reply.css('backgroundColor'); - var reply_border_style = dummy_reply.css('borderStyle'); - var reply_border_color = dummy_reply.css('borderColor'); - var reply_border_width = dummy_reply.css('borderWidth'); - dummy_reply.remove(); - - $('<style type="text/css" id="quick-reply-css">\ - #quick-reply {\ - position: fixed;\ - right: 0;\ - top: 5%;\ - float: right;\ - display: block;\ - padding: 0 0 0 0;\ - width: 300px;\ - }\ - #quick-reply table {\ - border-collapse: collapse;\ - background: ' + reply_background + ';\ - border-style: ' + reply_border_style + ';\ - border-width: ' + reply_border_width + ';\ - border-color: ' + reply_border_color + ';\ - margin: 0;\ - width: 100%;\ - }\ - #quick-reply tr td:nth-child(2) {\ - white-space: nowrap;\ - text-align: right;\ - padding-right: 4px;\ - }\ - #quick-reply tr td:nth-child(2) input[type="submit"] {\ - width: 100%;\ - }\ - #quick-reply th, #quick-reply td {\ - margin: 0;\ - padding: 0;\ - }\ - #quick-reply th {\ - text-align: center;\ - padding: 2px 0;\ - border: 1px solid #222;\ - }\ - #quick-reply th .handle {\ - float: left;\ - width: 100%;\ - display: inline-block;\ - }\ - #quick-reply th .close-btn {\ - float: right;\ - padding: 0 5px;\ - }\ - #quick-reply input[type="text"], #quick-reply select {\ - width: 100%;\ - padding: 2px;\ - font-size: 10pt;\ - box-sizing: border-box;\ - -webkit-box-sizing:border-box;\ - -moz-box-sizing: border-box;\ - }\ - #quick-reply textarea {\ - width: 100%;\ - box-sizing: border-box;\ - -webkit-box-sizing:border-box;\ - -moz-box-sizing: border-box;\ - font-size: 10pt;\ - resize: vertical;\ - }\ - #quick-reply input, #quick-reply select, #quick-reply textarea {\ - margin: 0 0 1px 0;\ - }\ - #quick-reply input[type="file"] {\ - padding: 5px 2px;\ - }\ - #quick-reply .nonsense {\ - display: none;\ - }\ - #quick-reply td.submit {\ - width: 1%;\ - }\ - #quick-reply td.recaptcha {\ - text-align: center;\ - padding: 0 0 1px 0;\ - }\ - #quick-reply td.recaptcha span {\ - display: inline-block;\ - width: 100%;\ - background: white;\ - border: 1px solid #ccc;\ - cursor: pointer;\ - }\ - #quick-reply td.recaptcha-response {\ - padding: 0 0 1px 0;\ - }\ - @media screen and (max-width: 800px) {\ + var do_css = function() { + $('#quick-reply-css').remove(); + + // Find background of reply posts + var dummy_reply = $('<div class="post reply"></div>').appendTo($('body')); + var reply_background = dummy_reply.css('backgroundColor'); + var reply_border_style = dummy_reply.css('borderStyle'); + var reply_border_color = dummy_reply.css('borderColor'); + var reply_border_width = dummy_reply.css('borderWidth'); + dummy_reply.remove(); + + $('<style type="text/css" id="quick-reply-css">\ #quick-reply {\ - display: none !important;\ + position: fixed;\ + right: 0;\ + top: 5%;\ + float: right;\ + display: block;\ + padding: 0 0 0 0;\ + width: 300px;\ }\ - }\ - </style>').appendTo($('head')); -}; - -var show_quick_reply = function(){ - if($('div.banner').length == 0) - return; - if($('#quick-reply').length != 0) - return; + #quick-reply table {\ + border-collapse: collapse;\ + background: ' + reply_background + ';\ + border-style: ' + reply_border_style + ';\ + border-width: ' + reply_border_width + ';\ + border-color: ' + reply_border_color + ';\ + margin: 0;\ + width: 100%;\ + }\ + #quick-reply tr td:nth-child(2) {\ + white-space: nowrap;\ + text-align: right;\ + padding-right: 4px;\ + }\ + #quick-reply tr td:nth-child(2) input[type="submit"] {\ + width: 100%;\ + }\ + #quick-reply th, #quick-reply td {\ + margin: 0;\ + padding: 0;\ + }\ + #quick-reply th {\ + text-align: center;\ + padding: 2px 0;\ + border: 1px solid #222;\ + }\ + #quick-reply th .handle {\ + float: left;\ + width: 100%;\ + display: inline-block;\ + }\ + #quick-reply th .close-btn {\ + float: right;\ + padding: 0 5px;\ + }\ + #quick-reply input[type="text"], #quick-reply select {\ + width: 100%;\ + padding: 2px;\ + font-size: 10pt;\ + box-sizing: border-box;\ + -webkit-box-sizing:border-box;\ + -moz-box-sizing: border-box;\ + }\ + #quick-reply textarea {\ + width: 100%;\ + box-sizing: border-box;\ + -webkit-box-sizing:border-box;\ + -moz-box-sizing: border-box;\ + font-size: 10pt;\ + resize: vertical;\ + }\ + #quick-reply input, #quick-reply select, #quick-reply textarea {\ + margin: 0 0 1px 0;\ + }\ + #quick-reply input[type="file"] {\ + padding: 5px 2px;\ + }\ + #quick-reply .nonsense {\ + display: none;\ + }\ + #quick-reply td.submit {\ + width: 1%;\ + }\ + #quick-reply td.recaptcha {\ + text-align: center;\ + padding: 0 0 1px 0;\ + }\ + #quick-reply td.recaptcha span {\ + display: inline-block;\ + width: 100%;\ + background: white;\ + border: 1px solid #ccc;\ + cursor: pointer;\ + }\ + #quick-reply td.recaptcha-response {\ + padding: 0 0 1px 0;\ + }\ + @media screen and (max-width: 800px) {\ + #quick-reply {\ + display: none !important;\ + }\ + }\ + </style>').appendTo($('head')); + }; - do_css(); + var show_quick_reply = function(){ + if($('div.banner').length == 0) + return; + if($('#quick-reply').length != 0) + return; + + do_css(); + + var $postForm = $('form[name="post"]').clone(); + + $postForm.clone(); + + $dummyStuff = $('<div class="nonsense"></div>').appendTo($postForm); + + $postForm.find('table tr').each(function() { + var $th = $(this).children('th:first'); + var $td = $(this).children('td:first'); + if ($th.length && $td.length) { + $td.attr('colspan', 2); - var $postForm = $('form[name="post"]').clone(); + if ($td.find('input[type="text"]').length) { + // Replace <th> with input placeholders + $td.find('input[type="text"]') + .removeAttr('size') + .attr('placeholder', $th.clone().children().remove().end().text()); + } - $postForm.clone(); + // Move anti-spam nonsense and remove <th> + $th.contents().filter(function() { + return this.nodeType == 3; // Node.TEXT_NODE + }).remove(); + $th.contents().appendTo($dummyStuff); + $th.remove(); - $dummyStuff = $('<div class="nonsense"></div>').appendTo($postForm); + if ($td.find('input[name="password"]').length) { + // Hide password field + $(this).hide(); + } - $postForm.find('table tr').each(function() { - var $th = $(this).children('th:first'); - var $td = $(this).children('td:first'); - if ($th.length && $td.length) { - $td.attr('colspan', 2); - - if ($td.find('input[type="text"]').length) { - // Replace <th> with input placeholders - $td.find('input[type="text"]') - .removeAttr('size') - .attr('placeholder', $th.clone().children().remove().end().text()); - } - - // Move anti-spam nonsense and remove <th> - $th.contents().filter(function() { - return this.nodeType == 3; // Node.TEXT_NODE - }).remove(); - $th.contents().appendTo($dummyStuff); - $th.remove(); - - if ($td.find('input[name="password"]').length) { - // Hide password field - $(this).hide(); - } - - // Fix submit button - if ($td.find('input[type="submit"]').length) { - $td.removeAttr('colspan'); - $('<td class="submit"></td>').append($td.find('input[type="submit"]')).insertAfter($td); - } - - // reCAPTCHA - if ($td.find('#recaptcha_widget_div').length) { - // Just show the image, and have it interact with the real form. - var $captchaimg = $td.find('#recaptcha_image img'); - - $captchaimg - .removeAttr('id') - .removeAttr('style') - .addClass('recaptcha_image') - .click(function() { - $('#recaptcha_reload').click(); + // Fix submit button + if ($td.find('input[type="submit"]').length) { + $td.removeAttr('colspan'); + $('<td class="submit"></td>').append($td.find('input[type="submit"]')).insertAfter($td); + } + + // reCAPTCHA + if ($td.find('#recaptcha_widget_div').length) { + // Just show the image, and have it interact with the real form. + var $captchaimg = $td.find('#recaptcha_image img'); + + $captchaimg + .removeAttr('id') + .removeAttr('style') + .addClass('recaptcha_image') + .click(function() { + $('#recaptcha_reload').click(); + }); + + // When we get a new captcha... + $('#recaptcha_response_field').focus(function() { + if ($captchaimg.attr('src') != $('#recaptcha_image img').attr('src')) { + $captchaimg.attr('src', $('#recaptcha_image img').attr('src')); + $postForm.find('input[name="recaptcha_challenge_field"]').val($('#recaptcha_challenge_field').val()); + $postForm.find('input[name="recaptcha_response_field"]').val('').focus(); + } }); - - // When we get a new captcha... - $('#recaptcha_response_field').focus(function() { - if ($captchaimg.attr('src') != $('#recaptcha_image img').attr('src')) { - $captchaimg.attr('src', $('#recaptcha_image img').attr('src')); - $postForm.find('input[name="recaptcha_challenge_field"]').val($('#recaptcha_challenge_field').val()); - $postForm.find('input[name="recaptcha_response_field"]').val('').focus(); - } - }); - - $postForm.submit(function() { - setTimeout(function() { - $('#recaptcha_reload').click(); - }, 200); - }); - - // Make a new row for the response text - var $newRow = $('<tr><td class="recaptcha-response" colspan="2"></td></tr>'); - $newRow.children().first().append( - $td.find('input').removeAttr('style') - ); - $newRow.find('#recaptcha_response_field') - .removeAttr('id') - .addClass('recaptcha_response_field') - .attr('placeholder', $('#recaptcha_response_field').attr('placeholder')); - - $('#recaptcha_response_field').addClass('recaptcha_response_field') - - $td.replaceWith($('<td class="recaptcha" colspan="2"></td>').append($('<span></span>').append($captchaimg))); - - $newRow.insertAfter(this); - } - - // Upload section - if ($td.find('input[type="file"]').length) { - if ($td.find('input[name="file_url"]').length) { - $file_url = $td.find('input[name="file_url"]'); - // Make a new row for it - var $newRow = $('<tr><td colspan="2"></td></tr>'); + $postForm.submit(function() { + setTimeout(function() { + $('#recaptcha_reload').click(); + }, 200); + }); - $file_url.clone().attr('placeholder', _('Upload URL')).appendTo($newRow.find('td')); - $file_url.parent().remove(); + // Make a new row for the response text + var $newRow = $('<tr><td class="recaptcha-response" colspan="2"></td></tr>'); + $newRow.children().first().append( + $td.find('input').removeAttr('style') + ); + $newRow.find('#recaptcha_response_field') + .removeAttr('id') + .addClass('recaptcha_response_field') + .attr('placeholder', $('#recaptcha_response_field').attr('placeholder')); - $newRow.insertBefore(this); + $('#recaptcha_response_field').addClass('recaptcha_response_field') - $td.find('label').remove(); - $td.contents().filter(function() { - return this.nodeType == 3; // Node.TEXT_NODE - }).remove(); - $td.find('input[name="file_url"]').removeAttr('id'); - } - - if ($(this).find('input[name="spoiler"]').length) { - $td.removeAttr('colspan'); + $td.replaceWith($('<td class="recaptcha" colspan="2"></td>').append($('<span></span>').append($captchaimg))); + + $newRow.insertAfter(this); } - } - - // Remove mod controls, because it looks shit. - if ($td.find('input[type="checkbox"]').length) { - var tr = this; - $td.find('input[type="checkbox"]').each(function() { - if ($(this).attr('name') == 'spoiler') { + + // Upload section + if ($td.find('input[type="file"]').length) { + if ($td.find('input[name="file_url"]').length) { + $file_url = $td.find('input[name="file_url"]'); + + // Make a new row for it + var $newRow = $('<tr><td colspan="2"></td></tr>'); + + $file_url.clone().attr('placeholder', _('Upload URL')).appendTo($newRow.find('td')); + $file_url.parent().remove(); + + $newRow.insertBefore(this); + $td.find('label').remove(); - $(this).attr('id', 'q-spoiler-image'); - $postForm.find('input[type="file"]').parent() - .removeAttr('colspan') - .after($('<td class="spoiler"></td>').append(this, ' ', $('<label for="q-spoiler-image">').text(_('Spoiler Image')))); - } else { - $(tr).remove(); + $td.contents().filter(function() { + return this.nodeType == 3; // Node.TEXT_NODE + }).remove(); + $td.find('input[name="file_url"]').removeAttr('id'); } - }); - } - - $td.find('small').hide(); - } - }); - - $postForm.find('textarea[name="body"]').removeAttr('id').removeAttr('cols').attr('placeholder', _('Comment')); - - $postForm.find('textarea:not([name="body"]),input[type="hidden"]').removeAttr('id').appendTo($dummyStuff); - - $postForm.find('br').remove(); - $postForm.find('table').prepend('<tr><th colspan="2">\ - <span class="handle">\ - <a class="close-btn" href="javascript:void(0)">X</a>\ - ' + _('Quick Reply') + '\ - </span>\ - </th></tr>'); - - $postForm.attr('id', 'quick-reply'); - - $postForm.appendTo($('body')).hide(); - $origPostForm = $('form[name="post"]:first'); - - // Synchronise body text with original post form - $origPostForm.find('textarea[name="body"]').bind('change input propertychange', function() { - $postForm.find('textarea[name="body"]').val($(this).val()); - }); - $postForm.find('textarea[name="body"]').bind('change input propertychange', function() { - $origPostForm.find('textarea[name="body"]').val($(this).val()); - }); - $postForm.find('textarea[name="body"]').focus(function() { - $origPostForm.find('textarea[name="body"]').removeAttr('id'); - $(this).attr('id', 'body'); - }); - $origPostForm.find('textarea[name="body"]').focus(function() { - $postForm.find('textarea[name="body"]').removeAttr('id'); - $(this).attr('id', 'body'); - }); - // Synchronise other inputs - $origPostForm.find('input[type="text"],select').bind('change input propertychange', function() { - $postForm.find('[name="' + $(this).attr('name') + '"]').val($(this).val()); - }); - $postForm.find('input[type="text"],select').bind('change input propertychange', function() { - $origPostForm.find('[name="' + $(this).attr('name') + '"]').val($(this).val()); - }); - - if (typeof $postForm.draggable != 'undefined') { - if (localStorage.quickReplyPosition) { - var offset = JSON.parse(localStorage.quickReplyPosition); - if (offset.right > $(window).width() - $postForm.width()) - offset.right = $(window).width() - $postForm.width(); - if (offset.top > $(window).height() - $postForm.height()) - offset.top = $(window).height() - $postForm.height(); - $postForm.css('right', offset.right).css('top', offset.top); - } - $postForm.draggable({ - handle: 'th .handle', - containment: 'window', - distance: 10, - scroll: false, - stop: function() { - var offset = { - top: $(this).offset().top - $(window).scrollTop(), - right: $(window).width() - $(this).offset().left - $(this).width(), - }; - localStorage.quickReplyPosition = JSON.stringify(offset); + + if ($(this).find('input[name="spoiler"]').length) { + $td.removeAttr('colspan'); + } + } - $postForm.css('right', offset.right).css('top', offset.top).css('left', 'auto'); + // Remove mod controls, because it looks shit. + if ($td.find('input[type="checkbox"]').length) { + var tr = this; + $td.find('input[type="checkbox"]').each(function() { + if ($(this).attr('name') == 'spoiler') { + $td.find('label').remove(); + $(this).attr('id', 'q-spoiler-image'); + $postForm.find('input[type="file"]').parent() + .removeAttr('colspan') + .after($('<td class="spoiler"></td>').append(this, ' ', $('<label for="q-spoiler-image">').text(_('Spoiler Image')))); + } else { + $(tr).remove(); + } + }); + } + + $td.find('small').hide(); } }); - $postForm.find('th .handle').css('cursor', 'move'); - } + + $postForm.find('textarea[name="body"]').removeAttr('id').removeAttr('cols').attr('placeholder', _('Comment')); - $postForm.find('th .close-btn').click(function() { - $origPostForm.find('textarea[name="body"]').attr('id', 'body'); - $postForm.remove(); - }); + $postForm.find('textarea:not([name="body"]),input[type="hidden"]').removeAttr('id').appendTo($dummyStuff); - // Fix bug when table gets too big for form. Shouldn't exist, but crappy CSS etc. - $postForm.show(); - $postForm.width($postForm.find('table').width()); - $postForm.hide(); + $postForm.find('br').remove(); + $postForm.find('table').prepend('<tr><th colspan="2">\ + <span class="handle">\ + <a class="close-btn" href="javascript:void(0)">X</a>\ + ' + _('Quick Reply') + '\ + </span>\ + </th></tr>'); + + $postForm.attr('id', 'quick-reply'); + + $postForm.appendTo($('body')).hide(); + $origPostForm = $('form[name="post"]:first'); + + // Synchronise body text with original post form + $origPostForm.find('textarea[name="body"]').bind('change input propertychange', function() { + $postForm.find('textarea[name="body"]').val($(this).val()); + }); + $postForm.find('textarea[name="body"]').bind('change input propertychange', function() { + $origPostForm.find('textarea[name="body"]').val($(this).val()); + }); + $postForm.find('textarea[name="body"]').focus(function() { + $origPostForm.find('textarea[name="body"]').removeAttr('id'); + $(this).attr('id', 'body'); + }); + $origPostForm.find('textarea[name="body"]').focus(function() { + $postForm.find('textarea[name="body"]').removeAttr('id'); + $(this).attr('id', 'body'); + }); + // Synchronise other inputs + $origPostForm.find('input[type="text"],select').bind('change input propertychange', function() { + $postForm.find('[name="' + $(this).attr('name') + '"]').val($(this).val()); + }); + $postForm.find('input[type="text"],select').bind('change input propertychange', function() { + $origPostForm.find('[name="' + $(this).attr('name') + '"]').val($(this).val()); + }); - $(window).trigger('quick-reply'); - - $(window).ready(function() { - $(window).scroll(function() { - if ($(this).width() <= 800) - return; - if ($(this).scrollTop() < $origPostForm.offset().top + $origPostForm.height() - 100) - $postForm.fadeOut(100); - else - $postForm.fadeIn(100); - }).on('stylesheet', function() { - do_css(); - if ($('link#stylesheet').attr('href')) { - $('link#stylesheet')[0].onload = do_css; + if (typeof $postForm.draggable != 'undefined') { + if (localStorage.quickReplyPosition) { + var offset = JSON.parse(localStorage.quickReplyPosition); + if (offset.right > $(window).width() - $postForm.width()) + offset.right = $(window).width() - $postForm.width(); + if (offset.top > $(window).height() - $postForm.height()) + offset.top = $(window).height() - $postForm.height(); + $postForm.css('right', offset.right).css('top', offset.top); } - }).scroll(); - }); -}; - -$(window).on('cite', function(e, id, with_link) { - if ($(this).width() <= 800) - return; - show_quick_reply(); - $('#quick-reply textarea').focus(); - if (with_link) { + $postForm.draggable({ + handle: 'th .handle', + containment: 'window', + distance: 10, + scroll: false, + stop: function() { + var offset = { + top: $(this).offset().top - $(window).scrollTop(), + right: $(window).width() - $(this).offset().left - $(this).width(), + }; + localStorage.quickReplyPosition = JSON.stringify(offset); + + $postForm.css('right', offset.right).css('top', offset.top).css('left', 'auto'); + } + }); + $postForm.find('th .handle').css('cursor', 'move'); + } + + $postForm.find('th .close-btn').click(function() { + $origPostForm.find('textarea[name="body"]').attr('id', 'body'); + $postForm.remove(); + }); + + // Fix bug when table gets too big for form. Shouldn't exist, but crappy CSS etc. + $postForm.show(); + $postForm.width($postForm.find('table').width()); + $postForm.hide(); + + $(window).trigger('quick-reply'); + $(window).ready(function() { - if ($('#' + id).length) { - highlightReply(id); - $(window).scrollTop($('#' + id).offset().top); + if (settings.get('hide_at_top', true)) { + $(window).scroll(function() { + if ($(this).width() <= 800) + return; + if ($(this).scrollTop() < $origPostForm.offset().top + $origPostForm.height() - 100) + $postForm.fadeOut(100); + else + $postForm.fadeIn(100); + }).scroll(); + } else { + $postForm.show(); } + + $(window).on('stylesheet', function() { + do_css(); + if ($('link#stylesheet').attr('href')) { + $('link#stylesheet')[0].onload = do_css; + } + }); }); - } -}); + }; + + $(window).on('cite', function(e, id, with_link) { + if ($(this).width() <= 800) + return; + show_quick_reply(); + $('#quick-reply textarea').focus(); + if (with_link) { + $(window).ready(function() { + if ($('#' + id).length) { + highlightReply(id); + $(window).scrollTop($('#' + id).offset().top); + } + }); + } + }); +})(); |