feat: fullscreen support for media chrome

Author: JoaquinBCh

lib/video-moq/index.ts

@@ -79,7 +79,7 @@ export class VideoMoq extends HTMLElement {
 
 	set fullscreen(fullscreen: boolean) {
 		if (fullscreen) {
-			this.enterFullscreen().catch((err) => {
+			this.requestFullscreen().catch((err) => {
 				console.error("Error entering fullscreen:", err)
 			})
 		} else {
@@ -455,7 +455,7 @@ export class VideoMoq extends HTMLElement {
 		this.fullscreen = !document.fullscreenElement
 	}
 
-	private async enterFullscreen() {
+	public async requestFullscreen(): Promise<void> {
 		try {
 			if (this.#base) {
 				await this.#base.requestFullscreen()
@@ -465,7 +465,7 @@ export class VideoMoq extends HTMLElement {
 		}
 	}
 
-	private async exitFullscreen() {
+	public async exitFullscreen(): Promise<void> {
 		try {
 			await document.exitFullscreen()
 		} catch (error) {

samples/media-chrome/media-chrome.html

@@ -16,7 +16,6 @@ <h1>Media Chrome Example</h1>
 			<video-moq
 				src="https://localhost:4443?namespace=bbb"
 				fingerprint="https://localhost:4443/fingerprint"
-				width="640px"
 				slot="media"
 			></video-moq>
 			<media-control-bar>
@@ -29,11 +28,10 @@ <h1>Media Chrome Example</h1>
 		</media-controller> -->
 
 		<!-- Using media-theme -->
-		<media-theme-x-mas>
+		<media-theme-x-mas style="width: 640px">
 			<video-moq
 				src="https://localhost:4443?namespace=bbb"
 				fingerprint="https://localhost:4443/fingerprint"
-				width="640px"
 				slot="media"
 			></video-moq>
 		</media-theme-x-mas>