Skip to content
This repository was archived by the owner on Mar 11, 2025. It is now read-only.

Commit 68e57b0

Browse files
committed
Misc changes
1 parent 026bc99 commit 68e57b0

5 files changed

Lines changed: 47 additions & 123 deletions

File tree

src/mainWindow/components/musicbar/components/MusicInfo.vue

Lines changed: 15 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -10,26 +10,12 @@
1010
<template>
1111
<div class="h-100 w-100">
1212
<div v-if="computedImg" class="dark-overlay" :style="{ top: !hasFrame ? '-28px' : '0px' }"></div>
13-
<transition
14-
name="custom-fade"
15-
enter-active-class="animate__animated animate__fadeIn"
16-
leave-active-class="animate__animated animate__fadeOut animate__faster"
17-
>
18-
<video
19-
v-if="showSpotifyCanvas && spotifyCanvas"
20-
class="bg-img w-100 h-100"
21-
:src="spotifyCanvas"
22-
:key="spotifyCanvas"
23-
autoplay
24-
loop
25-
/>
26-
<b-img
27-
class="bg-img"
28-
v-else-if="computedImg"
29-
:src="computedImg"
30-
:key="computedImg"
31-
referrerPolicy="no-referrer"
32-
></b-img>
13+
<transition name="custom-fade" enter-active-class="animate__animated animate__fadeIn"
14+
leave-active-class="animate__animated animate__fadeOut animate__faster">
15+
<video v-if="showSpotifyCanvas && spotifyCanvas" class="bg-img w-100 h-100" :src="spotifyCanvas"
16+
:key="spotifyCanvas" autoplay loop />
17+
<b-img class="bg-img" v-else-if="computedImg" :src="computedImg" :key="computedImg"
18+
referrerPolicy="no-referrer"></b-img>
3319
</transition>
3420

3521
<b-container fluid class="w-100 h-100 main-container">
@@ -40,14 +26,8 @@
4026
</b-row>
4127
<b-row no-gutters align-h="center" class="h-100 flex-nowrap">
4228
<b-col cols="4">
43-
<SongDetailsCompact
44-
:cardHoverText="lyrics"
45-
:forceWhiteText="true"
46-
:currentSong="currentSong"
47-
:forceCover="computedImg"
48-
:isShowLyricsActive="showPlayer"
49-
@toggleLyrics="onToggleLyrics"
50-
/>
29+
<SongDetailsCompact :cardHoverText="lyrics" :forceWhiteText="true" :currentSong="currentSong"
30+
:forceCover="computedImg" :isShowLyricsActive="showPlayer" @toggleLyrics="onToggleLyrics" />
5131
<div class="audioStream-slot" v-show="showPlayer === 2">
5232
<b-container fluid class="scrollable">
5333
<b-row no-gutters>
@@ -74,21 +54,11 @@
7454
</b-row>
7555
<b-row class="queue-container-outer">
7656
<b-col class="h-100 queue-container mr-4">
77-
<RecycleScroller
78-
class="w-100 h-100"
79-
:items="queueOrder"
80-
:item-size="94"
81-
ref="recycle-scroller"
82-
key-field="id"
83-
:direction="'vertical'"
84-
>
57+
<RecycleScroller class="w-100 h-100" :items="queueOrder" :item-size="94" ref="recycle-scroller"
58+
key-field="id" :direction="'vertical'">
8559
<template v-slot="{ item, index }">
86-
<QueueItem
87-
:id="`queue-item-${item.id}`"
88-
:song="getSong(item.songID)"
89-
:index="index"
90-
:current="index === currentIndex"
91-
/>
60+
<QueueItem :id="`queue-item-${item.id}`" :song="getSong(item.songID)" :index="index"
61+
:current="index === currentIndex" />
9262
</template>
9363
</RecycleScroller>
9464
</b-col>
@@ -172,7 +142,8 @@ export default class MusicInfo extends mixins(ImageLoader, ModelHelper, JukeboxM
172142
return
173143
}
174144
175-
;(this.$refs['recycle-scroller'] as typeof RecycleScroller)?.$el.scrollTo({
145+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
146+
; (this.$refs['recycle-scroller'] as any)?.$el.scrollTo({
176147
top: this.currentIndex * 94,
177148
behavior: 'smooth'
178149
})
@@ -228,8 +199,7 @@ export default class MusicInfo extends mixins(ImageLoader, ModelHelper, JukeboxM
228199
} else {
229200
const searchRes = (
230201
await vxm.providers.spotifyProvider.searchSongs(
231-
`${
232-
this.currentSong.artists ? this.currentSong.artists?.map((val) => val.artist_name).join(', ') + ' - ' : ''
202+
`${this.currentSong.artists ? this.currentSong.artists?.map((val) => val.artist_name).join(', ') + ' - ' : ''
233203
}${this.currentSong.title}`
234204
)
235205
)[0]

src/mainWindow/components/songView/SongView.vue

Lines changed: 20 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -9,62 +9,27 @@
99

1010
<template>
1111
<b-container fluid class="song-container h-100" @contextmenu="onGeneralContextMenu">
12-
<transition
13-
name="custom-classes-transition"
12+
<transition name="custom-classes-transition"
1413
enter-active-class="animate__animated animate__slideInLeft animate__delay-1s animate__slideInLeft_delay"
15-
leave-active-class="animate__animated animate__slideOutRight animate__slideOutRight_faster"
16-
>
17-
<SongViewCompact
18-
v-if="songView === 'SongViewCompact'"
19-
:songList="filteredSongList"
20-
:currentSong="currentSong"
21-
:defaultDetails="defaultDetails"
22-
:detailsButtonGroup="detailsButtonGroup"
23-
:optionalProviders="optionalProviders"
24-
:isLoading="isLoading"
25-
@onItemsChanged="onOptionalProviderChanged"
26-
@onRowDoubleClicked="(song: Song) => queueSong([song])"
27-
@onRowContext="onSongContextMenu"
28-
@onRowSelected="updateCoverDetails"
29-
@onRowSelectionClear="clearSelection"
30-
@onRowPlayNowClicked="(song: Song) => playTop([song])"
31-
@onArtistClicked="gotoArtist"
32-
@onAlbumClicked="gotoAlbum"
33-
@playAll="playAll"
34-
@addToQueue="addToQueue"
35-
@addToLibrary="addToLibrary"
36-
@onSortClicked="showSortMenu"
37-
@onSearchChange="onSearchChange"
38-
@playRandom="playRandom"
39-
@fetchAll="fetchAll"
40-
@onScrollEnd="onScrollEnd"
41-
></SongViewCompact>
42-
43-
<SongViewClassic
44-
v-else
45-
:songList="filteredSongList"
46-
:currentSong="currentSong"
47-
:defaultDetails="defaultDetails"
48-
:detailsButtonGroup="detailsButtonGroup"
49-
:optionalProviders="optionalProviders"
50-
:isLoading="isLoading"
51-
@onItemsChanged="onOptionalProviderChanged"
52-
@onRowDoubleClicked="(song: Song) => queueSong([song])"
53-
@onRowContext="onSongContextMenu"
54-
@onRowSelected="updateCoverDetails"
55-
@onRowSelectionClear="clearSelection"
56-
@onRowPlayNowClicked="(song: Song) => playTop([song])"
57-
@onArtistClicked="gotoArtist"
58-
@onAlbumClicked="gotoAlbum"
59-
@playAll="playAll"
60-
@addToQueue="addToQueue"
61-
@addToLibrary="addToLibrary"
62-
@onSortClicked="showSortMenu"
63-
@onSearchChange="onSearchChange"
64-
@playRandom="playRandom"
65-
@fetchAll="fetchAll"
66-
@onScrollEnd="onScrollEnd"
67-
></SongViewClassic>
14+
leave-active-class="animate__animated animate__slideOutRight animate__slideOutRight_faster">
15+
<SongViewCompact v-if="songView === 'SongViewCompact'" :songList="filteredSongList" :currentSong="currentSong"
16+
:defaultDetails="defaultDetails" :detailsButtonGroup="detailsButtonGroup" :optionalProviders="optionalProviders"
17+
:isLoading="isLoading" @onItemsChanged="onOptionalProviderChanged"
18+
@onRowDoubleClicked="(song: Song) => queueSong([song])" @onRowContext="onSongContextMenu"
19+
@onRowSelected="updateCoverDetails" @onRowSelectionClear="clearSelection"
20+
@onRowPlayNowClicked="(song: Song) => playTop([song])" @onArtistClicked="gotoArtist" @onAlbumClicked="gotoAlbum"
21+
@playAll="playAll" @addToQueue="addToQueue" @addToLibrary="addToLibrary" @onSortClicked="showSortMenu"
22+
@onSearchChange="onSearchChange" @playRandom="playRandom" @fetchAll="fetchAll" @onScrollEnd="onScrollEnd">
23+
</SongViewCompact>
24+
25+
<SongViewClassic v-else :songList="filteredSongList" :currentSong="currentSong" :defaultDetails="defaultDetails"
26+
:detailsButtonGroup="detailsButtonGroup" :optionalProviders="optionalProviders" :isLoading="isLoading"
27+
@onItemsChanged="onOptionalProviderChanged" @onRowDoubleClicked="(song: Song) => queueSong([song])"
28+
@onRowContext="onSongContextMenu" @onRowSelected="updateCoverDetails" @onRowSelectionClear="clearSelection"
29+
@onRowPlayNowClicked="(song: Song) => playTop([song])" @onArtistClicked="gotoArtist" @onAlbumClicked="gotoAlbum"
30+
@playAll="playAll" @addToQueue="addToQueue" @addToLibrary="addToLibrary" @onSortClicked="showSortMenu"
31+
@onSearchChange="onSearchChange" @playRandom="playRandom" @fetchAll="fetchAll" @onScrollEnd="onScrollEnd">
32+
</SongViewClassic>
6833
</transition>
6934
</b-container>
7035
</template>

src/mainWindow/components/songView/components/SongListCompact.vue

Lines changed: 6 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -17,26 +17,13 @@
1717
</b-col>
1818
</b-row>
1919
<b-row no-gutters class="h-100">
20-
<RecycleScroller
21-
:class="`scroller w-100 ${isLoading ? 'low-height' : 'full-height'}`"
22-
:items="songList"
23-
:item-size="94"
24-
key-field="_id"
25-
:direction="'vertical'"
26-
@scroll-end="onScrollEnd"
27-
v-click-outside="clearSelection"
28-
>
20+
<RecycleScroller :class="`scroller w-100 ${isLoading ? 'low-height' : 'full-height'}`" :items="songList"
21+
:item-size="94" key-field="_id" :direction="'vertical'" @scroll-end="onScrollEnd"
22+
v-click-outside="clearSelection">
2923
<template v-slot="{ item, index }">
30-
<SongListCompactItem
31-
:item="item"
32-
:index="index"
33-
:selected="selected"
34-
@onRowDoubleClicked="onRowDoubleClicked"
35-
@onRowSelected="onRowSelected"
36-
@onRowContext="onRowContext"
37-
@onPlayNowClicked="onPlayNowClicked"
38-
@onArtistClicked="onArtistClicked"
39-
/>
24+
<SongListCompactItem :item="item" :index="index" :selected="selected" @onRowDoubleClicked="onRowDoubleClicked"
25+
@onRowSelected="onRowSelected" @onRowContext="onRowContext" @onPlayNowClicked="onPlayNowClicked"
26+
@onArtistClicked="onArtistClicked" />
4027
</template>
4128
</RecycleScroller>
4229
</b-row>

src/mainWindow/plugins/recycleScroller.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,8 @@
99

1010
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
1111

12-
import Vue from 'vue'
1312
import { RecycleScroller } from 'vue-virtual-scroller'
13+
import Vue from 'vue'
1414

15-
Vue.component('RecycleScroller', RecycleScroller)
15+
// rome-ignore lint/suspicious/noExplicitAny: <explanation>
16+
Vue.component('RecycleScroller', RecycleScroller as any)

src/preferenceWindow/plugins/recycleScroller.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,8 @@
99

1010
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
1111

12-
import Vue from 'vue'
1312
import { RecycleScroller } from 'vue-virtual-scroller'
13+
import Vue from 'vue'
1414

15-
Vue.component('RecycleScroller', RecycleScroller)
15+
// rome-ignore lint/suspicious/noExplicitAny: <explanation>
16+
Vue.component('RecycleScroller', RecycleScroller as any)

0 commit comments

Comments
 (0)