New person here! I'm trying to make a video game that uses the javascript "canvas.captureStream()" command to show the canvas content in a video player, which would allow the user to pause and change the volume of the game. I'm having trouble overlapping the looped game audio with the canvas stream. Code:
<html>
<audio src="gamemusic.mp3" looped></audio>
<video controls><canvas style="display:none"></canvas></video>
<script>
var canvas = document.querySelector('canvas')
var audio = document.querySelector('audio')
var video = document.querySelector('video')
var stream = canvas.captureStream()
stream.addTrack(audio) // won't work, because audio isn't MediaStream
video.srcObject = stream
</script>
</html>
The game music won't work because the looped audio isn't a MediaStream. Can I convert it to a Stream? Any help would be appreciated.
