113 lines
2.8 KiB
TypeScript
113 lines
2.8 KiB
TypeScript
import { NOTE_WIDTH } from '@/constants/note-width'
|
|
import { useOverlay } from '@/hooks/useOverlay.hook'
|
|
import { useUserRepoStore } from '@/modules/repo/store/userRepo.store'
|
|
import { useWindowSize } from '@vueuse/core'
|
|
import { nextTick, readonly, ref } from 'vue'
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
|
|
const stackedNotes = ref<string[]>([])
|
|
|
|
let initial = true
|
|
|
|
export const useQueryStackedNotes = () => {
|
|
const { query } = useRoute()
|
|
const { push, currentRoute } = useRouter()
|
|
const store = useUserRepoStore()
|
|
const { height } = useWindowSize()
|
|
const { scrollToNote, isMobile } = useOverlay(false)
|
|
|
|
const scrollToFocusedNote = (sha?: string, backToTop?: boolean) => {
|
|
if (backToTop) {
|
|
scrollToNote(0)
|
|
return
|
|
}
|
|
|
|
if (!sha) {
|
|
return
|
|
}
|
|
|
|
nextTick(() => {
|
|
const index = stackedNotes.value.findIndex((noteSHA) => noteSHA === sha)
|
|
|
|
const hasOneStackedNote = stackedNotes.value.length === 1
|
|
|
|
if (isMobile.value) {
|
|
const element = document.querySelector(`.note-${sha}`) as HTMLElement
|
|
const top = (index + 1) * (element?.clientHeight ?? height.value)
|
|
scrollToNote(top, hasOneStackedNote)
|
|
} else {
|
|
const margin = index * 44
|
|
const left = (index + 1) * NOTE_WIDTH - margin
|
|
scrollToNote(left, hasOneStackedNote)
|
|
}
|
|
})
|
|
}
|
|
|
|
const initResetStackedNote = () => {
|
|
stackedNotes.value = Array.isArray(query.stackedNotes)
|
|
? (query.stackedNotes as string[])
|
|
: ([query.stackedNotes]
|
|
.map((n) => n?.toString())
|
|
.filter((n) => !!n) as string[])
|
|
}
|
|
|
|
if (initial) {
|
|
initial = false
|
|
initResetStackedNote()
|
|
}
|
|
|
|
const updateQueryStackedNotes = (newStackedNotes: string[]) =>
|
|
(stackedNotes.value = newStackedNotes)
|
|
|
|
const addStackedNote = (currentSHA: string, sha: string) => {
|
|
if (stackedNotes.value.includes(sha)) {
|
|
scrollToFocusedNote(sha)
|
|
return
|
|
}
|
|
|
|
const getStackedNotes = () => {
|
|
if (!sha) {
|
|
return []
|
|
}
|
|
|
|
if (!currentSHA) {
|
|
return [sha]
|
|
}
|
|
|
|
const [splittedStackedNotes] = stackedNotes.value
|
|
.join(';')
|
|
.split(currentSHA)
|
|
|
|
return [
|
|
...splittedStackedNotes.replaceAll(';;', ';').split(';'),
|
|
currentSHA,
|
|
sha
|
|
].filter((sha) => !!sha)
|
|
}
|
|
|
|
const newStackedNotes = getStackedNotes()
|
|
|
|
push({
|
|
name: currentRoute.value.name ?? 'FluxNoteView',
|
|
params: {
|
|
user: store.user,
|
|
repo: store.repo
|
|
},
|
|
query: {
|
|
stackedNotes: newStackedNotes
|
|
}
|
|
})
|
|
|
|
updateQueryStackedNotes(newStackedNotes)
|
|
scrollToFocusedNote(sha)
|
|
}
|
|
|
|
return {
|
|
stackedNotes: readonly(stackedNotes),
|
|
updateQueryStackedNotes,
|
|
addStackedNote,
|
|
resetStackedNotes: () => initResetStackedNote(),
|
|
scrollToFocusedNote
|
|
}
|
|
}
|