Skip to content

Commit

Permalink
movie 主题功能优化,外链视频分集省流;自动暂停
Browse files Browse the repository at this point in the history
  • Loading branch information
tangly1024 committed Mar 18, 2024
1 parent f31c092 commit fc3e60e
Showing 1 changed file with 21 additions and 0 deletions.
21 changes: 21 additions & 0 deletions themes/movie/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -194,10 +194,20 @@ const LayoutSlug = props => {
const carouselItem = document.createElement('div')
carouselItem.classList.add('notion-carousel')
carouselItem.appendChild(wrapper)

// 如有外链、保存在data-src中
const iframe = wrapper.querySelector('iframe')
if (iframe) {
iframe.setAttribute('data-src', iframe.getAttribute('src'))
}

// 如果是第一个元素,设置为 active
if (index === 0) {
carouselItem.classList.add('active')
} else {
iframe.setAttribute('src', '')
}

// 将元素添加到容器中
carouselWrapper.appendChild(carouselItem)
// 从 DOM 中移除原始的 .notion-asset-wrapper 元素
Expand All @@ -215,15 +225,26 @@ const LayoutSlug = props => {
div.addEventListener('click', function () {
// 遍历所有的 carouselItem 元素
document.querySelectorAll('.notion-carousel').forEach(item => {
// 外链保存在data-src中
const iframe = item.querySelector('iframe')
console.log('iframe', iframe.getAttribute('data-src'), iframe.getAttribute('src'))

// 判断当前元素是否包含该 figCaption 的文本内容,如果是则设置为 active,否则取消 active
if (item.querySelector('figcaption').textContent.trim() === value) {
item.classList.add('active')
if (iframe) {
iframe.setAttribute('src', iframe.getAttribute('data-src'))
}
} else {
item.classList.remove('active')
// 不活跃窗口暂停播放,仅支持notion上传视频、不支持外链
item.querySelectorAll('video')?.forEach(video => {
video.pause()
})
// 外链通过设置src来实现视频暂停播放
if (iframe) {
iframe.setAttribute('src', '')
}
}
})
})
Expand Down

0 comments on commit fc3e60e

Please sign in to comment.