logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe git clone https://anongit.hacktivis.me/git/pleroma-fe.git/

mobile_nav.js (4214B)


  1. import SideDrawer from '../side_drawer/side_drawer.vue'
  2. import Notifications from '../notifications/notifications.vue'
  3. import ConfirmModal from '../confirm_modal/confirm_modal.vue'
  4. import {
  5. unseenNotificationsFromStore,
  6. countExtraNotifications
  7. } from '../../services/notification_utils/notification_utils'
  8. import GestureService from '../../services/gesture_service/gesture_service'
  9. import NavigationPins from 'src/components/navigation/navigation_pins.vue'
  10. import { mapGetters } from 'vuex'
  11. import { library } from '@fortawesome/fontawesome-svg-core'
  12. import {
  13. faTimes,
  14. faBell,
  15. faBars,
  16. faArrowUp,
  17. faMinus,
  18. faCheckDouble
  19. } from '@fortawesome/free-solid-svg-icons'
  20. library.add(
  21. faTimes,
  22. faBell,
  23. faBars,
  24. faArrowUp,
  25. faMinus,
  26. faCheckDouble
  27. )
  28. const MobileNav = {
  29. components: {
  30. SideDrawer,
  31. Notifications,
  32. NavigationPins,
  33. ConfirmModal
  34. },
  35. data: () => ({
  36. notificationsCloseGesture: undefined,
  37. notificationsOpen: false,
  38. notificationsAtTop: true,
  39. showingConfirmLogout: false
  40. }),
  41. created () {
  42. this.notificationsCloseGesture = GestureService.swipeGesture(
  43. GestureService.DIRECTION_RIGHT,
  44. () => this.closeMobileNotifications(true),
  45. 50
  46. )
  47. },
  48. computed: {
  49. currentUser () {
  50. return this.$store.state.users.currentUser
  51. },
  52. unseenNotifications () {
  53. return unseenNotificationsFromStore(this.$store)
  54. },
  55. unseenNotificationsCount () {
  56. return this.unseenNotifications.length + countExtraNotifications(this.$store)
  57. },
  58. unseenCount () {
  59. return this.unseenNotifications.length
  60. },
  61. unseenCountBadgeText () {
  62. return `${this.unseenCount ? this.unseenCount : ''}`
  63. },
  64. hideSitename () { return this.$store.state.instance.hideSitename },
  65. sitename () { return this.$store.state.instance.name },
  66. isChat () {
  67. return this.$route.name === 'chat'
  68. },
  69. ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount']),
  70. chatsPinned () {
  71. return new Set(this.$store.state.serverSideStorage.prefsStorage.collections.pinnedNavItems).has('chats')
  72. },
  73. shouldConfirmLogout () {
  74. return this.$store.getters.mergedConfig.modalOnLogout
  75. },
  76. closingDrawerMarksAsSeen () {
  77. return this.$store.getters.mergedConfig.closingDrawerMarksAsSeen
  78. },
  79. ...mapGetters(['unreadChatCount'])
  80. },
  81. methods: {
  82. toggleMobileSidebar () {
  83. this.$refs.sideDrawer.toggleDrawer()
  84. },
  85. openMobileNotifications () {
  86. this.notificationsOpen = true
  87. },
  88. closeMobileNotifications (markRead) {
  89. if (this.notificationsOpen) {
  90. // make sure to mark notifs seen only when the notifs were open and not
  91. // from close-calls.
  92. this.notificationsOpen = false
  93. if (markRead && this.closingDrawerMarksAsSeen) {
  94. this.markNotificationsAsSeen()
  95. }
  96. }
  97. },
  98. notificationsTouchStart (e) {
  99. GestureService.beginSwipe(e, this.notificationsCloseGesture)
  100. },
  101. notificationsTouchMove (e) {
  102. GestureService.updateSwipe(e, this.notificationsCloseGesture)
  103. },
  104. scrollToTop () {
  105. window.scrollTo(0, 0)
  106. },
  107. scrollMobileNotificationsToTop () {
  108. this.$refs.mobileNotifications.scrollTo(0, 0)
  109. },
  110. showConfirmLogout () {
  111. this.showingConfirmLogout = true
  112. },
  113. hideConfirmLogout () {
  114. this.showingConfirmLogout = false
  115. },
  116. logout () {
  117. if (!this.shouldConfirmLogout) {
  118. this.doLogout()
  119. } else {
  120. this.showConfirmLogout()
  121. }
  122. },
  123. doLogout () {
  124. this.$router.replace('/main/public')
  125. this.$store.dispatch('logout')
  126. this.hideConfirmLogout()
  127. },
  128. markNotificationsAsSeen () {
  129. this.$store.dispatch('markNotificationsAsSeen')
  130. },
  131. onScroll ({ target: { scrollTop, clientHeight, scrollHeight } }) {
  132. this.notificationsAtTop = scrollTop > 0
  133. if (scrollTop + clientHeight >= scrollHeight) {
  134. this.$refs.notifications.fetchOlderNotifications()
  135. }
  136. }
  137. },
  138. watch: {
  139. $route () {
  140. // handles closing notificaitons when you press any router-link on the
  141. // notifications.
  142. this.closeMobileNotifications()
  143. }
  144. }
  145. }
  146. export default MobileNav