MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-11-22 02:35:32 -05:00
Code Issues Packages Projects Releases Wiki Activity

[web] Refactor API calls

Browse Source
This commit is contained in:
Alain Nussbaumer
2025-05-04 11:36:34 +02:00
parent 3677f9d757
commit 80b9d8d648
87 changed files with 763 additions and 844 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web-src/src/components/ControlMainVolume.vue
View File

@@ -18,8 +18,8 @@
<script>
import ControlSlider from '@/components/ControlSlider.vue'
import player from '@/api/player'
import { usePlayerStore } from '@/stores/player'
import webapi from '@/webapi'
export default {
name: 'ControlVolume',
@@ -48,7 +48,7 @@ export default {
},
methods: {
changeVolume() {
webapi.player_volume(this.player.volume)
player.volume(this.player.volume)
},
toggle() {
this.player.volume = this.player.volume > 0 ? 0 : this.volume

10
web-src/src/components/ControlOutputVolume.vue
View File

@@ -27,7 +27,8 @@
<script>
import ControlSlider from '@/components/ControlSlider.vue'
import webapi from '@/webapi'
import outputs from '@/api/outputs'
import player from '@/api/player'
export default {
name: 'ControlOutputVolume',
@@ -63,13 +64,10 @@ export default {
methods: {
changeVolume() {
webapi.player_output_volume(this.output.id, this.volume)
player.outputVolume(this.output.id, this.volume)
},
toggle() {
const values = {
selected: !this.output.selected
}
webapi.output_update(this.output.id, values)
outputs.update(this.output.id, { selected: !this.output.selected })
}
}
}

6
web-src/src/components/ControlPlayerBack.vue
View File

@@ -9,9 +9,9 @@
</template>
<script>
import player from '@/api/player'
import { usePlayerStore } from '@/stores/player'
import { useQueueStore } from '@/stores/queue'
import webapi from '@/webapi'
export default {
name: 'ControlPlayerBack',
@@ -40,9 +40,7 @@ export default {
},
methods: {
seek() {
if (!this.disabled) {
webapi.player_seek(this.offset * -1)
}
player.seek(this.offset * -1)
}
}
}

8
web-src/src/components/ControlPlayerConsume.vue
View File

@@ -1,17 +1,17 @@
<template>
<a :class="{ 'is-dark': playerStore.consume }" @click="toggle">
<button :class="{ 'is-dark': playerStore.consume }" @click="toggle">
<mdicon
class="icon"
name="fire"
size="16"
:title="$t('player.button.consume')"
/>
</a>
</button>
</template>
<script>
import player from '@/api/player'
import { usePlayerStore } from '@/stores/player'
import webapi from '@/webapi'
export default {
name: 'ControlPlayerConsume',
@@ -22,7 +22,7 @@ export default {
},
methods: {
toggle() {
webapi.player_consume(!this.playerStore.consume)
player.consume(!this.playerStore.consume)
}
}
}

6
web-src/src/components/ControlPlayerForward.vue
View File

@@ -9,9 +9,9 @@
</template>
<script>
import player from '@/api/player'
import { usePlayerStore } from '@/stores/player'
import { useQueueStore } from '@/stores/queue'
import webapi from '@/webapi'
export default {
name: 'ControlPlayerForward',
@@ -40,9 +40,7 @@ export default {
},
methods: {
seek() {
if (!this.disabled) {
webapi.player_seek(this.offset)
}
player.seek(this.offset)
}
}
}

7
web-src/src/components/ControlPlayerLyrics.vue
View File

@@ -1,12 +1,15 @@
<template>
<a :class="{ 'is-dark': lyricsStore.active }" @click="lyricsStore.toggle">
<button
:class="{ 'is-dark': lyricsStore.active }"
@click="lyricsStore.toggle"
>
<mdicon
class="icon"
:name="icon"
:size="16"
:title="$t('player.button.toggle-lyrics')"
/>
</a>
</button>
</template>
<script>

7
web-src/src/components/ControlPlayerNext.vue
View File

@@ -9,8 +9,8 @@
</template>
<script>
import player from '@/api/player'
import { useQueueStore } from '@/stores/queue'
import webapi from '@/webapi'
export default {
name: 'ControlPlayerNext',
@@ -24,10 +24,7 @@ export default {
},
methods: {
next() {
if (this.disabled) {
return
}
webapi.player_next()
player.next()
}
}
}

19
web-src/src/components/ControlPlayerPlay.vue
View File

@@ -5,16 +5,14 @@
</template>
<script>
import { useNotificationsStore } from '@/stores/notifications'
import player from '@/api/player'
import { usePlayerStore } from '@/stores/player'
import { useQueueStore } from '@/stores/queue'
import webapi from '@/webapi'
export default {
name: 'ControlPlayerPlay',
setup() {
return {
notificationsStore: useNotificationsStore(),
playerStore: usePlayerStore(),
queueStore: useQueueStore()
}
@@ -34,24 +32,15 @@ export default {
},
methods: {
toggle() {
if (this.disabled) {
this.notificationsStore.add({
text: this.$t('server.empty-queue'),
timeout: 2000,
topic: 'connection',
type: 'info'
})
return
}
if (this.playerStore.isPlaying && this.queueStore.isPauseAllowed) {
webapi.player_pause()
player.pause()
} else if (
this.playerStore.isPlaying &&
!this.queueStore.isPauseAllowed
) {
webapi.player_stop()
player.stop()
} else {
webapi.player_play()
player.play()
}
}
}

11
web-src/src/components/ControlPlayerPrevious.vue
View File

@@ -1,5 +1,5 @@
<template>
<a :disabled="disabled" @click="playPrevious">
<a :disabled="disabled" @click="previous">
<mdicon
class="icon"
name="skip-backward"
@@ -9,8 +9,8 @@
</template>
<script>
import player from '@/api/player'
import { useQueueStore } from '@/stores/queue'
import webapi from '@/webapi'
export default {
name: 'ControlPlayerPrevious',
@@ -23,11 +23,8 @@ export default {
}
},
methods: {
playPrevious() {
if (this.disabled) {
return
}
webapi.player_previous()
previous() {
player.previous()
}
}
}

12
web-src/src/components/ControlPlayerRepeat.vue
View File

@@ -1,17 +1,17 @@
<template>
<a :class="{ 'is-dark': !playerStore.isRepeatOff }" @click="toggle">
<button :class="{ 'is-dark': !playerStore.isRepeatOff }" @click="toggle">
<mdicon
class="icon"
:name="icon"
:size="16"
:title="$t(`player.button.${icon}`)"
/>
</a>
</button>
</template>
<script>
import player from '@/api/player'
import { usePlayerStore } from '@/stores/player'
import webapi from '@/webapi'
export default {
name: 'ControlPlayerRepeat',
@@ -31,11 +31,11 @@ export default {
methods: {
toggle() {
if (this.playerStore.isRepeatAll) {
webapi.player_repeat('single')
player.repeat('single')
} else if (this.playerStore.isRepeatSingle) {
webapi.player_repeat('off')
player.repeat('off')
} else {
webapi.player_repeat('all')
player.repeat('all')
}
}
}

8
web-src/src/components/ControlPlayerShuffle.vue
View File

@@ -1,17 +1,17 @@
<template>
<a :class="{ 'is-dark': playerStore.shuffle }" @click="toggle">
<button :class="{ 'is-dark': playerStore.shuffle }" @click="toggle">
<mdicon
class="icon"
:name="icon"
:size="16"
:title="$t(`player.button.${icon}`)"
/>
</a>
</button>
</template>
<script>
import player from '@/api/player'
import { usePlayerStore } from '@/stores/player'
import webapi from '@/webapi'
export default {
name: 'ControlPlayerShuffle',
@@ -28,7 +28,7 @@ export default {
},
methods: {
toggle() {
webapi.player_shuffle(!this.playerStore.shuffle)
player.shuffle(!this.playerStore.shuffle)
}
}
}

6
web-src/src/components/ControlSetting.vue
View File

@@ -19,8 +19,8 @@
</template>
<script>
import settings from '@/api/settings'
import { useSettingsStore } from '@/stores/settings'
import webapi from '@/webapi'
export default {
name: 'ControlSetting',
@@ -60,8 +60,8 @@ export default {
name: this.name,
value
}
webapi
.settings_update(this.category, setting)
settings
.update(this.category, setting)
.then(() => {
window.clearTimeout(this.timerId)
this.settingsStore.update(setting)

4
web-src/src/components/ListDirectories.vue
View File

@@ -9,9 +9,7 @@
<nav class="breadcrumb">
<ul>
<li v-for="directory in directories" :key="directory.index">
<a @click="open(directory)">
<span v-text="directory.name" />
</a>
<a @click="open(directory)" v-text="directory.name" />
</li>
</ul>
</nav>

4
web-src/src/components/ListItemQueueItem.vue
View File

@@ -46,8 +46,8 @@
</template>
<script>
import player from '@/api/player'
import { usePlayerStore } from '@/stores/player'
import webapi from '@/webapi'
export default {
name: 'ListItemQueueItem',
@@ -71,7 +71,7 @@ export default {
},
methods: {
play() {
webapi.player_play({ item_id: this.item.id })
player.play({ item_id: this.item.id })
}
}
}

8
web-src/src/components/ListTracks.vue
View File

@@ -22,7 +22,7 @@
<script>
import ListItem from '@/components/ListItem.vue'
import ModalDialogTrack from '@/components/ModalDialogTrack.vue'
import webapi from '@/webapi'
import queue from '@/api/queue'
export default {
name: 'ListTracks',
@@ -44,15 +44,15 @@ export default {
},
open(item) {
if (this.uris) {
webapi.player_play_uri(this.uris, false, this.items.items.indexOf(item))
queue.playUri(this.uris, false, this.items.items.indexOf(item))
} else if (this.expression) {
webapi.player_play_expression(
queue.playExpression(
this.expression,
false,
this.items.items.indexOf(item)
)
} else {
webapi.player_play_uri(item.uri, false)
queue.playUri(item.uri, false)
}
},
openDetails(item) {

8
web-src/src/components/ListTracksSpotify.vue
View File

@@ -31,7 +31,7 @@
import ListItem from '@/components/ListItem.vue'
import LoaderListItem from '@/components/LoaderListItem.vue'
import ModalDialogTrackSpotify from '@/components/ModalDialogTrackSpotify.vue'
import webapi from '@/webapi'
import queue from '@/api/queue'
export default {
name: 'ListTracksSpotify',
@@ -48,11 +48,7 @@ export default {
methods: {
open(item) {
if (item.is_playable) {
webapi.player_play_uri(
this.contextUri || item.uri,
false,
item.position || 0
)
queue.playUri(this.contextUri || item.uri, false, item.position || 0)
}
},
openDetails(item) {

6
web-src/src/components/ModalDialogAddRss.vue
View File

@@ -22,7 +22,7 @@
<script>
import ControlUrlField from '@/components/ControlUrlField.vue'
import ModalDialog from '@/components/ModalDialog.vue'
import webapi from '@/webapi'
import library from '@/api/library'
export default {
name: 'ModalDialogAddRss',
@@ -55,8 +55,8 @@ export default {
methods: {
add() {
this.loading = true
webapi
.library_add(this.url)
library
.add(this.url)
.then(() => {
this.$emit('podcast-added')
this.$emit('close')

10
web-src/src/components/ModalDialogAddStream.vue
View File

@@ -21,7 +21,7 @@
<script>
import ControlUrlField from '@/components/ControlUrlField.vue'
import ModalDialog from '@/components/ModalDialog.vue'
import webapi from '@/webapi'
import queue from '@/api/queue'
export default {
name: 'ModalDialogAddStream',
@@ -60,8 +60,8 @@ export default {
methods: {
add() {
this.loading = true
webapi
.queue_add(this.url)
queue
.add(this.url)
.then(() => {
this.$emit('close')
})
@@ -79,8 +79,8 @@ export default {
},
play() {
this.loading = true
webapi
.player_play_uri(this.url, false)
queue
.playUri(this.url, false)
.then(() => {
this.$emit('close')
this.url = ''

24
web-src/src/components/ModalDialogAlbum.vue
View File

@@ -28,7 +28,7 @@
<script>
import ModalDialog from '@/components/ModalDialog.vue'
import ModalDialogPlayable from '@/components/ModalDialogPlayable.vue'
import webapi from '@/webapi'
import library from '@/api/library'
export default {
name: 'ModalDialogAlbum',
@@ -60,7 +60,7 @@ export default {
]
},
buttons() {
if (this.media_kind_resolved === 'podcast') {
if (this.mediaKindResolved === 'podcast') {
if (this.item.data_kind === 'url') {
return [
{ handler: this.markAsPlayed, key: 'actions.mark-as-played' },
@@ -74,7 +74,7 @@ export default {
}
return []
},
media_kind_resolved() {
mediaKindResolved() {
return this.mediaKind || this.item.media_kind
},
playable() {
@@ -115,16 +115,14 @@ export default {
this.showRemovePodcastModal = false
},
markAsPlayed() {
webapi
.library_album_track_update(this.item.id, { play_count: 'played' })
.then(() => {
this.$emit('play-count-changed')
this.$emit('close')
})
library.updateAlbum(this.item.id, { play_count: 'played' }).then(() => {
this.$emit('play-count-changed')
this.$emit('close')
})
},
openArtist() {
this.$emit('close')
if (this.media_kind_resolved === 'audiobook') {
if (this.mediaKindResolved === 'audiobook') {
this.$router.push({
name: 'audiobooks-artist',
params: { id: this.item.artist_id }
@@ -142,10 +140,10 @@ export default {
},
removePodcast() {
this.showRemovePodcastModal = false
webapi.library_album_tracks(this.item.id, { limit: 1 }).then((album) => {
webapi.library_track_playlists(album.items[0].id).then((data) => {
library.albumTracks(this.item.id, { limit: 1 }).then((album) => {
library.trackPlaylists(album.items[0].id).then((data) => {
const { id } = data.items.find((item) => item.type === 'rss')
webapi.library_playlist_delete(id).then(() => {
library.playlistDelete(id).then(() => {
this.$emit('podcast-deleted')
this.$emit('close')
})

14
web-src/src/components/ModalDialogPlayable.vue
View File

@@ -25,7 +25,7 @@
import ControlButton from '@/components/ControlButton.vue'
import ListProperties from '@/components/ListProperties.vue'
import ModalDialog from '@/components/ModalDialog.vue'
import webapi from '@/webapi'
import queue from '@/api/queue'
export default {
name: 'ModalDialogPlayable',
@@ -53,25 +53,25 @@ export default {
play() {
this.$emit('close')
if (this.item.expression) {
webapi.player_play_expression(this.item.expression, false)
queue.playExpression(this.item.expression, false)
} else {
webapi.player_play_uri(this.item.uris || this.item.uri, false)
queue.playUri(this.item.uris || this.item.uri, false)
}
},
addToQueue() {
this.$emit('close')
if (this.item.expression) {
webapi.queue_expression_add(this.item.expression)
queue.addExpression(this.item.expression)
} else {
webapi.queue_add(this.item.uris || this.item.uri)
queue.addUri(this.item.uris || this.item.uri)
}
},
addNextToQueue() {
this.$emit('close')
if (this.item.expression) {
webapi.queue_expression_add_next(this.item.expression)
queue.addExpression(this.item.expression, true)
} else {
webapi.queue_add_next(this.item.uris || this.item.uri)
queue.addUri(this.item.uris || this.item.uri, true)
}
}
}

6
web-src/src/components/ModalDialogPlaylistSave.vue
View File

@@ -30,7 +30,7 @@
<script>
import ModalDialog from '@/components/ModalDialog.vue'
import webapi from '@/webapi'
import queue from '@/api/queue'
export default {
name: 'ModalDialogPlaylistSave',
@@ -81,8 +81,8 @@ export default {
},
save() {
this.loading = true
webapi
.queue_save_playlist(this.playlistName)
queue
.saveToPlaylist(this.playlistName)
.then(() => {
this.$emit('close')
this.playlistName = ''

7
web-src/src/components/ModalDialogQueueItem.vue
View File

@@ -15,8 +15,9 @@
import ListProperties from '@/components/ListProperties.vue'
import ModalDialog from '@/components/ModalDialog.vue'
import SpotifyWebApi from 'spotify-web-api-js'
import player from '@/api/player'
import queue from '@/api/queue'
import { useServicesStore } from '@/stores/services'
import webapi from '@/webapi'
export default {
name: 'ModalDialogQueueItem',
@@ -158,11 +159,11 @@ export default {
},
play() {
this.$emit('close')
webapi.player_play({ item_id: this.item.id })
player.play({ item_id: this.item.id })
},
remove() {
this.$emit('close')
webapi.queue_remove(this.item.id)
queue.remove(this.item.id)
}
}
}

4
web-src/src/components/ModalDialogRemotePairing.vue
View File

@@ -20,8 +20,8 @@
<script>
import ControlPinField from '@/components/ControlPinField.vue'
import ModalDialog from '@/components/ModalDialog.vue'
import remotes from '@/api/remotes'
import { useRemotesStore } from '@/stores/remotes'
import webapi from '@/webapi'
export default {
name: 'ModalDialogRemotePairing',
@@ -59,7 +59,7 @@ export default {
this.disabled = disabled
},
pair() {
webapi.pairing_kickoff({ pin: this.pin }).then(() => {
remotes.pair(this.pin).then(() => {
this.pin = ''
})
}

16
web-src/src/components/ModalDialogTrack.vue
View File

@@ -9,7 +9,7 @@
<script>
import ModalDialogPlayable from '@/components/ModalDialogPlayable.vue'
import webapi from '@/webapi'
import library from '@/api/library'
export default {
name: 'ModalDialogTrack',
@@ -92,16 +92,14 @@ export default {
},
methods: {
markAsNew() {
webapi
.library_track_update(this.item.id, { play_count: 'reset' })
.then(() => {
this.$emit('play-count-changed')
this.$emit('close')
})
library.updateTrack(this.item.id, { play_count: 'reset' }).then(() => {
this.$emit('play-count-changed')
this.$emit('close')
})
},
markAsPlayed() {
webapi
.library_track_update(this.item.id, { play_count: 'increment' })
library
.updateTrack(this.item.id, { play_count: 'increment' })
.then(() => {
this.$emit('play-count-changed')
this.$emit('close')

20
web-src/src/components/ModalDialogUpdate.vue
View File

@@ -7,10 +7,7 @@
>
<template #content>
<div v-if="!libraryStore.updating">
<div
v-if="servicesStore.isSpotifyActive || rss.tracks > 0"
class="field"
>
<div v-if="servicesStore.isSpotifyActive" class="field">
<label class="label" v-text="$t('dialog.update.info')" />
<div class="control">
<div class="select is-small">
@@ -22,11 +19,7 @@
value="spotify"
v-text="$t('dialog.update.spotify')"
/>
<option
v-if="rss.tracks > 0"
value="rss"
v-text="$t('dialog.update.feeds')"
/>
<option value="rss" v-text="$t('dialog.update.feeds')" />
</select>
</div>
</div>
@@ -47,9 +40,9 @@
<script>
import ControlSwitch from '@/components/ControlSwitch.vue'
import ModalDialog from '@/components/ModalDialog.vue'
import library from '@/api/library'
import { useLibraryStore } from '@/stores/library'
import { useServicesStore } from '@/stores/services'
import webapi from '@/webapi'
export default {
name: 'ModalDialogUpdate',
@@ -80,17 +73,14 @@ export default {
})
}
return actions
},
rss() {
return this.libraryStore.rss
}
},
methods: {
analyse() {
if (this.rescanMetadata) {
webapi.library_rescan(this.libraryStore.update_dialog_scan_kind)
library.rescan(this.libraryStore.update_dialog_scan_kind)
} else {
webapi.library_update(this.libraryStore.update_dialog_scan_kind)
library.update(this.libraryStore.update_dialog_scan_kind)
}
},
cancel() {