fix(cloud): music opens the bottom-bar player, never the lightbox
FileCard audio clicks now emit play (global GlobalAudioPlayer bar) — wired through the FileGrid list view, the Cloud My Files list and own search results. Peer Files already used the bottom bar. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
parent
a34634e00f
commit
df403c5a69
@ -103,6 +103,7 @@ const emit = defineEmits<{
|
|||||||
delete: [path: string]
|
delete: [path: string]
|
||||||
share: [path: string, name: string, isDir: boolean]
|
share: [path: string, name: string, isDir: boolean]
|
||||||
preview: [path: string]
|
preview: [path: string]
|
||||||
|
play: [path: string, name: string]
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
const cloudStore = useCloudStore()
|
const cloudStore = useCloudStore()
|
||||||
@ -122,8 +123,10 @@ const downloadHref = computed(() => cloudStore.downloadUrl(props.item.path))
|
|||||||
function handleClick() {
|
function handleClick() {
|
||||||
if (props.item.isDir) {
|
if (props.item.isDir) {
|
||||||
emit('navigate', props.item.path)
|
emit('navigate', props.item.path)
|
||||||
} else if (isImage.value || isVideo.value || isAudio.value) {
|
} else if (isAudio.value) {
|
||||||
// MediaLightbox handles all three media kinds.
|
// Music goes to the global bottom-bar player, not the lightbox.
|
||||||
|
emit('play', props.item.path, props.item.name)
|
||||||
|
} else if (isImage.value || isVideo.value) {
|
||||||
emit('preview', props.item.path)
|
emit('preview', props.item.path)
|
||||||
} else {
|
} else {
|
||||||
// Non-media files open by downloading — a click should always act on the file.
|
// Non-media files open by downloading — a click should always act on the file.
|
||||||
|
|||||||
@ -53,6 +53,7 @@
|
|||||||
:item="item"
|
:item="item"
|
||||||
@navigate="$emit('navigate', $event)"
|
@navigate="$emit('navigate', $event)"
|
||||||
@delete="$emit('delete', $event)"
|
@delete="$emit('delete', $event)"
|
||||||
|
@play="(path, name) => $emit('play', path, name)"
|
||||||
@share="(path, name, isDir) => $emit('share', path, name, isDir)"
|
@share="(path, name, isDir) => $emit('share', path, name, isDir)"
|
||||||
@preview="$emit('preview', $event)"
|
@preview="$emit('preview', $event)"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@ -93,6 +93,7 @@
|
|||||||
:item="r.item"
|
:item="r.item"
|
||||||
@delete="handleDelete"
|
@delete="handleDelete"
|
||||||
@share="handleShare"
|
@share="handleShare"
|
||||||
|
@play="handlePlay"
|
||||||
@preview="(p: string) => handlePreview(p, searchMineItems)"
|
@preview="(p: string) => handlePreview(p, searchMineItems)"
|
||||||
/>
|
/>
|
||||||
<button
|
<button
|
||||||
@ -141,6 +142,7 @@
|
|||||||
:item="item"
|
:item="item"
|
||||||
@delete="handleDelete"
|
@delete="handleDelete"
|
||||||
@share="handleShare"
|
@share="handleShare"
|
||||||
|
@play="handlePlay"
|
||||||
@preview="(p: string) => handlePreview(p, filteredMyFiles)"
|
@preview="(p: string) => handlePreview(p, filteredMyFiles)"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@ -359,6 +361,7 @@ import { useCloudStore } from '../stores/cloud'
|
|||||||
import { fileBrowserClient, type FileBrowserItem } from '@/api/filebrowser-client'
|
import { fileBrowserClient, type FileBrowserItem } from '@/api/filebrowser-client'
|
||||||
import { rpcClient } from '@/api/rpc-client'
|
import { rpcClient } from '@/api/rpc-client'
|
||||||
import { getFileCategory } from '../composables/useFileType'
|
import { getFileCategory } from '../composables/useFileType'
|
||||||
|
import { useAudioPlayer } from '../composables/useAudioPlayer'
|
||||||
import FileCard from '../components/cloud/FileCard.vue'
|
import FileCard from '../components/cloud/FileCard.vue'
|
||||||
import ShareModal from '../components/cloud/ShareModal.vue'
|
import ShareModal from '../components/cloud/ShareModal.vue'
|
||||||
import MediaLightbox from '../components/cloud/MediaLightbox.vue'
|
import MediaLightbox from '../components/cloud/MediaLightbox.vue'
|
||||||
@ -366,6 +369,7 @@ import MediaLightbox from '../components/cloud/MediaLightbox.vue'
|
|||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const store = useAppStore()
|
const store = useAppStore()
|
||||||
const cloudStore = useCloudStore()
|
const cloudStore = useCloudStore()
|
||||||
|
const audioPlayer = useAudioPlayer()
|
||||||
const sectionCounts = ref<Record<string, number>>({})
|
const sectionCounts = ref<Record<string, number>>({})
|
||||||
const countsLoading = ref(false)
|
const countsLoading = ref(false)
|
||||||
|
|
||||||
@ -565,6 +569,12 @@ function handleShare(path: string, name: string, isDir: boolean) {
|
|||||||
shareTarget.value = { path, name, isDir }
|
shareTarget.value = { path, name, isDir }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** Music opens in the global bottom-bar player (GlobalAudioPlayer in App.vue). */
|
||||||
|
async function handlePlay(path: string, name: string) {
|
||||||
|
const url = await cloudStore.streamUrl(path)
|
||||||
|
audioPlayer.play(url, name)
|
||||||
|
}
|
||||||
|
|
||||||
function handlePreview(path: string, context: FileBrowserItem[]) {
|
function handlePreview(path: string, context: FileBrowserItem[]) {
|
||||||
// MediaLightbox filters to media internally; index within that filtered list.
|
// MediaLightbox filters to media internally; index within that filtered list.
|
||||||
const mediaItems = context.filter(item => {
|
const mediaItems = context.filter(item => {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user