Castopod
/
RePod-Nextcloud-App
mirror of https://git.crystalyx.net/Xefir/repod.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: 🎨 add prettier and update deps

This commit is contained in:
Michel Roux 2024-04-30 00:48:47 +02:00
parent cbc9654af8
commit b0a0414fd4
36 changed files with 2351 additions and 5720 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.js
View File

@ -1,9 +1,11 @@
module.exports = {
extends: [
'@nextcloud',
'plugin:prettier/recommended',
],
rules: {
'sort-imports': 'error',
'vue/attributes-order': ['error', { alphabetical: true }],
'vue/first-attribute-linebreak': 'off',
},
}

12
composer.lock generated
View File

@ -94,16 +94,16 @@
},
{
"name": "php-cs-fixer/shim",
"version": "v3.51.0",
"version": "v3.54.0",
"source": {
"type": "git",
"url": "https://github.com/PHP-CS-Fixer/shim.git",
"reference": "a792394f7f3934f75a4df9dca544796c6f503027"
"reference": "887c350fccbadb2b84278fdb963c25a0c304ac9c"
},
"dist": {
"type": "zip",
"url": "https://api.github.com/repos/PHP-CS-Fixer/shim/zipball/a792394f7f3934f75a4df9dca544796c6f503027",
"reference": "a792394f7f3934f75a4df9dca544796c6f503027",
"url": "https://api.github.com/repos/PHP-CS-Fixer/shim/zipball/887c350fccbadb2b84278fdb963c25a0c304ac9c",
"reference": "887c350fccbadb2b84278fdb963c25a0c304ac9c",
"shasum": ""
},
"require": {
@ -140,9 +140,9 @@
"description": "A tool to automatically fix PHP code style",
"support": {
"issues": "https://github.com/PHP-CS-Fixer/shim/issues",
"source": "https://github.com/PHP-CS-Fixer/shim/tree/v3.51.0"
"source": "https://github.com/PHP-CS-Fixer/shim/tree/v3.54.0"
},
"time": "2024-02-28T19:51:07+00:00"
"time": "2024-04-17T08:23:10+00:00"
},
{
"name": "psalm/phar",

7328
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

20
package.json
View File

@ -19,11 +19,11 @@
},
"dependencies": {
"@nextcloud/axios": "^2.4.0",
"@nextcloud/dialogs": "^5.2.0",
"@nextcloud/initial-state": "^2.1.0",
"@nextcloud/dialogs": "^5.3.1",
"@nextcloud/initial-state": "^2.2.0",
"@nextcloud/l10n": "^2.2.0",
"@nextcloud/router": "^3.0.0",
"@nextcloud/vue": "^8.11.0",
"@nextcloud/router": "^3.0.1",
"@nextcloud/vue": "^8.11.2",
"vue": "^2",
"vue-material-design-icons": "^5.3.0",
"vue-router": "^3",
@ -36,11 +36,15 @@
"node": "^20.0.0",
"npm": "^9.0.0"
},
"prettier": "@nextcloud/prettier-config",
"devDependencies": {
"@nextcloud/babel-config": "^1.0.0",
"@nextcloud/browserslist-config": "^3.0.0",
"@nextcloud/babel-config": "^1.1.1",
"@nextcloud/browserslist-config": "^3.0.1",
"@nextcloud/eslint-config": "^8.3.0",
"@nextcloud/stylelint-config": "^2.4.0",
"@nextcloud/webpack-vue-config": "^6.0.1"
"@nextcloud/prettier-config": "^1.0.0",
"@nextcloud/stylelint-config": "^3.0.0",
"@nextcloud/webpack-vue-config": "^6.0.1",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-prettier": "^5.1.3"
}
}

6
src/components/Atoms/AppContent.vue
View File

@ -21,7 +21,7 @@ export default {
</script>
<style scoped>
.padding {
padding-bottom: 6rem;
}
.padding {
padding-bottom: 6rem;
}
</style>

6
src/components/Atoms/AppNavigation.vue
View File

@ -27,7 +27,7 @@ export default {
</script>
<style scoped>
.padding {
padding-bottom: 6rem;
}
.padding {
padding-bottom: 6rem;
}
</style>

6
src/components/Atoms/Loading.vue
View File

@ -14,7 +14,7 @@ export default {
</script>
<style scoped>
.loading {
margin: 2rem 0;
}
.loading {
margin: 2rem 0;
}
</style>

27
src/components/Atoms/Modal.vue
View File

@ -1,24 +1,17 @@
<!-- eslint-disable vue/no-v-html -->
<template>
<div>
<NcAvatar :display-name="name"
:is-no-user="true"
:size="256"
:url="image" />
<NcAvatar :display-name="name" :is-no-user="true" :size="256" :url="image" />
<h2>{{ name }}</h2>
<p v-html="strippedDescription" />
<div>
<NcButton v-if="link"
:href="link"
target="_blank">
<NcButton v-if="link" :href="link" target="_blank">
<template #icon>
<OpenInNewIcon :size="20" />
</template>
{{ title }}
</NcButton>
<NcButton v-if="url"
:href="url"
target="_blank">
<NcButton v-if="url" :href="url" target="_blank">
<template #icon>
<DownloadIcon :size="20" />
</template>
@ -85,11 +78,11 @@ export default {
</script>
<style scoped>
div {
align-items: center;
display: flex;
flex-direction: column;
gap: 1rem;
margin: 2rem;
}
div {
align-items: center;
display: flex;
flex-direction: column;
gap: 1rem;
margin: 2rem;
}
</style>

10
src/components/Discover/AddRss.vue
View File

@ -1,6 +1,8 @@
<template>
<NcAppNavigationList>
<NcAppNavigationNewItem :name="t('repod', 'Add a RSS link')" @new-item="addSubscription">
<NcAppNavigationNewItem
:name="t('repod', 'Add a RSS link')"
@new-item="addSubscription">
<template #icon>
<PlusIcon :size="20" />
</template>
@ -29,7 +31,7 @@ export default {
</script>
<style scoped>
ul {
margin-top: 2rem;
}
ul {
margin-top: 2rem;
}
</style>

16
src/components/Discover/Search.vue
View File

@ -2,13 +2,15 @@
<div>
<Loading v-if="loading" />
<ul v-if="!loading">
<NcListItem v-for="feed in feeds"
<NcListItem
v-for="feed in feeds"
:key="feed.link"
:details="formatLocaleDate(new Date(feed.fetchedAtUnix*1000))"
:details="formatLocaleDate(new Date(feed.fetchedAtUnix * 1000))"
:name="feed.title"
:to="toUrl(feed.link)">
<template #icon>
<NcAvatar :display-name="feed.author"
<NcAvatar
:display-name="feed.author"
:is-no-user="true"
:url="feed.imageUrl" />
</template>
@ -61,9 +63,13 @@ export default {
try {
this.loading = true
const currentSearch = this.value
const feeds = await axios.get(generateUrl('/apps/repod/search?q={value}', { value: currentSearch }))
const feeds = await axios.get(
generateUrl('/apps/repod/search?q={value}', { value: currentSearch }),
)
if (currentSearch === this.value) {
this.feeds = [...feeds.data].sort((a, b) => b.fetchedAtUnix - a.fetchedAtUnix)
this.feeds = [...feeds.data].sort(
(a, b) => b.fetchedAtUnix - a.fetchedAtUnix,
)
}
} catch (e) {
console.error(e)

48
src/components/Discover/Toplist.vue
View File

@ -5,7 +5,7 @@
<ul v-if="!loading">
<li v-for="top in tops" :key="top.link">
<router-link :to="toUrl(top.link)">
<img :src="top.imageUrl" :title="top.author">
<img :src="top.imageUrl" :title="top.author" />
</router-link>
</li>
</ul>
@ -39,12 +39,12 @@ export default {
computed: {
title() {
switch (this.type) {
case 'new':
return t('repod', 'New podcasts')
case 'hot':
return t('repod', 'Hot podcasts')
default:
return this.type
case 'new':
return t('repod', 'New podcasts')
case 'hot':
return t('repod', 'Hot podcasts')
default:
return this.type
}
},
},
@ -67,24 +67,24 @@ export default {
</script>
<style scoped>
h2 {
margin: 1rem 0;
}
h2 {
margin: 1rem 0;
}
img {
height: 100%;
width: 100%;
}
img {
height: 100%;
width: 100%;
}
li {
flex-basis: 10rem;
flex-shrink: 0;
}
li {
flex-basis: 10rem;
flex-shrink: 0;
}
ul {
display: flex;
gap: 2rem;
overflow: scroll hidden;
padding-bottom: .5rem;
}
ul {
display: flex;
gap: 2rem;
overflow: scroll hidden;
padding-bottom: 0.5rem;
}
</style>

91
src/components/Feed/Banner.vue
View File

@ -1,10 +1,11 @@
<!-- eslint-disable vue/no-v-html -->
<template>
<div class="header">
<img class="background" :src="imageUrl">
<img class="background" :src="imageUrl" />
<div class="content">
<div>
<NcAvatar :display-name="author || title"
<NcAvatar
:display-name="author || title"
:is-no-user="true"
:size="128"
:url="imageUrl" />
@ -19,12 +20,13 @@
<a :href="link" target="_blank">
<i>{{ author }}</i>
</a>
<br><br>
<br /><br />
<p>
<small v-html="strippedDescription" />
</p>
</div>
<NcAppNavigationNew v-if="!isSubscribed"
<NcAppNavigationNew
v-if="!isSubscribed"
:text="t('repod', 'Subscribe')"
@click="addSubscription">
<template #icon>
@ -90,7 +92,10 @@ export default {
methods: {
async addSubscription() {
try {
await axios.post(generateUrl('/apps/gpoddersync/subscription_change/create'), { add: [this.url], remove: [] })
await axios.post(generateUrl('/apps/gpoddersync/subscription_change/create'), {
add: [this.url],
remove: [],
})
} catch (e) {
console.error(e)
showError(t('repod', 'Error while adding the feed'))
@ -100,55 +105,55 @@ export default {
},
copyFeed() {
window.navigator.clipboard.writeText(this.url)
showSuccess(t('repod', 'Feed\'s link copied to the clipboard'))
showSuccess(t('repod', "Feed's link copied to the clipboard"))
},
},
}
</script>
<style scoped>
.background {
filter: blur(1rem) brightness(50%);
height: auto;
left: 0;
opacity: .4;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.background {
filter: blur(1rem) brightness(50%);
height: auto;
left: 0;
opacity: 0.4;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.content {
display: flex;
gap: 1rem;
height: 10rem;
position: relative;
}
.content {
display: flex;
gap: 1rem;
height: 10rem;
position: relative;
}
.feed {
display: flex;
gap: .2rem;
margin: .5rem;
}
.feed {
display: flex;
gap: 0.2rem;
margin: 0.5rem;
}
.header {
height: 14rem;
overflow: hidden;
padding: 2rem;
position: relative;
}
.header {
height: 14rem;
overflow: hidden;
padding: 2rem;
position: relative;
}
.infos {
overflow: auto;
}
.infos {
overflow: auto;
}
.inner {
display: flex;
}
@media only screen and (max-width: 768px) {
.inner {
display: flex;
}
@media only screen and (max-width: 768px) {
.inner {
flex-direction: column;
}
flex-direction: column;
}
}
</style>

94
src/components/Feed/Episodes.vue
View File

@ -2,17 +2,19 @@
<div>
<Loading v-if="loading" />
<ul v-if="!loading">
<NcListItem v-for="episode in filteredEpisodes"
<NcListItem
v-for="episode in filteredEpisodes"
:key="episode.guid"
:active="isCurrentEpisode(episode)"
:class="hasEnded(episode) ? 'ended': ''"
:class="hasEnded(episode) ? 'ended' : ''"
:details="formatLocaleDate(new Date(episode.pubDate?.date))"
:force-display-actions="true"
:name="episode.name"
:title="episode.description"
@click="modalEpisode = episode">
<template #actions>
<NcActionButton v-if="!isCurrentEpisode(episode)"
<NcActionButton
v-if="!isCurrentEpisode(episode)"
:aria-label="t('repod', 'Play')"
:name="t('repod', 'Play')"
:title="t('repod', 'Play')"
@ -21,7 +23,8 @@
<PlayIcon :size="20" />
</template>
</NcActionButton>
<NcActionButton v-if="isCurrentEpisode(episode)"
<NcActionButton
v-if="isCurrentEpisode(episode)"
:aria-label="t('repod', 'Stop')"
:name="t('repod', 'Stop')"
:title="t('repod', 'Stop')"
@ -33,7 +36,8 @@
</template>
<template #extra>
<NcActions>
<NcActionButton v-if="episode.duration && !hasEnded(episode)"
<NcActionButton
v-if="episode.duration && !hasEnded(episode)"
:aria-label="t('repod', 'Mark as read')"
:disabled="loadingAction"
:name="t('repod', 'Mark as read')"
@ -43,7 +47,8 @@
<PlaylistPlayIcon :size="20" />
</template>
</NcActionButton>
<NcActionButton v-if="episode.duration && hasEnded(episode)"
<NcActionButton
v-if="episode.duration && hasEnded(episode)"
:aria-label="t('repod', 'Mark as unread')"
:disabled="loadingAction"
:name="t('repod', 'Mark as unread')"
@ -53,7 +58,8 @@
<PlaylistRemoveIcon :size="20" />
</template>
</NcActionButton>
<NcActionLink v-if="episode.link"
<NcActionLink
v-if="episode.link"
:href="episode.link"
:name="t('repod', 'Open website')"
target="_blank"
@ -62,7 +68,8 @@
<OpenInNewIcon :size="20" />
</template>
</NcActionLink>
<NcActionLink v-if="episode.url"
<NcActionLink
v-if="episode.url"
:href="episode.url"
:name="t('repod', 'Download')"
target="_blank"
@ -74,14 +81,16 @@
</NcActions>
</template>
<template #icon>
<NcAvatar :display-name="episode.name"
<NcAvatar
:display-name="episode.name"
:is-no-user="true"
:url="episode.image" />
</template>
<template #indicator>
<NcProgressBar v-if="isListening(episode)"
<NcProgressBar
v-if="isListening(episode)"
class="progress"
:value="episode.action.position * 100 / episode.action.total" />
:value="(episode.action.position * 100) / episode.action.total" />
</template>
<template #subname>
{{ episode.duration }}
@ -89,7 +98,8 @@
</NcListItem>
</ul>
<NcModal v-if="modalEpisode" @close="modalEpisode = null">
<Modal :description="modalEpisode.description"
<Modal
:description="modalEpisode.description"
:image="modalEpisode.image"
:link="modalEpisode.link"
:name="modalEpisode.name"
@ -101,8 +111,20 @@
</template>
<script>
import { NcActionButton, NcActionLink, NcActions, NcAvatar, NcListItem, NcModal, NcProgressBar } from '@nextcloud/vue'
import { durationToSeconds, formatEpisodeTimestamp, formatLocaleDate } from '../../utils/time.js'
import {
NcActionButton,
NcActionLink,
NcActions,
NcAvatar,
NcListItem,
NcModal,
NcProgressBar,
} from '@nextcloud/vue'
import {
durationToSeconds,
formatEpisodeTimestamp,
formatLocaleDate,
} from '../../utils/time.js'
import DownloadIcon from 'vue-material-design-icons/Download.vue'
import { EventBus } from '../../store/bus.js'
import Loading from '../Atoms/Loading.vue'
@ -175,8 +197,12 @@ export default {
async mounted() {
try {
this.loading = true
const episodes = await axios.get(generateUrl('/apps/repod/episodes/list?url={url}', { url: this.url }))
this.episodes = [...episodes.data].sort((a, b) => new Date(b.pubDate?.date) - new Date(a.pubDate?.date))
const episodes = await axios.get(
generateUrl('/apps/repod/episodes/list?url={url}', { url: this.url }),
)
this.episodes = [...episodes.data].sort(
(a, b) => new Date(b.pubDate?.date) - new Date(a.pubDate?.date),
)
EventBus.$on('updateEpisodesList', this.updateList)
} catch (e) {
console.error(e)
@ -191,18 +217,22 @@ export default {
methods: {
formatLocaleDate,
hasEnded(episode) {
return episode.action
&& episode.action.position > 0
&& episode.action.total > 0
&& episode.action.position >= episode.action.total
return (
episode.action &&
episode.action.position > 0 &&
episode.action.total > 0 &&
episode.action.position >= episode.action.total
)
},
isCurrentEpisode(episode) {
return this.currentEpisode && this.currentEpisode.url === episode.url
},
isListening(episode) {
return episode.action
&& episode.action.action.toLowerCase() === 'play'
&& !this.hasEnded(episode)
return (
episode.action &&
episode.action.action.toLowerCase() === 'play' &&
!this.hasEnded(episode)
)
},
load(episode) {
this.$store.dispatch('player/load', episode)
@ -220,7 +250,9 @@ export default {
position: read ? durationToSeconds(episode.duration) : 0,
total: durationToSeconds(episode.duration),
}
await axios.post(generateUrl('/apps/gpoddersync/episode_action/create'), [episode.action])
await axios.post(generateUrl('/apps/gpoddersync/episode_action/create'), [
episode.action,
])
this.updateList(episode)
} catch (e) {
console.error(e)
@ -230,18 +262,18 @@ export default {
}
},
updateList(episode) {
this.episodes = this.episodes.map((e) => e.url === episode.url ? episode : e)
this.episodes = this.episodes.map((e) => (e.url === episode.url ? episode : e))
},
},
}
</script>
<style scoped>
.ended {
opacity: .4;
}
.ended {
opacity: 0.4;
}
.progress {
margin-top: .4rem;
}
.progress {
margin-top: 0.4rem;
}
</style>

87
src/components/Player/Bar.vue
View File

@ -1,10 +1,10 @@
<template>
<div v-if="player.episode" class="footer">
<img class="background" :src="player.episode.image">
<img class="background" :src="player.episode.image" />
<Loading v-if="!player.loaded" />
<ProgressBar v-if="player.loaded" />
<div v-if="player.loaded" class="player">
<img :src="player.episode.image">
<img :src="player.episode.image" />
<Infos class="infos" />
<Controls class="controls" />
<Timer class="timer" />
@ -40,49 +40,50 @@ export default {
</script>
<style scoped>
.background {
filter: blur(1rem) brightness(50%);
height: auto;
left: 0;
opacity: .4;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.footer {
background-color: var(--color-main-background);
bottom: 0;
height: 6rem;
right: 0;
position: absolute;
width: 100%;
z-index: 2000;
}
.player {
display: flex;
gap: 1rem;
height: 6rem;
justify-content: space-between;
}
.timer {
width: 30%;
.background {
filter: blur(1rem) brightness(50%);
height: auto;
left: 0;
opacity: 0.4;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.footer {
background-color: var(--color-main-background);
bottom: 0;
height: 6rem;
right: 0;
position: absolute;
width: 100%;
z-index: 2000;
}
.player {
display: flex;
gap: 1rem;
height: 6rem;
justify-content: space-between;
}
.timer {
width: 30%;
}
.volume {
width: 10%;
}
@media only screen and (max-width: 768px) {
.infos {
flex: 2;
}
.timer,
.volume {
width: 10%;
}
@media only screen and (max-width: 768px) {
.infos {
flex: 2;
}
.timer, .volume {
display: none;
}
display: none;
}
}
</style>

18
src/components/Player/Controls.vue
View File

@ -1,10 +1,12 @@
<template>
<div class="controls">
<PauseIcon v-if="!player.paused"
<PauseIcon
v-if="!player.paused"
class="pointer"
:size="50"
@click="$store.dispatch('player/pause')" />
<PlayIcon v-if="player.paused"
<PlayIcon
v-if="player.paused"
class="pointer"
:size="50"
@click="$store.dispatch('player/play')" />
@ -30,11 +32,11 @@ export default {
</script>
<style scoped>
.controls {
display: flex;
}
.controls {
display: flex;
}
.pointer {
cursor: pointer;
}
.pointer {
cursor: pointer;
}
</style>

21
src/components/Player/Infos.vue
View File

@ -7,7 +7,8 @@
<i>{{ player.episode.title }}</i>
</router-link>
<NcModal v-if="modal" @close="modal = false">
<Modal :description="player.episode.description"
<Modal
:description="player.episode.description"
:image="player.episode.image"
:link="player.episode.link"
:name="player.episode.name"
@ -46,14 +47,14 @@ export default {
</script>
<style scoped>
.pointer {
cursor: pointer;
}
.pointer {
cursor: pointer;
}
.root {
display: flex;
flex-direction: column;
justify-content: center;
width: 40%;
}
.root {
display: flex;
flex-direction: column;
justify-content: center;
width: 40%;
}
</style>

19
src/components/Player/ProgressBar.vue
View File

@ -1,10 +1,11 @@
<template>
<input class="progress"
<input
class="progress"
:max="player.duration"
min="0"
type="range"
:value="player.currentTime"
@change="(event) => $store.dispatch('player/seek', event.target.value)">
@change="(event) => $store.dispatch('player/seek', event.target.value)" />
</template>
<script>
@ -19,11 +20,11 @@ export default {
</script>
<style scoped>
.progress {
height: 4px;
min-height: 4px;
position: absolute;
top: -2px;
width: 99%;
}
.progress {
height: 4px;
min-height: 4px;
position: absolute;
top: -2px;
width: 99%;
}
</style>

16
src/components/Player/Timer.vue
View File

@ -1,8 +1,8 @@
<template>
<div>
<span>{{ formatTimer(new Date(player.currentTime*1000)) }}</span>
<span>{{ formatTimer(new Date(player.currentTime * 1000)) }}</span>
<span>/</span>
<span>{{ formatTimer(new Date(player.duration*1000)) }}</span>
<span>{{ formatTimer(new Date(player.duration * 1000)) }}</span>
</div>
</template>
@ -23,10 +23,10 @@ export default {
</script>
<style scoped>
div {
align-items: center;
display: flex;
gap: 5px;
justify-content: center;
}
div {
align-items: center;
display: flex;
gap: 5px;
justify-content: center;
}
</style>

45
src/components/Player/Volume.vue
View File

@ -1,27 +1,28 @@
<template>
<div>
<VolumeHighIcon v-if="player.volume > 0.7"
<VolumeHighIcon v-if="player.volume > 0.7" class="pointer" :size="30" @click="mute" />
<VolumeLowIcon
v-if="player.volume > 0 && player.volume <= 0.3"
class="pointer"
:size="30"
@click="mute" />
<VolumeLowIcon v-if="player.volume > 0 && player.volume <= 0.3"
<VolumeMediumIcon
v-if="player.volume > 0.3 && player.volume <= 0.7"
class="pointer"
:size="30"
@click="mute" />
<VolumeMediumIcon v-if="player.volume > 0.3 && player.volume <= 0.7"
class="pointer"
:size="30"
@click="mute" />
<VolumeMuteIcon v-if="player.volume === 0"
<VolumeMuteIcon
v-if="player.volume === 0"
class="pointer"
:size="30"
@click="$store.dispatch('player/volume', volumeMuted)" />
<input max="1"
<input
max="1"
min="0"
step="0.1"
type="range"
:value="player.volume"
@change="(event) => $store.dispatch('player/volume', event.target.value)">
@change="(event) => $store.dispatch('player/volume', event.target.value)" />
</div>
</template>
@ -59,19 +60,19 @@ export default {
</script>
<style scoped>
div {
align-items: center;
display: flex;
gap: 5px;
justify-content: flex-end;
}
div {
align-items: center;
display: flex;
gap: 5px;
justify-content: flex-end;
}
input {
transform: rotate(270deg);
width: 4rem;
}
input {
transform: rotate(270deg);
width: 4rem;
}
.pointer {
cursor: pointer;
}
.pointer {
cursor: pointer;
}
</style>

3
src/components/Settings/Export.vue
View File

@ -1,5 +1,6 @@
<template>
<NcAppNavigationItem :href="generateUrl('/apps/repod/opml/export')"
<NcAppNavigationItem
:href="generateUrl('/apps/repod/opml/export')"
:name="t('repod', 'Export subscriptions')">
<template #icon>
<ExportIcon :size="20" />

36
src/components/Settings/Filters.vue
View File

@ -1,23 +1,41 @@
<template>
<NcAppNavigationItem :allow-collapse="true"
<NcAppNavigationItem
:allow-collapse="true"
menu-placement="top"
:name="t('repod', 'Filtering episodes')">
<template #actions>
<NcActionCheckbox :checked="all"
<NcActionCheckbox
:checked="all"
:disabled="all"
@update:checked="(checked) => $store.commit('settings/filters', { listened: checked, listening: checked, unlistened: checked })">
@update:checked="
(checked) =>
$store.commit('settings/filters', {
listened: checked,
listening: checked,
unlistened: checked,
})
">
{{ t('repod', 'Show all') }}
</NcActionCheckbox>
<NcActionCheckbox :checked="filters.listened"
@update:checked="(checked) => $store.commit('settings/filters', { listened: checked })">
<NcActionCheckbox
:checked="filters.listened"
@update:checked="
(checked) => $store.commit('settings/filters', { listened: checked })
">
{{ t('repod', 'Listened') }}
</NcActionCheckbox>
<NcActionCheckbox :checked="filters.listening"
@update:checked="(checked) => $store.commit('settings/filters', { listening: checked })">
<NcActionCheckbox
:checked="filters.listening"
@update:checked="
(checked) => $store.commit('settings/filters', { listening: checked })
">
{{ t('repod', 'Listening') }}
</NcActionCheckbox>
<NcActionCheckbox :checked="filters.unlistened"
@update:checked="(checked) => $store.commit('settings/filters', { unlistened: checked })">
<NcActionCheckbox
:checked="filters.unlistened"
@update:checked="
(checked) => $store.commit('settings/filters', { unlistened: checked })
">
{{ t('repod', 'Unlistened') }}
</NcActionCheckbox>
</template>

22
src/components/Settings/Import.vue
View File

@ -4,16 +4,18 @@
<NcModal v-if="modal" @close="modal = false">
<div class="modal">
<h2>{{ t('repod', 'Import OPML file') }}</h2>
<form v-if="!loading"
<form
v-if="!loading"
:action="generateUrl('/apps/repod/opml/import')"
enctype="multipart/form-data"
method="post"
@submit.prevent="importOpml">
<input accept="application/xml,.opml"
<input
accept="application/xml,.opml"
name="import"
required
type="file">
<input type="submit">
type="file" />
<input type="submit" />
</form>
<Loading v-if="loading" />
</div>
@ -64,10 +66,10 @@ export default {
</script>
<style scoped>
.modal {
align-items: center;
display: flex;
flex-direction: column;
margin: 2rem;
}
.modal {
align-items: center;
display: flex;
flex-direction: column;
margin: 2rem;
}
</style>

3
src/components/Settings/Rate.vue
View File

@ -1,5 +1,6 @@
<template>
<NcAppNavigationItem href="https://apps.nextcloud.com/apps/repod#comments"
<NcAppNavigationItem
href="https://apps.nextcloud.com/apps/repod#comments"
:name="t('repod', 'Rate RePod ❤️')">
<template #icon>
<StarIcon :size="20" />

34
src/components/Settings/Speed.vue
View File

@ -2,15 +2,9 @@
<NcAppNavigationItem :name="t('repod', 'Playback speed')">
<template #extra>
<div class="extra">
<MinusIcon class="pointer"
:size="20"
@click="changeRate(-.1)" />
<NcCounterBubble class="counter">
x{{ player.rate }}
</NcCounterBubble>
<PlusIcon class="pointer"
:size="20"
@click="changeRate(.1)" />
<MinusIcon class="pointer" :size="20" @click="changeRate(-0.1)" />
<NcCounterBubble class="counter"> x{{ player.rate }} </NcCounterBubble>
<PlusIcon class="pointer" :size="20" @click="changeRate(0.1)" />
</div>
</template>
<template #icon>
@ -55,17 +49,17 @@ export default {
</script>
<style scoped>
.counter {
height: 20px;
}
.counter {
height: 20px;
}
.extra {
align-items: center;
display: flex;
gap: .5rem;
}
.extra {
align-items: center;
display: flex;
gap: 0.5rem;
}
.pointer {
cursor: pointer;
}
.pointer {
cursor: pointer;
}
</style>

21
src/components/Sidebar/Item.vue
View File

@ -1,9 +1,8 @@
<template>
<NcAppNavigationItem :loading="loading"
:name="feed ? feed.title : url"
:to="hash">
<NcAppNavigationItem :loading="loading" :name="feed ? feed.title : url" :to="hash">
<template #actions>
<NcActionButton :aria-label="t(`core`, 'Delete')"
<NcActionButton
:aria-label="t(`core`, 'Delete')"
:name="t(`core`, 'Delete')"
:title="t(`core`, 'Delete')"
@click="deleteSubscription">
@ -13,7 +12,8 @@
</NcActionButton>
</template>
<template #icon>
<NcAvatar v-if="feed"
<NcAvatar
v-if="feed"
:display-name="feed.author || feed.title"
:is-no-user="true"
:url="feed.imageUrl" />
@ -60,7 +60,11 @@ export default {
},
async mounted() {
try {
const podcastData = await axios.get(generateUrl('/apps/gpoddersync/personal_settings/podcast_data?url={url}', { url: this.url }))
const podcastData = await axios.get(
generateUrl('/apps/gpoddersync/personal_settings/podcast_data?url={url}', {
url: this.url,
}),
)
this.feed = podcastData.data.data
} catch (e) {
this.failed = true
@ -74,7 +78,10 @@ export default {
if (confirm(t('repod', 'Are you sure you want to delete this subscription?'))) {
try {
this.loading = true
await axios.post(generateUrl('/apps/gpoddersync/subscription_change/create'), { add: [], remove: [this.url] })
await axios.post(
generateUrl('/apps/gpoddersync/subscription_change/create'),
{ add: [], remove: [this.url] },
)
} catch (e) {
console.error(e)
showError(t('repod', 'Error while removing the feed'))

3
src/components/Sidebar/Subscriptions.vue
View File

@ -11,7 +11,8 @@
</router-link>
<Loading v-if="loading" />
<NcAppNavigationList v-if="!loading">
<Item v-for="subscriptionUrl of subscriptions"
<Item
v-for="subscriptionUrl of subscriptions"
:key="subscriptionUrl"
:url="subscriptionUrl" />
</NcAppNavigationList>

2
src/main.js
View File

@ -14,5 +14,5 @@ export default new Vue({
el: '#content',
router,
store,
render: h => h(App),
render: (h) => h(App),
})

14
src/store/player.js
View File

@ -54,7 +54,11 @@ export const player = {
audio.load()
audio.play()
if (episode.action && episode.action.position && episode.action.position < episode.action.total) {
if (
episode.action &&
episode.action.position &&
episode.action.position < episode.action.total
) {
audio.currentTime = episode.action.position
state.started = audio.currentTime
}
@ -84,7 +88,9 @@ export const player = {
load: async (context, episode) => {
context.commit('episode', episode)
try {
const action = await axios.get(generateUrl('/apps/repod/episodes/action?url={url}', { url: episode.url }))
const action = await axios.get(
generateUrl('/apps/repod/episodes/action?url={url}', { url: episode.url }),
)
context.commit('action', action.data)
} catch {}
},
@ -118,7 +124,9 @@ export const player = {
position: Math.round(audio.currentTime),
total: Math.round(audio.duration),
}
axios.post(generateUrl('/apps/gpoddersync/episode_action/create'), [episode.action])
axios.post(generateUrl('/apps/gpoddersync/episode_action/create'), [
episode.action,
])
EventBus.$emit('updateEpisodesList', episode)
},
volume: (_, volume) => {

13
src/store/subscriptions.js
View File

@ -13,9 +13,16 @@ export const subscriptions = {
},
actions: {
fetch: async (context) => {
const metrics = await axios.get(generateUrl('/apps/gpoddersync/personal_settings/metrics'))
const subs = [...metrics.data.subscriptions].sort((a, b) => b.listenedSeconds - a.listenedSeconds)
context.commit('set', subs.map(sub => sub.url))
const metrics = await axios.get(
generateUrl('/apps/gpoddersync/personal_settings/metrics'),
)
const subs = [...metrics.data.subscriptions].sort(
(a, b) => b.listenedSeconds - a.listenedSeconds,
)
context.commit(
'set',
subs.map((sub) => sub.url),
)
},
},
}

4
src/utils/cookies.js
View File

@ -6,9 +6,7 @@
*/
export const getCookie = (name) => {
const cookies = document.cookie.split('; ')
const value = cookies
.find(c => c.startsWith(name + '='))
?.split('=')[1]
const value = cookies.find((c) => c.startsWith(name + '='))?.split('=')[1]
if (value === undefined) {
return null
}

4
src/utils/debounce.js
View File

@ -1,11 +1,11 @@
// https://stackoverflow.com/a/53486112
export const debounce = (fn, delay) => {
let timeoutID = null
return function() {
return function () {
clearTimeout(timeoutID)
const args = arguments
const that = this
timeoutID = setTimeout(function() {
timeoutID = setTimeout(function () {
fn.apply(that, args)
}, delay)
}

4
src/utils/text.js
View File

@ -1,7 +1,7 @@
// https://stackoverflow.com/a/5002618
export const cleanHtml = (text) => {
const pre = document.createElement('pre')
pre.innerHTML = text.replace(/<br\s*\/?>/mg, '\n')
pre.innerHTML = text.replace(/<br\s*\/?>/gm, '\n')
const strippedText = pre.textContent || pre.innerText || ''
return strippedText.replace(/\n/mg, '<br>')
return strippedText.replace(/\n/gm, '<br>')
}

7
src/utils/time.js
View File

@ -36,7 +36,8 @@ export const formatEpisodeTimestamp = (date) => {
* @param {Date} date The date
* @return {string}
*/
export const formatLocaleDate = (date) => date.toLocaleDateString(undefined, { dateStyle: 'medium' })
export const formatLocaleDate = (date) =>
date.toLocaleDateString(undefined, { dateStyle: 'medium' })
/**
* Returns the number of seconds from a duration feed's entry
@ -46,7 +47,7 @@ export const formatLocaleDate = (date) => date.toLocaleDateString(undefined, { d
export const durationToSeconds = (duration) => {
const splitDuration = duration.split(':').reverse()
let seconds = parseInt(splitDuration[0])
seconds += (splitDuration.length > 1) ? parseInt(splitDuration[1]) * 60 : 0
seconds += (splitDuration.length > 2) ? parseInt(splitDuration[2]) * 60 * 60 : 0
seconds += splitDuration.length > 1 ? parseInt(splitDuration[1]) * 60 : 0
seconds += splitDuration.length > 2 ? parseInt(splitDuration[2]) * 60 * 60 : 0
return seconds
}

6
src/views/Discover.vue
View File

@ -37,7 +37,7 @@ export default {
</script>
<style scoped>
.main {
padding: 15px 51px;
}
.main {
padding: 15px 51px;
}
</style>

17
src/views/Feed.vue
View File

@ -1,14 +1,13 @@
<template>
<AppContent>
<Loading v-if="loading" />
<NcEmptyContent v-if="failed"
class="error"
:name="t('repod', 'Error loading feed')">
<NcEmptyContent v-if="failed" class="error" :name="t('repod', 'Error loading feed')">
<template #icon>
<Alert />
</template>
</NcEmptyContent>
<Banner v-if="feed"
<Banner
v-if="feed"
:author="feed.author"
:description="feed.description"
:image-url="feed.imageUrl"
@ -53,7 +52,9 @@ export default {
},
async mounted() {
try {
const podcastData = await axios.get(generateUrl('/apps/repod/podcast?url={url}', { url: this.url }))
const podcastData = await axios.get(
generateUrl('/apps/repod/podcast?url={url}', { url: this.url }),
)
this.feed = podcastData.data
} catch (e) {
this.failed = true
@ -66,7 +67,7 @@ export default {
</script>
<style scoped>
.error {
margin: 2rem;
}
.error {
margin: 2rem;
}
</style>

6
src/views/GPodder.vue
View File

@ -14,11 +14,7 @@
</template>
<script>
import {
NcAppContent,
NcButton,
NcEmptyContent,
} from '@nextcloud/vue'
import { NcAppContent, NcButton, NcEmptyContent } from '@nextcloud/vue'
import Alert from 'vue-material-design-icons/Alert.vue'
import { generateUrl } from '@nextcloud/router'