Fix image contraction scrolling bugs.

This commit is contained in:
ccd0 2014-11-28 12:57:20 -08:00
parent 7c476cc4c6
commit 34444d6b4f

View File

@ -92,34 +92,21 @@ ImageExpand =
ImageExpand.contract post ImageExpand.contract post
# Scroll back to the thumbnail when contracting the image if Conf['Advance on contract']
# to avoid being left miles away from the relevant post. next = post.nodes.root
{root} = post.nodes
{top, left} = (if Conf['Advance on contract'] then do ->
next = root
while next = $.x "following::div[contains(@class,'postContainer')][1]", next while next = $.x "following::div[contains(@class,'postContainer')][1]", next
continue if $('.stub', next) or next.offsetHeight is 0 break unless $('.stub', next) or next.offsetHeight is 0
return next if next
root Header.scrollTo next
else
root
).getBoundingClientRect()
if top < 0
y = top
if Conf['Fixed Header'] and not Conf['Bottom Header']
headRect = Header.bar.getBoundingClientRect()
y -= headRect.top + headRect.height
if left < 0
x = -window.scrollX
window.scrollBy x, y if x or y
contract: (post) -> contract: (post) ->
{file} = post {file} = post
{bottom} = post.nodes.root.getBoundingClientRect() if el = file.fullImage
oldHeight = d.body.clientHeight top = Header.getTopOf el
bottom = top + el.getBoundingClientRect().height
oldHeight = d.body.clientHeight
{scrollY} = window
$.rmClass post.nodes.root, 'expanded-image' $.rmClass post.nodes.root, 'expanded-image'
$.rmClass file.thumb, 'expanding' $.rmClass file.thumb, 'expanding'
@ -129,25 +116,33 @@ ImageExpand =
for x in ['isExpanding', 'isExpanded', 'videoControls', 'wasPlaying', 'scrollIntoView'] for x in ['isExpanding', 'isExpanded', 'videoControls', 'wasPlaying', 'scrollIntoView']
delete file[x] delete file[x]
# Scroll to keep our place in the thread when images are contracted above us. return unless el
if doc.contains(post.nodes.root) and bottom <= 0
window.scrollBy 0, d.body.clientHeight - oldHeight
if el = file.fullImage if doc.contains el
$.off el, 'error', ImageExpand.error if bottom <= 0
ImageCommon.pushCache el # For images entirely above us, scroll to remain in place.
if file.isVideo window.scroll 0, scrollY + d.body.clientHeight - oldHeight
el.pause() else
for eventName, cb of ImageExpand.videoCB # For images not above us that would be moved above us, scroll to the thumbnail.
$.off el, eventName, cb Header.scrollToIfNeeded post.nodes.root
ImageCommon.rewind file.thumb if Conf['Restart when Opened'] if window.scrollX > 0
delete file.fullImage # If we have scrolled right viewing an expanded image, return to the left.
$.queueTask -> window.scroll 0, window.scrollY
# XXX Work around Chrome/Chromium not firing mouseover on the thumbnail.
return if file.isExpanding or file.isExpanded $.off el, 'error', ImageExpand.error
$.rmClass el, 'full-image' ImageCommon.pushCache el
return if el.id if file.isVideo
$.rm el el.pause()
for eventName, cb of ImageExpand.videoCB
$.off el, eventName, cb
ImageCommon.rewind file.thumb if Conf['Restart when Opened']
delete file.fullImage
$.queueTask ->
# XXX Work around Chrome/Chromium not firing mouseover on the thumbnail.
return if file.isExpanding or file.isExpanded
$.rmClass el, 'full-image'
return if el.id
$.rm el
expand: (post, src) -> expand: (post, src) ->
# Do not expand images of hidden/filtered replies, or already expanded pictures. # Do not expand images of hidden/filtered replies, or already expanded pictures.
@ -198,8 +193,9 @@ ImageExpand =
{file} = post {file} = post
return unless file.isExpanding # contracted before the image loaded return unless file.isExpanding # contracted before the image loaded
{bottom} = post.nodes.root.getBoundingClientRect() bottom = Header.getTopOf(file.thumb) + file.thumb.getBoundingClientRect().height
oldHeight = d.body.clientHeight oldHeight = d.body.clientHeight
{scrollY} = window
$.addClass post.nodes.root, 'expanded-image' $.addClass post.nodes.root, 'expanded-image'
$.rmClass file.thumb, 'expanding' $.rmClass file.thumb, 'expanding'
@ -208,7 +204,7 @@ ImageExpand =
# Scroll to keep our place in the thread when images are expanded above us. # Scroll to keep our place in the thread when images are expanded above us.
if doc.contains(post.nodes.root) and bottom <= 0 if doc.contains(post.nodes.root) and bottom <= 0
window.scrollBy 0, d.body.clientHeight - oldHeight window.scroll window.scrollX, scrollY + d.body.clientHeight - oldHeight
# Scroll to display full image. # Scroll to display full image.
if file.scrollIntoView if file.scrollIntoView