修复播放器拖拽进度图标显示跳变问题
Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
parent
83a814c386
commit
ed7e8a7768
@ -13,7 +13,7 @@
|
|||||||
<div class="aplayer-body">
|
<div class="aplayer-body">
|
||||||
<thumbnail
|
<thumbnail
|
||||||
:pic="currentMusic.pic"
|
:pic="currentMusic.pic"
|
||||||
:playing="isPlaying"
|
:playing="thumbnailPlaying"
|
||||||
:enable-drag="isFloatMode"
|
:enable-drag="isFloatMode"
|
||||||
:theme="currentMusic.theme || theme"
|
:theme="currentMusic.theme || theme"
|
||||||
@toggleplay="toggle"
|
@toggleplay="toggle"
|
||||||
@ -225,6 +225,7 @@ const emit = defineEmits([
|
|||||||
const audio = ref<HTMLAudioElement | null>(null)
|
const audio = ref<HTMLAudioElement | null>(null)
|
||||||
const internalMusic = ref<PlayerMusicItem>(props.music)
|
const internalMusic = ref<PlayerMusicItem>(props.music)
|
||||||
const isPlaying = ref(false)
|
const isPlaying = ref(false)
|
||||||
|
const isSeeking = ref(false)
|
||||||
const wasPlayingBeforeSeeking = ref(false)
|
const wasPlayingBeforeSeeking = ref(false)
|
||||||
const isMobile = /mobile/i.test(window.navigator.userAgent)
|
const isMobile = /mobile/i.test(window.navigator.userAgent)
|
||||||
const playStat = reactive<StatType>({
|
const playStat = reactive<StatType>({
|
||||||
@ -258,6 +259,7 @@ const currentMusic = computed({
|
|||||||
|
|
||||||
const currentTheme = computed(() => selfAdaptingTheme.value || currentMusic.value.theme || props.theme)
|
const currentTheme = computed(() => selfAdaptingTheme.value || currentMusic.value.theme || props.theme)
|
||||||
const isFloatMode = computed(() => props.float && !isMobile)
|
const isFloatMode = computed(() => props.float && !isMobile)
|
||||||
|
const thumbnailPlaying = computed(() => isPlaying.value || (isSeeking.value && wasPlayingBeforeSeeking.value))
|
||||||
const floatStyleObj = computed(() => {
|
const floatStyleObj = computed(() => {
|
||||||
return {
|
return {
|
||||||
transform: `translate(${floatOffsetLeft.value}px, ${floatOffsetTop.value}px)`,
|
transform: `translate(${floatOffsetLeft.value}px, ${floatOffsetTop.value}px)`,
|
||||||
@ -408,6 +410,7 @@ function onProgressDragBegin(value: number) {
|
|||||||
if (!media) return
|
if (!media) return
|
||||||
|
|
||||||
wasPlayingBeforeSeeking.value = isPlaying.value
|
wasPlayingBeforeSeeking.value = isPlaying.value
|
||||||
|
isSeeking.value = true
|
||||||
pause()
|
pause()
|
||||||
|
|
||||||
if (!isNaN(media.duration)) {
|
if (!isNaN(media.duration)) {
|
||||||
@ -429,6 +432,9 @@ function onProgressDragging(value: number) {
|
|||||||
function onProgressDragEnd() {
|
function onProgressDragEnd() {
|
||||||
if (wasPlayingBeforeSeeking.value) {
|
if (wasPlayingBeforeSeeking.value) {
|
||||||
thenPlay()
|
thenPlay()
|
||||||
|
} else {
|
||||||
|
isSeeking.value = false
|
||||||
|
wasPlayingBeforeSeeking.value = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -502,10 +508,15 @@ function onSelectSong(song: PlayerMusicItem) {
|
|||||||
|
|
||||||
function onAudioPlay() {
|
function onAudioPlay() {
|
||||||
isPlaying.value = true
|
isPlaying.value = true
|
||||||
|
isSeeking.value = false
|
||||||
|
wasPlayingBeforeSeeking.value = false
|
||||||
}
|
}
|
||||||
|
|
||||||
function onAudioPause() {
|
function onAudioPause() {
|
||||||
isPlaying.value = false
|
isPlaying.value = false
|
||||||
|
if (!isSeeking.value) {
|
||||||
|
wasPlayingBeforeSeeking.value = false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function onAudioWaiting() {
|
function onAudioWaiting() {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user