From 1c1ec16eef6a99b86cae64360550bda7cc488b58 Mon Sep 17 00:00:00 2001 From: Zixaphir Date: Fri, 9 Jan 2015 18:32:29 -0700 Subject: [PATCH] ImageHover.coffee --- builds/appchan-x.user.js | 116 ++++++++++++++--------------------- builds/crx/script.js | 107 ++++++++++++++------------------ src/Images/ImageHover.coffee | 93 +++++++++++----------------- 3 files changed, 130 insertions(+), 186 deletions(-) diff --git a/builds/appchan-x.user.js b/builds/appchan-x.user.js index 7ec9a870a..def698c86 100644 --- a/builds/appchan-x.user.js +++ b/builds/appchan-x.user.js @@ -11286,6 +11286,10 @@ ImageHover = { init: function() { + var _ref; + if ((_ref = g.VIEW) !== 'index' && _ref !== 'thread') { + return; + } if (Conf['Image Hover']) { Post.callbacks.push({ name: 'Image Hover', @@ -11300,113 +11304,85 @@ } }, node: function() { - var _ref, _ref1; - if (!(((_ref = this.file) != null ? _ref.isImage : void 0) || ((_ref1 = this.file) != null ? _ref1.isVideo : void 0))) { + if (!(this.file && (this.file.isImage || this.file.isVideo))) { return; } return $.on(this.file.thumb, 'mouseover', ImageHover.mouseover); }, catalogNode: function() { var file; - if (!((file = this.thread.OP.file) && (file.isImage || file.isVideo))) { + file = this.thread.OP.file; + if (!(file && (file.isImage || file.isVideo))) { return; } return $.on(this.nodes.thumb, 'mouseover', ImageHover.mouseover); }, mouseover: function(e) { - var el, isVideo, post, thumb; + var el, error, file, isVideo, maxHeight, maxWidth, post, scale, _ref; post = $.hasClass(this, 'thumb') ? g.posts[this.parentNode.dataset.fullID] : Get.postFromNode(this); - isVideo = post.file.isVideo; - el = $.el((isVideo ? 'video' : 'img'), { - src: post.file.URL - }); - thumb = post.file.thumb; - if (d.body.contains(thumb)) { - if (el !== thumb.nextSibling) { - $.after(thumb, el); - } + file = post.file; + isVideo = file.isVideo; + if (file.isExpanding || file.isExpanded) { + return; + } + error = ImageHover.error(post); + if (((_ref = ImageCommon.cache) != null ? _ref.dataset.fullID : void 0) === post.fullID) { + el = ImageCommon.popCache(); + $.on(el, 'error', error); } else { - if (el.parentNode !== Header.hover) { - $.add(Header.hover, el); - } + el = $.el((isVideo ? 'video' : 'img')); + el.dataset.fullID = post.fullID; } el.id = 'ihover'; - el.dataset.fullID = post.fullID; + $.add(Header.hover, el); if (isVideo) { el.loop = true; el.controls = false; - el.muted = !Conf['Allow Sound']; if (Conf['Autoplay']) { el.play(); } } - UI.hover({ + maxWidth = Math.max(left, doc.clientWidth - right); + maxHeight = doc.clientHeight - 16; + scale = Math.min(1, maxWidth / width, maxHeight / height); + el.style.maxWidth = "" + (scale * width) + "px"; + el.style.maxHeight = "" + (scale * height) + "px"; + return UI.hover({ root: this, el: el, latestEvent: e, endEvents: 'mouseout click', - asapTest: post.file.isImage ? function() { - return el.naturalHeight; - } : function() { - return el.readyState >= el.HAVE_CURRENT_DATA; + asapTest: function() { + return true; }, + height: scale * height + padding, + noRemove: true, cb: function() { + $.off(el, 'error', error); + ImageCommon.pushCache(el); if (isVideo) { el.pause(); - TrashQueue.add(el, post); } - return el.removeAttribute('id'); + $.rm(el); + return el.removeAttribute('style'); } }); - return $.on(el, 'error', ImageHover.error); }, - error: function() { - var URL, post, src, timeoutID; - if (!doc.contains(this)) { - return; - } - post = g.posts[this.dataset.fullID]; - src = this.src.split('/'); - if (src[2] === 'i.4cdn.org') { - URL = Redirect.to('file', { - boardID: src[3], - filename: src[4].replace(/\?.+$/, '') - }); - if (URL) { - this.src = URL; + error: function(post) { + return function() { + if (ImageCommon.decodeError(this, post)) { return; } - if (g.DEAD || post.isDead || post.file.isDead) { - return; - } - } - timeoutID = setTimeout(((function(_this) { - return function() { - return _this.src = post.file.URL + '?' + Date.now(); - }; - })(this)), 3000); - return $.ajax("//a.4cdn.org/" + post.board + "/thread/" + post.thread + ".json", { - onload: function() { - var postObj, _i, _len, _ref; - if (this.status !== 200) { - return; - } - _ref = this.response.posts; - for (_i = 0, _len = _ref.length; _i < _len; _i++) { - postObj = _ref[_i]; - if (postObj.no === post.ID) { - break; + return ImageCommon.error(this, post, 3 * $.SECOND, (function(_this) { + return function(URL) { + if (URL) { + return _this.src = URL + (_this.src === URL ? '?' + Date.now() : ''); + } else { + return $.rm(_this); } - } - if (postObj.no !== post.ID) { - clearTimeout(timeoutID); - return post.kill(); - } else if (postObj.filedeleted) { - clearTimeout(timeoutID); - return post.kill(true); - } - } - }); + }; + })(this)); + }; } }; diff --git a/builds/crx/script.js b/builds/crx/script.js index 86528efd6..84049e87f 100644 --- a/builds/crx/script.js +++ b/builds/crx/script.js @@ -11308,6 +11308,10 @@ ImageHover = { init: function() { + var _ref; + if ((_ref = g.VIEW) !== 'index' && _ref !== 'thread') { + return; + } if (Conf['Image Hover']) { Post.callbacks.push({ name: 'Image Hover', @@ -11322,102 +11326,85 @@ } }, node: function() { - var _ref, _ref1; - if (!(((_ref = this.file) != null ? _ref.isImage : void 0) || ((_ref1 = this.file) != null ? _ref1.isVideo : void 0))) { + if (!(this.file && (this.file.isImage || this.file.isVideo))) { return; } return $.on(this.file.thumb, 'mouseover', ImageHover.mouseover); }, catalogNode: function() { var file; - if (!((file = this.thread.OP.file) && (file.isImage || file.isVideo))) { + file = this.thread.OP.file; + if (!(file && (file.isImage || file.isVideo))) { return; } return $.on(this.nodes.thumb, 'mouseover', ImageHover.mouseover); }, mouseover: function(e) { - var el, isVideo, post, thumb; + var el, error, file, isVideo, maxHeight, maxWidth, post, scale, _ref; post = $.hasClass(this, 'thumb') ? g.posts[this.parentNode.dataset.fullID] : Get.postFromNode(this); - isVideo = post.file.isVideo; - el = $.el((isVideo ? 'video' : 'img'), { - src: post.file.URL - }); - thumb = post.file.thumb; - if (d.body.contains(thumb)) { - if (el !== thumb.nextSibling) { - $.after(thumb, el); - } + file = post.file; + isVideo = file.isVideo; + if (file.isExpanding || file.isExpanded) { + return; + } + error = ImageHover.error(post); + if (((_ref = ImageCommon.cache) != null ? _ref.dataset.fullID : void 0) === post.fullID) { + el = ImageCommon.popCache(); + $.on(el, 'error', error); } else { - if (el.parentNode !== Header.hover) { - $.add(Header.hover, el); - } + el = $.el((isVideo ? 'video' : 'img')); + el.dataset.fullID = post.fullID; } el.id = 'ihover'; - el.dataset.fullID = post.fullID; + $.add(Header.hover, el); if (isVideo) { el.loop = true; el.controls = false; - el.muted = !Conf['Allow Sound']; if (Conf['Autoplay']) { el.play(); } } - UI.hover({ + maxWidth = Math.max(left, doc.clientWidth - right); + maxHeight = doc.clientHeight - 16; + scale = Math.min(1, maxWidth / width, maxHeight / height); + el.style.maxWidth = "" + (scale * width) + "px"; + el.style.maxHeight = "" + (scale * height) + "px"; + return UI.hover({ root: this, el: el, latestEvent: e, endEvents: 'mouseout click', - asapTest: post.file.isImage ? function() { - return el.naturalHeight; - } : function() { - return el.readyState >= el.HAVE_CURRENT_DATA; + asapTest: function() { + return true; }, + height: scale * height + padding, + noRemove: true, cb: function() { + $.off(el, 'error', error); + ImageCommon.pushCache(el); if (isVideo) { el.pause(); - TrashQueue.add(el, post); } - return el.removeAttribute('id'); + $.rm(el); + return el.removeAttribute('style'); } }); - return $.on(el, 'error', ImageHover.error); }, - error: function() { - var URL, post, src, timeoutID; - if (!doc.contains(this)) { - return; - } - post = g.posts[this.dataset.fullID]; - src = this.src.split('/'); - if (src[2] === 'i.4cdn.org') { - URL = Redirect.to('file', { - boardID: src[3], - filename: src[4].replace(/\?.+$/, '') - }); - if (URL) { - this.src = URL; + error: function(post) { + return function() { + if (ImageCommon.decodeError(this, post)) { return; } - if (g.DEAD || post.isDead || post.file.isDead) { - return; - } - } - timeoutID = setTimeout(((function(_this) { - return function() { - return _this.src = post.file.URL + '?' + Date.now(); - }; - })(this)), 3000); - return $.ajax(post.file.URL, { - onloadend: function() { - if (this.status !== 404) { - return; - } - clearTimeout(timeoutID); - return post.kill(true); - } - }, { - type: 'head' - }); + return ImageCommon.error(this, post, 3 * $.SECOND, (function(_this) { + return function(URL) { + if (URL) { + return _this.src = URL + (_this.src === URL ? '?' + Date.now() : ''); + } else { + return $.rm(_this); + } + }; + })(this)); + }; } }; diff --git a/src/Images/ImageHover.coffee b/src/Images/ImageHover.coffee index dfaa50d1b..adf0e986f 100755 --- a/src/Images/ImageHover.coffee +++ b/src/Images/ImageHover.coffee @@ -1,5 +1,6 @@ ImageHover = init: -> + return if g.VIEW not in ['index', 'thread'] if Conf['Image Hover'] Post.callbacks.push name: 'Image Hover' @@ -8,82 +9,62 @@ ImageHover = CatalogThread.callbacks.push name: 'Image Hover' cb: @catalogNode + node: -> - return unless @file?.isImage or @file?.isVideo + return unless @file and (@file.isImage or @file.isVideo) $.on @file.thumb, 'mouseover', ImageHover.mouseover + catalogNode: -> - return unless (file = @thread.OP.file) and (file.isImage or file.isVideo) + {file} = @thread.OP + return unless file and (file.isImage or file.isVideo) $.on @nodes.thumb, 'mouseover', ImageHover.mouseover + mouseover: (e) -> post = if $.hasClass @, 'thumb' g.posts[@parentNode.dataset.fullID] else Get.postFromNode @ - {isVideo} = post.file - el = $.el (if isVideo then 'video' else 'img'), - src: post.file.URL - {thumb} = post.file - - if d.body.contains thumb - $.after thumb, el unless el is thumb.nextSibling + {file} = post + {isVideo} = file + return if file.isExpanding or file.isExpanded + error = ImageHover.error post + if ImageCommon.cache?.dataset.fullID is post.fullID + el = ImageCommon.popCache() + $.on el, 'error', error else - $.add Header.hover, el if el.parentNode isnt Header.hover + el = $.el (if isVideo then 'video' else 'img') + el.dataset.fullID = post.fullID + el.id = 'ihover' - el.dataset.fullID = post.fullID + $.add Header.hover, el if isVideo el.loop = true el.controls = false - el.muted = not Conf['Allow Sound'] el.play() if Conf['Autoplay'] + maxWidth = Math.max left, doc.clientWidth - right + maxHeight = doc.clientHeight - 16 + scale = Math.min 1, maxWidth / width, maxHeight / height + el.style.maxWidth = "#{scale * width}px" + el.style.maxHeight = "#{scale * height}px" UI.hover root: @ el: el latestEvent: e endEvents: 'mouseout click' - asapTest: if post.file.isImage - -> el.naturalHeight - else - -> el.readyState >= el.HAVE_CURRENT_DATA + asapTest: -> true + height: scale * height + padding + noRemove: true cb: -> - if isVideo - el.pause() - TrashQueue.add el, post - el.removeAttribute 'id' - $.on el, 'error', ImageHover.error - error: -> - return unless doc.contains @ - post = g.posts[@dataset.fullID] + $.off el, 'error', error + ImageCommon.pushCache el + el.pause() if isVideo + $.rm el + el.removeAttribute 'style' - src = @src.split '/' - if src[2] is 'i.4cdn.org' - URL = Redirect.to 'file', - boardID: src[3] - filename: src[4].replace /\?.+$/, '' + error: (post) -> -> + return if ImageCommon.decodeError @, post + ImageCommon.error @, post, 3 * $.SECOND, (URL) => if URL - @src = URL - return - if g.DEAD or post.isDead or post.file.isDead - return - - timeoutID = setTimeout (=> @src = post.file.URL + '?' + Date.now()), 3000 - <% if (type === 'crx') { %> - $.ajax post.file.URL, - onloadend: -> - return if @status isnt 404 - clearTimeout timeoutID - post.kill true - , - type: 'head' - <% } else { %> - # XXX CORS for i.4cdn.org WHEN? - $.ajax "//a.4cdn.org/#{post.board}/thread/#{post.thread}.json", onload: -> - return if @status isnt 200 - for postObj in @response.posts - break if postObj.no is post.ID - if postObj.no isnt post.ID - clearTimeout timeoutID - post.kill() - else if postObj.filedeleted - clearTimeout timeoutID - post.kill true - <% } %> + @src = URL + if @src is URL then '?' + Date.now() else '' + else + $.rm @ \ No newline at end of file