Started on media player

src/routes/api/audio/+server.ts

@@ -1,39 +1,25 @@
 import type { RequestHandler } from '@sveltejs/kit'
 import { Connections } from '$lib/server/connections'
-import ytdl from 'ytdl-core'
 
-export const GET: RequestHandler = async ({ url, request }) => {
-    const connectionId = url.searchParams.get('connectionId')
+export const GET: RequestHandler = async ({ url }) => {
+    const connectionId = url.searchParams.get('connection')
     const id = url.searchParams.get('id')
     if (!(connectionId && id)) return new Response('Missing query parameter', { status: 400 })
-    const range = request.headers.get('range')
-    if (!range) return new Response('Missing Range Header')
 
-    const videourl = `http://www.youtube.com/watch?v=${id}`
+    const connection = Connections.getConnections([connectionId])[0]
+    const stream = await connection.getAudioStream(id)
 
-    const videoInfo = await ytdl.getInfo(videourl)
-    const format = ytdl.chooseFormat(videoInfo.formats, { quality: 'highestaudio', filter: 'audioonly' })
+    if (!stream.body) throw new Error(`Audio fetch did not return valid ReadableStream (Connection: ${connection.id})`)
 
-    const audioSize = format.contentLength
-    const CHUNK_SIZE = 5 * 10 ** 6
-    const start = Number(range.replace(/\D/g, ''))
-    const end = Math.min(start + CHUNK_SIZE, Number(audioSize) - 1)
-    const contentLength = end - start + 1
+    const contentLength = stream.headers.get('Content-Length')
+    if (!contentLength || isNaN(Number(contentLength))) throw new Error(`Audio fetch did not return valid Content-Length header (Connection: ${connection.id})`)
 
     const headers = new Headers({
-        'Content-Range': `bytes ${start}-${end}/${audioSize}`,
+        'Content-Range': `bytes 0-${Number(contentLength) - 1}/${contentLength}`,
         'Accept-Ranges': 'bytes',
         'Content-Length': contentLength.toString(),
         'Content-Type': 'audio/webm',
     })
 
-    const partialStream = ytdl(videourl, { format, range: { start, end } })
-
-    // @ts-ignore IDK enough about streaming to understand what the problem is here
-    // but it appears that ytdl has a custom version of a readable stream type they use internally
-    // and is what gets returned by ytdl(). Svelte will only allow you to send back the type ReadableStream
-    // so it ts gets mad if you try to send back their internal type.
-    // IDK to me a custom readable type seems incredibly stupid but what do I know?
-    // Currently haven't found a way to convert their readable to ReadableStream type, casting doesn't seem to work either.
-    return new Response(partialStream, { status: 206, headers })
+    return new Response(stream.body, { status: 206, headers })
 }

src/routes/api/remoteImage/+server.ts

@@ -0,0 +1,13 @@
+import type { RequestHandler } from '@sveltejs/kit'
+
+export const GET: RequestHandler = async ({ url }) => {
+    // const connectionId = url.searchParams.get('connection')
+    // const id = url.searchParams.get('id')
+    // if (!(connectionId && id)) return new Response('Missing query parameter', { status: 400 })
+    const imageUrl = url.searchParams.get('url')
+    if (!imageUrl) return new Response('Missing url', { status: 400 })
+
+    const image = await fetch(imageUrl).then((response) => response.arrayBuffer())
+
+    return new Response(image)
+}