mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
70 lines
2.7 KiB
TypeScript
70 lines
2.7 KiB
TypeScript
import { defineComponentMetadata } from '@/components/define'
|
|
import { forEachFeedsCard } from '@/components/feeds/api'
|
|
import { attributesSubtree, mutationObserve } from '@/core/observer'
|
|
import { useScopedConsole } from '@/core/utils/log'
|
|
import { feedsUrlsWithoutDetail } from '@/core/utils/urls'
|
|
|
|
export const component = defineComponentMetadata({
|
|
name: 'imageAutoBackToTop',
|
|
displayName: '动态看图自动回顶',
|
|
tags: [componentsTags.feeds],
|
|
urlInclude: feedsUrlsWithoutDetail,
|
|
entry: () => {
|
|
const console = useScopedConsole('imageAutoBackToTop')
|
|
forEachFeedsCard({
|
|
added: card => {
|
|
const scrollIntoView = (element: Element) => {
|
|
element?.scrollIntoView()
|
|
window.scrollBy({ top: -75 })
|
|
}
|
|
const albums = dqa(card.element, '.bili-album')
|
|
mutationObserve(albums, { childList: true, attributes: true, subtree: true }, records => {
|
|
records.forEach(record => {
|
|
const isAlbumVisible = () => {
|
|
if (
|
|
record.target instanceof HTMLElement &&
|
|
record.target.classList.contains('bili-album__watch') &&
|
|
record.attributeName === 'style'
|
|
) {
|
|
return record.target.style.display !== 'none'
|
|
}
|
|
return null
|
|
}
|
|
const hasAlbumPreviewNode = (nodeList: NodeList) =>
|
|
[...nodeList].some(node => {
|
|
return node instanceof HTMLElement && node.classList.contains('bili-album__watch')
|
|
})
|
|
const isImagePreviewExited =
|
|
hasAlbumPreviewNode(record.removedNodes) || isAlbumVisible() === false
|
|
if (isImagePreviewExited) {
|
|
scrollIntoView(card.element)
|
|
console.log('imagePreviewExited')
|
|
}
|
|
const isImagePreviewEntered =
|
|
hasAlbumPreviewNode(record.addedNodes) || isAlbumVisible() === true
|
|
if (isImagePreviewEntered) {
|
|
const controlBar = dq(card.element, '.bili-album__watch__control')
|
|
scrollIntoView(controlBar)
|
|
console.log('imagePreviewEntered')
|
|
}
|
|
})
|
|
})
|
|
attributesSubtree(card.element, records => {
|
|
records.forEach(record => {
|
|
if (
|
|
!(record.target instanceof HTMLImageElement) ||
|
|
!record.target.matches('.bili-album__watch__content img') ||
|
|
record.attributeName !== 'src'
|
|
) {
|
|
return
|
|
}
|
|
const controlBar = dq(card.element, '.bili-album__watch__control')
|
|
scrollIntoView(controlBar)
|
|
console.log('imagePreviewSwitched')
|
|
})
|
|
})
|
|
},
|
|
})
|
|
},
|
|
})
|