fix video observer send wrong video size

packages/index.js

@@ -1,3 +1,4 @@
 export { InliveApp } from './app/index.js'
 export { InliveStream, Stream, Stat } from './stream/index.js'
-export { Room, RoomEvent, createAuth } from './room/index.js'
+export { Room, createAuth, ChannelClosureReasons } from './room/index.js'
+export { RoomEvent } from './room/peer/event.js'

packages/room/index.js

@@ -10,16 +10,6 @@ import * as config from './config/config.js'
 export { createAuth } from './api/auth.js'
 export { REASONS as ChannelClosureReasons } from './channel/channel.js'
 
-export const RoomEvent = Object.freeze({
-  CHANNEL_OPENED: 'channelOpened',
-  CHANNEL_CLOSED: 'channelClosed',
-  PEER_OPENED: 'peerOpened',
-  PEER_CLOSED: 'peerClosed',
-  STREAM_AVAILABLE: 'streamAvailable',
-  STREAM_REMOVED: 'streamRemoved',
-  META_CHANGED: 'metaChanged',
-})
-
 /**
  * @param {import('./room-types.js').RoomType.UserConfig} [userConfig]
  */

packages/room/observer/video-observer.js

@@ -59,8 +59,8 @@ export class VideoObserver {
       const videoTracks = entry.target.srcObject.getVideoTracks()
       if (videoTracks.length > 0) {
         const trackid = videoTracks[0].id
-        const width = entry.isIntersecting ? entry.target.width : 0
-        const height = entry.isIntersecting ? entry.target.height : 0
+        const width = entry.isIntersecting ? entry.target.offsetWidth : 0
+        const height = entry.isIntersecting ? entry.target.offsetHeight : 0
         this.#onVideoSizeChanged(trackid, width, height)
       }
     }
@@ -100,6 +100,7 @@ export class VideoObserver {
       delete this.#delayedReports[id]
     }
 
+    console.log('video size changed start timeout', id, width, height)
     this.#delayedReports[id] = setTimeout(() => {
       this.sendVideoSize(id, width, height)
     }, this.#intervalGap)
@@ -123,6 +124,8 @@ export class VideoObserver {
         },
       }
 
+      console.debug('video size changed', data)
+
       this.#dataChannel.send(JSON.stringify(data))
     } else {
       const listener = () => {

packages/room/peer/peer.js

@@ -406,6 +406,16 @@ export const createPeer = ({ api, createStream, event, streams, config }) => {
       this._videoObserver.observe(videoElement)
     }
 
+    /**
+     * @param {string} trackId
+     * @param {number} width
+     * @param {number} height
+     * @returns {void}
+     */
+    updateVideoSize = (trackId, width, height) => {
+      this._videoObserver?.sendVideoSize(trackId, width, height)
+    }
+
     /**
      * @param {HTMLVideoElement} videoElement
      */
@@ -1057,6 +1067,7 @@ export const createPeer = ({ api, createStream, event, streams, config }) => {
         turnOffMic: peer.turnOffMic,
         replaceTrack: peer.replaceTrack,
         observeVideo: peer.observeVideo,
+        updateVideoSize: peer.updateVideoSize,
         unobserveVideo: peer.unobserveVideo,
         negotiate: peer.negotiate,
         pendingNegotiation: peer.pendingNegotiation,