diff --git a/4chan_x.js b/4chan_x.js index dd7eac8e0..d7d3d798b 100644 --- a/4chan_x.js +++ b/4chan_x.js @@ -58,7 +58,7 @@ */ (function() { - var $, $$, Favicon, NAMESPACE, Recaptcha, anonymize, config, d, expandComment, expandThread, g, imageHover, imgExpand, imgGif, imgPreloading, keybinds, localize, log, main, nav, nodeInserted, options, qr, quickReport, redirect, replyHiding, sauce, threadHiding, threading, titlePost, ui, unread, updater, watcher, _config, _ref; + var $, $$, Favicon, NAMESPACE, Recaptcha, anonymize, config, d, expandComment, expandThread, g, imageHover, imgExpand, imgGif, imgPreloading, keybinds, localize, log, main, nav, nodeInserted, options, qr, quickReport, quotePreview, redirect, replyHiding, sauce, threadHiding, threading, titlePost, ui, unread, updater, watcher, _config, _ref; var __slice = Array.prototype.slice; if (typeof console !== "undefined" && console !== null) { log = function(arg) { @@ -84,6 +84,7 @@ 'Post in Title': [true, 'Show the op\'s post in the tab title'], 'Quick Reply': [true, 'Reply without leaving the page'], 'Quick Report': [true, 'Add quick report buttons'], + 'Quote Preview': [true, 'Show quote content on hover'], 'Reply Hiding': [true, 'Hide single replies'], 'Sauce': [true, 'Add sauce to images'], 'Show Stubs': [true, 'Of hidden threads / replies'], @@ -1212,18 +1213,20 @@ } $.append(op, node); op.id = $('input[name]', op).name; - node = op; - div = $.el('div', { - className: 'thread' - }); - $.before(node, div); - while (node.nodeName !== 'HR') { - $.append(div, node); - node = div.nextSibling; - } - node = node.nextElementSibling; - if (!(node.align || node.nodeName === 'CENTER')) { - return threading.thread(node); + if (!g.REPLY) { + node = op; + div = $.el('div', { + className: 'thread' + }); + $.before(node, div); + while (node.nodeName !== 'HR') { + $.append(div, node); + node = div.nextSibling; + } + node = node.nextElementSibling; + if (!(node.align || node.nodeName === 'CENTER')) { + return threading.thread(node); + } } }, stopPropagation: function(e) { @@ -1658,6 +1661,53 @@ } } }; + quotePreview = { + init: function() { + var preview; + g.callbacks.push(quotePreview.node); + preview = $.el('div', { + id: 'qp', + className: 'reply' + }); + $.hide(preview); + return $.append(d.body, preview); + }, + node: function() { + var quote, quotes, _i, _len, _results; + quotes = $$('a.quotelink'); + _results = []; + for (_i = 0, _len = quotes.length; _i < _len; _i++) { + quote = quotes[_i]; + _results.push($.bind(quote, 'mouseover', quotePreview.mouseover)); + } + return _results; + }, + mouseover: function(e) { + var clientX, clientY, id, preview, target; + target = e.target, clientX = e.clientX, clientY = e.clientY; + preview = $('#qp'); + id = target.textContent.replace(">>", ''); + preview.innerHTML = d.getElementById(id).innerHTML; + $.show(preview); + $.bind(target, 'mousemove', quotePreview.mousemove); + return $.bind(target, 'mouseout', quotePreview.mouseout); + }, + mousemove: function(e) { + var clientX, clientY, preview; + clientX = e.clientX, clientY = e.clientY; + preview = $('#qp'); + preview.style.left = clientX + 45; + return preview.style.top = clientY - 120; + }, + mouseout: function(e) { + var preview, target; + target = e.target; + preview = $('#qp'); + $.hide(preview); + $.unbind(target, 'mousemove', quotePreview.mousemove); + return $.unbind(target, 'mouseout', quotePreview.mouseout); + } + }; quickReport = { init: function() { return g.callbacks.push(quickReport.cb.node); @@ -1846,13 +1896,9 @@ id: 'iHover' }); $.hide(img); - d.body.appendChild(img); + $.append(d.body, img); return g.callbacks.push(imageHover.cb.node); }, - offset: { - x: 45, - y: -120 - }, cb: { node: function(root) { var thumb, thumbs, _i, _len, _results; @@ -1880,10 +1926,10 @@ clientX = e.clientX, clientY = e.clientY; img = $('#iHover'); imgHeight = img.offsetHeight; - top = clientY + imageHover.offset.y; + top = clientY - 120; bot = top + imgHeight; img.style.top = imageHover.winHeight < imgHeight || top < 0 ? '0px' : bot > imageHover.winHeight ? imageHover.winHeight - imgHeight + 'px' : top + 'px'; - return img.style.left = clientX + imageHover.offset.x; + return img.style.left = clientX + 45; }, mouseout: function(e) { var img, target; @@ -2161,12 +2207,16 @@ if ($.config('Quick Report')) { quickReport.init(); } + if ($.config('Quote Preview')) { + quotePreview.init(); + } if ($.config('Thread Watcher')) { watcher.init(); } if ($.config('Keybinds')) { keybinds.init(); } + threading.init(); if (g.REPLY) { if ($.config('Thread Updater')) { updater.init(); @@ -2187,7 +2237,6 @@ watcher.watch(null, g.THREAD_ID); } } else { - threading.init(); if ($.config('Thread Hiding')) { threadHiding.init(); } @@ -2246,7 +2295,7 @@ display: none;\ }\ \ - #iHover {\ + #qp, #iHover {\ position: fixed;\ }\ \ diff --git a/script.coffee b/script.coffee index 0e856e52b..a0831f265 100644 --- a/script.coffee +++ b/script.coffee @@ -28,6 +28,7 @@ config = 'Post in Title': [true, 'Show the op\'s post in the tab title'] 'Quick Reply': [true, 'Reply without leaving the page'] 'Quick Report': [true, 'Add quick report buttons'] + 'Quote Preview': [true, 'Show quote content on hover'] 'Reply Hiding': [true, 'Hide single replies'] 'Sauce': [true, 'Add sauce to images'] 'Show Stubs': [true, 'Of hidden threads / replies'] @@ -964,20 +965,21 @@ threading = $.append op, node #add the blockquote op.id = $('input[name]', op).name - node = op + unless g.REPLY + node = op - div = $.el 'div', - className: 'thread' - $.before node, div + div = $.el 'div', + className: 'thread' + $.before node, div - while node.nodeName isnt 'HR' - $.append div, node - node = div.nextSibling + while node.nodeName isnt 'HR' + $.append div, node + node = div.nextSibling - node = node.nextElementSibling #skip text node - #{N,}SFW - unless node.align or node.nodeName is 'CENTER' - threading.thread node + node = node.nextElementSibling #skip text node + #{N,}SFW + unless node.align or node.nodeName is 'CENTER' + threading.thread node stopPropagation: (e) -> e.stopPropagation() @@ -1316,6 +1318,36 @@ titlePost = if tc = $('span.filetitle').textContent or $('blockquote').textContent d.title = "/#{g.BOARD}/ - #{tc}" +quotePreview = + init: -> + g.callbacks.push quotePreview.node + preview = $.el 'div', id: 'qp', className: 'reply' + $.hide preview + $.append d.body, preview + node: -> + quotes = $$ 'a.quotelink' + for quote in quotes + $.bind quote, 'mouseover', quotePreview.mouseover + mouseover: (e) -> + {target, clientX, clientY} = e + preview = $ '#qp' + id = target.textContent.replace ">>", '' + preview.innerHTML = d.getElementById(id).innerHTML + $.show preview + $.bind target, 'mousemove', quotePreview.mousemove + $.bind target, 'mouseout', quotePreview.mouseout + mousemove: (e) -> + {clientX, clientY} = e + preview = $ '#qp' + preview.style.left = clientX + 45 + preview.style.top = clientY - 120 + mouseout: (e) -> + {target} = e + preview = $ '#qp' + $.hide preview + $.unbind target, 'mousemove', quotePreview.mousemove + $.unbind target, 'mouseout', quotePreview.mouseout + quickReport = init: -> g.callbacks.push quickReport.cb.node @@ -1433,11 +1465,8 @@ imageHover = init: -> img = $.el 'img', id: 'iHover' $.hide img - d.body.appendChild img + $.append d.body, img g.callbacks.push imageHover.cb.node - offset: - x: 45 - y: -120 cb: node: (root) -> thumbs = $$ 'img[md5]', root @@ -1457,7 +1486,7 @@ imageHover = img = $ '#iHover' imgHeight = img.offsetHeight - top = clientY + imageHover.offset.y + top = clientY - 120 bot = top + imgHeight img.style.top = if imageHover.winHeight < imgHeight or top < 0 @@ -1466,7 +1495,7 @@ imageHover = imageHover.winHeight - imgHeight + 'px' else top + 'px' - img.style.left = clientX + imageHover.offset.x + img.style.left = clientX + 45 mouseout: (e) -> {target} = e img = $ '#iHover' @@ -1687,12 +1716,17 @@ main = if $.config 'Quick Report' quickReport.init() + if $.config 'Quote Preview' + quotePreview.init() + if $.config 'Thread Watcher' watcher.init() if $.config 'Keybinds' keybinds.init() + threading.init() + if g.REPLY if $.config 'Thread Updater' updater.init() @@ -1714,8 +1748,6 @@ main = watcher.watch null, g.THREAD_ID else #not reply - threading.init() - if $.config 'Thread Hiding' threadHiding.init() @@ -1769,7 +1801,7 @@ main = display: none; } - #iHover { + #qp, #iHover { position: fixed; }