A feature-rich media player powered by Flaxon's streaming responses and file serving capabilities.
from flaxon import Flaxon, StreamingResponse
from pathlib import Path
app = Flaxon("media-backend")
async def stream_media(file_path: str):
"""Stream media file in chunks."""
async with aiofiles.open(file_path, "rb") as f:
while chunk := await f.read(8192):
yield chunk
@app.get("/media/")
async def serve_media(file_path: str):
path = Path("media") / file_path
if not path.exists():
return {"error": "File not found"}, 404
# Determine content type
ext = path.suffix.lower()
content_type = "audio/mpeg"
if ext == ".mp4":
content_type = "video/mp4"
elif ext == ".webm":
content_type = "video/webm"
return StreamingResponse(
stream_media(path),
media_type=content_type,
headers={
"Accept-Ranges": "bytes",
"Content-Disposition": f'inline; filename="{file_path}"',
}
)
// Web Audio API Visualizer
const audioContext = new AudioContext();
const analyser = audioContext.createAnalyser();
analyser.fftSize = 256;
// Connect audio to analyser
const source = audioContext.createMediaElementSource(audioElement);
source.connect(analyser);
analyser.connect(audioContext.destination);
function updateVisualizer() {
const dataArray = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteFrequencyData(dataArray);
const bars = document.querySelectorAll('.visualizer-bar');
const bufferLength = analyser.frequencyBinCount;
for (let i = 0; i < bars.length; i++) {
const value = dataArray[i] || 0;
const percent = (value / 255) * 100;
bars[i].style.height = percent + '%';
}
requestAnimationFrame(updateVisualizer);
}