diff options
| author | Henry Jameson <me@hjkos.com> | 2019-06-16 20:24:03 +0300 |
|---|---|---|
| committer | Henry Jameson <me@hjkos.com> | 2019-06-16 20:24:03 +0300 |
| commit | b00da1778830853e0bed4cb1d0fa93ca09a82167 (patch) | |
| tree | 8072f743384b45dc2b4a62e619bb0b1db3e3ebf9 /src/components/mobile_post_status_modal | |
| parent | 6c7cf7d9b5f2faec03fe75881b5ec81e0ac851fd (diff) | |
| parent | 1db3c785d805bfe1e7bb09f2d85875448cb03f9a (diff) | |
Merge remote-tracking branch 'upstream/develop' into docs
* upstream/develop: (374 commits)
fix typo
rename mutations according to actual property names
fix
fix
fix logged out post-update
fix user banner
fix
AMERICA
comments
No longer sending extra data, renamed some properties
Revert "add TOTP/Recovery Form for mobile version"
Apply suggestion to src/services/entity_normalizer/entity_normalizer.service.js
i18n/Update Japanese translation
render modal at the root level using portal
install portal vue
Small improve of the who to follow panel layout
Fix/Small fix in the who to follow page
remove console spam
i18n
wire up user.description with masto api data
...
Diffstat (limited to 'src/components/mobile_post_status_modal')
| -rw-r--r-- | src/components/mobile_post_status_modal/mobile_post_status_modal.js | 59 | ||||
| -rw-r--r-- | src/components/mobile_post_status_modal/mobile_post_status_modal.vue | 2 |
2 files changed, 39 insertions, 22 deletions
diff --git a/src/components/mobile_post_status_modal/mobile_post_status_modal.js b/src/components/mobile_post_status_modal/mobile_post_status_modal.js index 2f24dd08..91b730e7 100644 --- a/src/components/mobile_post_status_modal/mobile_post_status_modal.js +++ b/src/components/mobile_post_status_modal/mobile_post_status_modal.js @@ -1,5 +1,5 @@ import PostStatusForm from '../post_status_form/post_status_form.vue' -import { throttle } from 'lodash' +import { debounce } from 'lodash' const MobilePostStatusModal = { components: { @@ -16,11 +16,15 @@ const MobilePostStatusModal = { } }, created () { - window.addEventListener('scroll', this.handleScroll) + if (this.autohideFloatingPostButton) { + this.activateFloatingPostButtonAutohide() + } window.addEventListener('resize', this.handleOSK) }, destroyed () { - window.removeEventListener('scroll', this.handleScroll) + if (this.autohideFloatingPostButton) { + this.deactivateFloatingPostButtonAutohide() + } window.removeEventListener('resize', this.handleOSK) }, computed: { @@ -28,10 +32,30 @@ const MobilePostStatusModal = { return this.$store.state.users.currentUser }, isHidden () { - return this.hidden || this.inputActive + return this.autohideFloatingPostButton && (this.hidden || this.inputActive) + }, + autohideFloatingPostButton () { + return !!this.$store.state.config.autohideFloatingPostButton + } + }, + watch: { + autohideFloatingPostButton: function (isEnabled) { + if (isEnabled) { + this.activateFloatingPostButtonAutohide() + } else { + this.deactivateFloatingPostButtonAutohide() + } } }, methods: { + activateFloatingPostButtonAutohide () { + window.addEventListener('scroll', this.handleScrollStart) + window.addEventListener('scroll', this.handleScrollEnd) + }, + deactivateFloatingPostButtonAutohide () { + window.removeEventListener('scroll', this.handleScrollStart) + window.removeEventListener('scroll', this.handleScrollEnd) + }, openPostForm () { this.postFormOpen = true this.hidden = true @@ -65,26 +89,19 @@ const MobilePostStatusModal = { this.inputActive = false } }, - handleScroll: throttle(function () { - const scrollAmount = window.scrollY - this.oldScrollPos - const scrollingDown = scrollAmount > 0 - - if (scrollingDown !== this.scrollingDown) { - this.amountScrolled = 0 - this.scrollingDown = scrollingDown - if (!scrollingDown) { - this.hidden = false - } - } else if (scrollingDown) { - this.amountScrolled += scrollAmount - if (this.amountScrolled > 100 && !this.hidden) { - this.hidden = true - } + handleScrollStart: debounce(function () { + if (window.scrollY > this.oldScrollPos) { + this.hidden = true + } else { + this.hidden = false } + this.oldScrollPos = window.scrollY + }, 100, {leading: true, trailing: false}), + handleScrollEnd: debounce(function () { + this.hidden = false this.oldScrollPos = window.scrollY - this.scrollingDown = scrollingDown - }, 100) + }, 100, {leading: false, trailing: true}) } } diff --git a/src/components/mobile_post_status_modal/mobile_post_status_modal.vue b/src/components/mobile_post_status_modal/mobile_post_status_modal.vue index 0a451c28..c762705b 100644 --- a/src/components/mobile_post_status_modal/mobile_post_status_modal.vue +++ b/src/components/mobile_post_status_modal/mobile_post_status_modal.vue @@ -7,7 +7,7 @@ > <div class="post-form-modal-panel panel" @click.stop=""> <div class="panel-heading">{{$t('post_status.new_status')}}</div> - <PostStatusForm class="panel-body" @posted="closePostForm"/> + <PostStatusForm class="panel-body" @posted="closePostForm" /> </div> </div> <button |
