Update whepplayer to be a generic player instead of messing with playerJS

This commit is contained in:
Speng Reb 2025-07-22 18:33:14 +02:00
parent f12115159e
commit 2aabaf6b6d

View file

@ -1,46 +1,87 @@
window.WhepPlayer = class WhepPlayer extends PlayerJSPlayer window.WhepPlayer = class WhepPlayer extends Player
constructor: (data) -> constructor: (data) ->
return new WhepPlayer(data) unless this instanceof WhepPlayer
super(data) super(data)
@load(data) @load(data)
load: (data) -> load: (data) ->
@ready = false @ready = false
@paused = true
@setMediaProperties(data) @setMediaProperties(data)
unless data.meta?.whepURL
u = new URL(data.id)
streemId = u.pathname.split('/').filter(Boolean)[0]
data.meta ?= {}
# Adjust these to whatever your backend expects
data.meta.whepURL = "#{u.origin}/api/whep"
data.meta.streamKey = streemId
{ whepURL, streamKey } = data.meta { whepURL, streamKey } = data.meta
waitUntilDefined window, 'PlayerJSPlayer', => # Create video element
videoEl = document.createElement 'video' videoEl = document.createElement 'video'
videoEl.autoplay = true videoEl.autoplay = true
videoEl.muted = true videoEl.muted = true
videoEl.controls = true videoEl.controls = true
removeOld(videoEl)
@setupPlayer(videoEl, data)
pc = new RTCPeerConnection() # Use the standard container swapper
pc.addTransceiver 'audio', direction: 'recvonly' holder = removeOld() # jQuery object
pc.addTransceiver 'video', direction: 'recvonly' holder.empty().append(videoEl)
pc.ontrack = (event) -> @videoEl = videoEl
videoEl.srcObject = event.streams[0]
pc.oniceconnectionstatechange = -> # ---- WebRTC setup ----
document.getElementById('connectionState').innerText = pc.iceConnectionState pc = new RTCPeerConnection()
pc.addTransceiver 'audio', direction: 'recvonly'
pc.addTransceiver 'video', direction: 'recvonly'
pc.createOffer().then (offer) -> pc.ontrack = (e) => @videoEl.srcObject = e.streams[0]
pc.onconnectionstatechange = =>
if pc.connectionState is 'connected'
@ready = true
@fire? 'ready'
pc.createOffer()
.then (offer) =>
pc.setLocalDescription offer pc.setLocalDescription offer
fetch whepURL, fetch whepURL,
method: 'POST' method: 'POST'
headers: headers:
'Authorization': "Bearer #{streamKey}" Authorization: "Bearer #{streamKey}"
'Content-Type': 'application/sdp' 'Content-Type': 'application/sdp'
body: offer.sdp body: offer.sdp
.then (r) -> r.text() .then (r) -> r.text()
.then (answer) -> .then (answer) ->
pc.setRemoteDescription type: 'answer', sdp: answer pc.setRemoteDescription type: 'answer', sdp: answer
.catch (err) ->
console.error 'WHEP negotiation failed:', err
pc.onconnectionstatechange = -> @pc = pc
if pc.connectionState is 'connected'
@ready = true play: ->
@fire 'ready' @paused = false
document.getElementById('readyFlag').innerText = 'yes' @videoEl?.play?()
pause: ->
@paused = true
@videoEl?.pause?()
seekTo: (t) ->
@videoEl?.currentTime = t if @ready
setVolume: (v) ->
@videoEl?.volume = v if @ready
getTime: (cb) ->
if @ready and @videoEl?
cb @videoEl.currentTime
else
cb 0
getVolume: (cb) ->
if @ready and @videoEl?
cb @videoEl.volume
else
cb VOLUME