Commit 9907e492 authored by Tae Hoon's avatar Tae Hoon

hide floating post button if it overlaps inline reply

parent 6f7ed650
......@@ -5,6 +5,7 @@ const FloatingPostButton = {
return {
scrollingDown: false,
inputActive: false,
hoverInlineReply: false,
oldScrollPos: 0
}
},
......@@ -12,17 +13,17 @@ const FloatingPostButton = {
if (this.autohideFloatingPostButton) {
this.activateFloatingPostButtonAutohide()
}
window.addEventListener('resize', this.handleOSK)
window.addEventListener('resize', this.handleResize)
},
destroyed () {
if (this.autohideFloatingPostButton) {
this.deactivateFloatingPostButtonAutohide()
}
window.removeEventListener('resize', this.handleOSK)
window.removeEventListener('resize', this.handleResize)
},
computed: {
isHidden () {
return this.autohideFloatingPostButton && (this.scrollingDown || this.inputActive)
return this.autohideFloatingPostButton && (this.scrollingDown || this.inputActive || this.hoverInlineReply)
},
autohideFloatingPostButton () {
return !!this.$store.getters.mergedConfig.autohideFloatingPostButton
......@@ -69,6 +70,10 @@ const FloatingPostButton = {
this.inputActive = false
}
},
checkHoverInlineReply () {
const elem = document.elementFromPoint(window.innerWidth / 2, window.innerHeight - 50)
this.hoverInlineReply = !!(elem && elem.closest('.post-status-form.reply-body'))
},
handleScrollStart: debounce(function () {
if (window.scrollY > this.oldScrollPos) {
this.scrollingDown = true
......@@ -81,7 +86,14 @@ const FloatingPostButton = {
handleScrollEnd: debounce(function () {
this.scrollingDown = false
this.oldScrollPos = window.scrollY
}, 100, { leading: false, trailing: true })
this.checkHoverInlineReply()
}, 100, { leading: false, trailing: true }),
handleResize: debounce(function () {
this.handleOSK()
this.checkHoverInlineReply()
}, 100)
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment