Loading to Atoms
All checks were successful
repod / nextcloud (push) Successful in 1m17s
repod / xml (push) Successful in 25s
repod / nodejs (push) Successful in 2m19s

This commit is contained in:
Michel Roux 2023-12-23 22:49:23 +01:00
parent ea0bfcc532
commit 893f3acaed
7 changed files with 42 additions and 37 deletions

View File

@ -0,0 +1,20 @@
<template>
<NcLoadingIcon class="loading" />
</template>
<script>
import { NcLoadingIcon } from '@nextcloud/vue'
export default {
name: 'Loading',
components: {
NcLoadingIcon,
},
}
</script>
<style scoped>
.loading {
margin: 2rem 0;
}
</style>

View File

@ -1,6 +1,6 @@
<template>
<div>
<NcLoadingIcon v-if="loading" />
<Loading v-if="loading" />
<ul v-if="!loading">
<NcListItem v-for="feed in feeds"
:key="feed.link"
@ -21,7 +21,8 @@
</template>
<script>
import { NcAvatar, NcListItem, NcLoadingIcon } from '@nextcloud/vue'
import { NcAvatar, NcListItem } from '@nextcloud/vue'
import Loading from '../Atoms/Loading.vue'
import axios from '@nextcloud/axios'
import { debounce } from '../../utils/debounce.js'
import { formatTimeAgo } from '../../utils/time.js'
@ -31,9 +32,9 @@ import { showError } from '@nextcloud/dialogs'
export default {
name: 'Search',
components: {
Loading,
NcAvatar,
NcListItem,
NcLoadingIcon,
},
props: {
value: {

View File

@ -1,6 +1,6 @@
<template>
<div>
<NcLoadingIcon v-if="loading" />
<Loading v-if="loading" />
<ul v-if="!loading" class="tops">
<li v-for="top in tops" :key="top.link">
<TopItem :author="top.author"
@ -16,7 +16,7 @@
</template>
<script>
import { NcLoadingIcon } from '@nextcloud/vue'
import Loading from '../Atoms/Loading.vue'
import TopItem from './TopItem.vue'
import axios from '@nextcloud/axios'
import { generateUrl } from '@nextcloud/router'
@ -25,7 +25,7 @@ import { showError } from '@nextcloud/dialogs'
export default {
name: 'TopList',
components: {
NcLoadingIcon,
Loading,
TopItem,
},
data() {

View File

@ -1,6 +1,6 @@
<template>
<div :class="currentEpisode ? 'margin' : ''">
<NcLoadingIcon v-if="loading" class="loading" />
<Loading v-if="loading" />
<ul v-if="!loading">
<NcListItem v-for="episode in episodes"
:key="episode.episodeGuid"
@ -38,8 +38,9 @@
</template>
<script>
import { NcActionButton, NcAvatar, NcListItem, NcLoadingIcon } from '@nextcloud/vue'
import { NcActionButton, NcAvatar, NcListItem } from '@nextcloud/vue'
import { formatTimeAgo, formatTimer } from '../../utils/time.js'
import Loading from '../Atoms/Loading.vue'
import PlayButton from 'vue-material-design-icons/Play.vue'
import StopButton from 'vue-material-design-icons/Stop.vue'
import axios from '@nextcloud/axios'
@ -49,10 +50,10 @@ import { showError } from '@nextcloud/dialogs'
export default {
name: 'Episodes',
components: {
Loading,
NcActionButton,
NcAvatar,
NcListItem,
NcLoadingIcon,
PlayButton,
StopButton,
},
@ -100,10 +101,6 @@ export default {
opacity: .5;
}
.loading {
margin: 2rem 0;
}
.margin {
margin-bottom: 6rem;
}

View File

@ -1,6 +1,6 @@
<template>
<div v-if="player.episode" class="footer">
<NcLoadingIcon v-if="!player.loaded" class="loading" />
<Loading v-if="!player.loaded" />
<ProgressBar v-if="player.loaded" />
<div v-if="player.loaded" class="player">
<img :src="player.episode.episodeImage">
@ -15,7 +15,7 @@
<script>
import Controls from './Controls.vue'
import Infos from './Infos.vue'
import { NcLoadingIcon } from '@nextcloud/vue'
import Loading from '../Atoms/Loading.vue'
import ProgressBar from './ProgressBar.vue'
import Timer from './Timer.vue'
import Volume from './Volume.vue'
@ -25,7 +25,7 @@ export default {
components: {
Controls,
Infos,
NcLoadingIcon,
Loading,
ProgressBar,
Timer,
Volume,
@ -63,8 +63,4 @@ export default {
.volume {
width: 10%;
}
.loading {
margin: 2rem 0;
}
</style>

View File

@ -8,7 +8,7 @@
</template>
</NcAppNavigationNew>
</router-link>
<NcLoadingIcon v-if="loading" />
<Loading v-if="loading" />
<ul v-if="!loading">
<Item v-for="subscriptionUrl of subscriptions"
:key="subscriptionUrl"
@ -19,13 +19,9 @@
</template>
<script>
import {
NcAppContentList,
NcAppNavigation,
NcAppNavigationNew,
NcLoadingIcon,
} from '@nextcloud/vue'
import { NcAppContentList, NcAppNavigation, NcAppNavigationNew } from '@nextcloud/vue'
import Item from './Item.vue'
import Loading from '../Atoms/Loading.vue'
import Plus from 'vue-material-design-icons/Plus.vue'
import { showError } from '@nextcloud/dialogs'
@ -33,10 +29,10 @@ export default {
name: 'Subscriptions',
components: {
Item,
Loading,
NcAppContentList,
NcAppNavigation,
NcAppNavigationNew,
NcLoadingIcon,
Plus,
},
data() {

View File

@ -1,6 +1,6 @@
<template>
<NcAppContent>
<NcLoadingIcon v-if="loading" class="loading" />
<Loading v-if="loading" />
<NcEmptyContent v-if="failed" :name="t('Error loading feed')">
<template #icon>
<Alert />
@ -17,10 +17,11 @@
</template>
<script>
import { NcAppContent, NcEmptyContent, NcLoadingIcon } from '@nextcloud/vue'
import { NcAppContent, NcEmptyContent } from '@nextcloud/vue'
import Alert from 'vue-material-design-icons/Alert.vue'
import Banner from '../components/Feed/Banner.vue'
import Episodes from '../components/Feed/Episodes.vue'
import Loading from '../components/Atoms/Loading.vue'
import axios from '@nextcloud/axios'
import { generateUrl } from '@nextcloud/router'
@ -30,9 +31,9 @@ export default {
Alert,
Banner,
Episodes,
Loading,
NcAppContent,
NcEmptyContent,
NcLoadingIcon,
},
data() {
return {
@ -59,9 +60,3 @@ export default {
},
}
</script>
<style scoped>
.loading {
margin: 2rem 0;
}
</style>