diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/mobile_post_status_modal/mobile_post_status_modal.js | 33 | ||||
| -rw-r--r-- | src/components/settings/settings.js | 4 | ||||
| -rw-r--r-- | src/components/settings/settings.vue | 4 |
3 files changed, 37 insertions, 4 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..d9806ad9 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 { throttle, debounce } from 'lodash' const MobilePostStatusModal = { components: { @@ -16,11 +16,17 @@ const MobilePostStatusModal = { } }, created () { - window.addEventListener('scroll', this.handleScroll) + if (this.autohideFloatingPostButton) { + window.addEventListener('scroll', this.handleScroll) + window.addEventListener('scroll', this.handleScrollDown) + } window.addEventListener('resize', this.handleOSK) }, destroyed () { - window.removeEventListener('scroll', this.handleScroll) + if (this.autohideFloatingPostButton) { + window.removeEventListener('scroll', this.handleScroll) + window.removeEventListener('scroll', this.handleScrollDown) + } window.removeEventListener('resize', this.handleOSK) }, computed: { @@ -28,7 +34,21 @@ 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) { + window.addEventListener('scroll', this.handleScroll) + window.addEventListener('scroll', this.handleScrollDown) + } else { + window.removeEventListener('scroll', this.handleScroll) + window.removeEventListener('scroll', this.handleScrollDown) + } } }, methods: { @@ -84,6 +104,11 @@ const MobilePostStatusModal = { this.oldScrollPos = window.scrollY this.scrollingDown = scrollingDown + }, 100), + handleScrollDown: debounce(function () { + if (this.scrollingDown) { + this.hidden = false + } }, 100) } } diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js index a85ab674..c4aa45b2 100644 --- a/src/components/settings/settings.js +++ b/src/components/settings/settings.js @@ -46,6 +46,7 @@ const settings = { streamingLocal: user.streaming, pauseOnUnfocusedLocal: user.pauseOnUnfocused, hoverPreviewLocal: user.hoverPreview, + autohideFloatingPostButtonLocal: user.autohideFloatingPostButton, hideMutedPostsLocal: typeof user.hideMutedPosts === 'undefined' ? instance.hideMutedPosts @@ -183,6 +184,9 @@ const settings = { hoverPreviewLocal (value) { this.$store.dispatch('setOption', { name: 'hoverPreview', value }) }, + autohideFloatingPostButtonLocal (value) { + this.$store.dispatch('setOption', { name: 'autohideFloatingPostButton', value }) + }, muteWordsString (value) { value = filter(value.split('\n'), (word) => trim(word).length > 0) this.$store.dispatch('setOption', { name: 'muteWords', value }) diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue index 6890220f..920e6e12 100644 --- a/src/components/settings/settings.vue +++ b/src/components/settings/settings.vue @@ -122,6 +122,10 @@ {{$t('settings.minimal_scopes_mode')}} {{$t('settings.instance_default', { value: minimalScopesModeDefault })}} </label> </li> + <li> + <input type="checkbox" id="autohideFloatingPostButton" v-model="autohideFloatingPostButtonLocal"> + <label for="autohideFloatingPostButton">{{$t('settings.autohide_floating_post_button')}}</label> + </li> </ul> </div> |