Change href link to span, to avoid change the page and improve code

This commit is contained in:
Marcos Carvalho 2024-05-19 14:14:47 +01:00
parent 00eeeb2a5a
commit b833019a14
No known key found for this signature in database

View file

@ -329,42 +329,9 @@ export default {
seekTimeInSeconds = hours * 3600 + minutes * 60 + seconds seekTimeInSeconds = hours * 3600 + minutes * 60 + seconds
} }
return `<a href="#" class="time-marker" data-time="${seekTimeInSeconds}">${match}</a>` return `<span class="time-marker cursor-pointer text-blue-400 hover:text-blue-300" data-time="${seekTimeInSeconds}">${match}</span>`
}) })
}, },
clickPlaybackTime(event) {
const startTime = event.target.getAttribute('data-time')
if (this.playerIsStartingPlayback) return
this.$hapticsImpact()
this.$store.commit('setPlayerIsStartingPlayback', this.episode.id)
const playbackData = {
libraryItemId: this.libraryItemId,
episodeId: this.episode.id,
serverLibraryItemId: this.serverLibraryItemId,
serverEpisodeId: this.serverEpisodeId,
startTime
}
if (this.localEpisodeId && this.localLibraryItemId && !this.isLocal) {
playbackData.libraryItemId = this.localLibraryItemId
playbackData.episodeId = this.localEpisodeId
}
this.$eventBus.$emit('play-item', playbackData)
},
bindTimeMarkerEvents() {
const container = document.querySelector('.description-container')
if (container) {
container.addEventListener('click', (event) => {
if (event.target.classList.contains('time-marker')) {
this.clickPlaybackTime(event)
}
})
}
},
async deleteLocalEpisode() { async deleteLocalEpisode() {
await this.$hapticsImpact() await this.$hapticsImpact()
@ -406,23 +373,48 @@ export default {
} else { } else {
this.$store.commit('setPlayerIsStartingPlayback', this.episode.id) this.$store.commit('setPlayerIsStartingPlayback', this.episode.id)
if (this.localEpisodeId && this.localLibraryItemId && !this.isLocal) { const playbackData = this.generatePlaybackData()
console.log('Play local episode', this.localEpisodeId, this.localLibraryItemId) this.emitPlayItemEvent(playbackData)
}
},
async clickPlaybackTime(event) {
const startTime = event.target.getAttribute('data-time')
if (this.playerIsStartingPlayback) return
this.$eventBus.$emit('play-item', { await this.$hapticsImpact()
libraryItemId: this.localLibraryItemId,
episodeId: this.localEpisodeId, this.$store.commit('setPlayerIsStartingPlayback', this.episode.id)
serverLibraryItemId: this.serverLibraryItemId,
serverEpisodeId: this.serverEpisodeId const playbackData = this.generatePlaybackData(startTime)
}) this.emitPlayItemEvent(playbackData)
} else { },
this.$eventBus.$emit('play-item', { generatePlaybackData(startTime) {
libraryItemId: this.libraryItemId, const playbackData = {
episodeId: this.episode.id, libraryItemId: this.libraryItemId,
serverLibraryItemId: this.serverLibraryItemId, episodeId: this.episode.id,
serverEpisodeId: this.serverEpisodeId serverLibraryItemId: this.serverLibraryItemId,
}) serverEpisodeId: this.serverEpisodeId,
} startTime
}
if (this.localEpisodeId && this.localLibraryItemId && !this.isLocal) {
playbackData.libraryItemId = this.localLibraryItemId
playbackData.episodeId = this.localEpisodeId
}
return playbackData
},
emitPlayItemEvent(playbackData) {
this.$eventBus.$emit('play-item', playbackData)
},
bindTimeMarkerEvents() {
const container = document.querySelector('.description-container')
if (container) {
container.addEventListener('click', (event) => {
if (event.target.classList.contains('time-marker')) {
this.clickPlaybackTime(event)
}
})
} }
}, },
async downloadClick() { async downloadClick() {