Migrate to vue3 (fix #126) #127

Merged
Xefir merged 32 commits from vue3 into main 2024-08-17 12:24:28 +00:00
5 changed files with 40 additions and 29 deletions
Showing only changes of commit 1feb0291bb - Show all commits

View File

@ -14,6 +14,8 @@ import GPodder from './views/GPodder.vue'
import { NcContent } from '@nextcloud/vue' import { NcContent } from '@nextcloud/vue'
import Subscriptions from './components/Sidebar/Subscriptions.vue' import Subscriptions from './components/Sidebar/Subscriptions.vue'
import { loadState } from '@nextcloud/initial-state' import { loadState } from '@nextcloud/initial-state'
import { mapActions } from 'pinia'
import { usePlayer } from './store/player.js'
export default { export default {
name: 'App', name: 'App',
@ -28,5 +30,11 @@ export default {
return loadState('repod', 'gpodder', false) return loadState('repod', 'gpodder', false)
}, },
}, },
mounted() {
this.init()
},
methods: {
...mapActions(usePlayer, ['init']),
},
} }
</script> </script>

View File

@ -17,7 +17,7 @@
v-if="!isCurrentEpisode(episode)" v-if="!isCurrentEpisode(episode)"
:aria-label="t('repod', 'Play')" :aria-label="t('repod', 'Play')"
:title="t('repod', 'Play')" :title="t('repod', 'Play')"
@click="load(episode)"> @click="load(episode, url)">
<template #icon> <template #icon>
<PlayIcon :size="20" /> <PlayIcon :size="20" />
</template> </template>

View File

@ -1,10 +1,10 @@
import { createRouter, createWebHistory } from 'vue-router'
import Discover from './views/Discover.vue' import Discover from './views/Discover.vue'
import Feed from './views/Feed.vue' import Feed from './views/Feed.vue'
import { createRouter } from 'vue-router'
import { generateUrl } from '@nextcloud/router' import { generateUrl } from '@nextcloud/router'
const router = createRouter({ const router = createRouter({
base: generateUrl('apps/repod'), history: createWebHistory(generateUrl('apps/repod')),
routes: [ routes: [
{ {
path: '/', path: '/',

View File

@ -1,9 +1,7 @@
import axios from '@nextcloud/axios' import axios from '@nextcloud/axios'
import { decodeUrl } from '../utils/url.js'
import { defineStore } from 'pinia' import { defineStore } from 'pinia'
import { formatEpisodeTimestamp } from '../utils/time.js' import { formatEpisodeTimestamp } from '../utils/time.js'
import { generateUrl } from '@nextcloud/router' import { generateUrl } from '@nextcloud/router'
import router from '../router.js'
const audio = new Audio() const audio = new Audio()
@ -20,11 +18,28 @@ export const usePlayer = defineStore('player', {
started: 0, started: 0,
}), }),
actions: { actions: {
load: async (episode) => { init: () => {
audio.ondurationchange = () => (this.duration = audio.duration)
audio.onended = () => this.stop()
audio.onloadeddata = () => (this.loaded = true)
audio.onpause = () => this.pause()
audio.onplay = () => this.play()
audio.onratechange = () => (this.rate = audio.playbackRate)
audio.onseeked = () => (this.currentTime = audio.currentTime)
audio.ontimeupdate = () => (this.currentTime = audio.currentTime)
audio.onvolumechange = () => (this.volume = audio.volume)
setInterval(() => {
if (this.paused === false) {
this.time()
}
}, 40000)
},
load: async (episode, podcastUrl) => {
this.episode = episode this.episode = episode
this.podcastUrl = podcastUrl
if (this.episode) { if (this.episode) {
this.podcastUrl = decodeUrl(router.currentRoute.params.url)
audio.src = this.episode.url audio.src = this.episode.url
audio.load() audio.load()
@ -94,21 +109,3 @@ export const usePlayer = defineStore('player', {
}, },
}, },
}) })
const player = usePlayer()
audio.ondurationchange = () => (player.duration = audio.duration)
audio.onended = () => player.stop()
audio.onloadeddata = () => (player.loaded = true)
audio.onpause = () => player.pause()
audio.onplay = () => player.play()
audio.onratechange = () => (player.rate = audio.playbackRate)
audio.onseeked = () => (player.currentTime = audio.currentTime)
audio.ontimeupdate = () => (player.currentTime = audio.currentTime)
audio.onvolumechange = () => (player.volume = audio.volume)
setInterval(() => {
if (player.paused === false) {
player.time()
}
}, 40000)

View File

@ -1,12 +1,18 @@
import { createAppConfig } from '@nextcloud/vite-config' import { createAppConfig } from '@nextcloud/vite-config'
import { defineConfig } from 'vite' import { defineConfig } from 'vite'
const config = defineConfig({ const config = defineConfig(({ mode }) => ({
build: { build: {
outDir: 'build', rollupOptions: {
sourcemap: false, output: {
entryFileNames: 'js/[name].js',
format: 'iife',
manualChunks: false,
},
},
sourcemap: mode === 'development',
}, },
}) }))
export default createAppConfig( export default createAppConfig(
{ {