pikvm/pikvm#1316: web: keep stream window maximized

This commit is contained in:
Maxim Devaev
2025-05-17 20:42:09 +03:00
parent 53980c0e68
commit 818ff6321e
14 changed files with 293 additions and 126 deletions

View File

@@ -43,7 +43,7 @@ export function Streamer() {
var __res = {"width": 640, "height": 480};
var __init__ = function() {
__streamer = new MjpegStreamer(__setActive, __setInactive, __setInfo);
__streamer = new MjpegStreamer(__setActive, __setInactive, __setInfo, __organizeHook);
$("stream-led").title = "Stream inactive";
@@ -110,6 +110,7 @@ export function Streamer() {
$("stream-window").show_hook = () => __applyState(__state);
$("stream-window").close_hook = () => __applyState(null);
$("stream-window").organize_hook = __organizeHook;
};
/************************************************************************/
@@ -294,6 +295,11 @@ export function Streamer() {
el_grab.innerText = el_info.innerText = title;
};
var __organizeHook = function() {
let geo = self.getGeometry();
wm.setAspectRatio($("stream-window"), geo.width, geo.height);
};
var __resetStream = function(mode=null) {
if (mode === null) {
mode = __streamer.getMode();
@@ -303,16 +309,16 @@ export function Streamer() {
if (mode === "janus") {
let allow_audio = !$("stream-video").muted;
let allow_mic = $("stream-mic-switch").checked;
__streamer = new JanusStreamer(__setActive, __setInactive, __setInfo, orient, allow_audio, allow_mic);
__streamer = new JanusStreamer(__setActive, __setInactive, __setInfo, __organizeHook, orient, allow_audio, allow_mic);
// Firefox doesn't support RTP orientation:
// - https://bugzilla.mozilla.org/show_bug.cgi?id=1316448
tools.feature.setEnabled($("stream-orient"), !tools.browser.is_firefox);
} else {
if (mode === "media") {
__streamer = new MediaStreamer(__setActive, __setInactive, __setInfo, orient);
__streamer = new MediaStreamer(__setActive, __setInactive, __setInfo, __organizeHook, orient);
tools.feature.setEnabled($("stream-orient"), true);
} else { // mjpeg
__streamer = new MjpegStreamer(__setActive, __setInactive, __setInfo);
__streamer = new MjpegStreamer(__setActive, __setInactive, __setInfo, __organizeHook);
tools.feature.setEnabled($("stream-orient"), false);
}
tools.feature.setEnabled($("stream-audio"), false); // Enabling in stream_janus.js

View File

@@ -29,7 +29,7 @@ import {tools, $} from "../tools.js";
var _Janus = null;
export function JanusStreamer(__setActive, __setInactive, __setInfo, __orient, __allow_audio, __allow_mic) {
export function JanusStreamer(__setActive, __setInactive, __setInfo, __organizeHook, __orient, __allow_audio, __allow_mic) {
var self = this;
/************************************************************************/
@@ -48,6 +48,8 @@ export function JanusStreamer(__setActive, __setInactive, __setInfo, __orient, _
var __state = null;
var __frames = 0;
var __res = {"width": -1, "height": -1};
var __resize_listener_installed = false;
var __ice = null;
@@ -84,11 +86,28 @@ export function JanusStreamer(__setActive, __setInactive, __setInfo, __orient, _
__state = state;
__stop = false;
__ensureJanus(false);
if (!__resize_listener_installed) {
$("stream-video").addEventListener("resize", __videoResizeHandler);
__resize_listener_installed = true;
}
};
self.stopStream = function() {
__stop = true;
__destroyJanus();
if (__resize_listener_installed) {
$("stream-video").removeEventListener("resize", __videoResizeHandler);
__resize_listener_installed = false;
}
};
var __videoResizeHandler = function(ev) {
let el = ev.target;
if (__res.width !== el.videoWidth || __res.height !== el.videoHeight) {
__res.width = el.videoWidth;
__res.height = el.videoHeight;
__organizeHook();
}
};
var __ensureJanus = function(internal) {

View File

@@ -26,7 +26,7 @@
import {tools, $} from "../tools.js";
export function MediaStreamer(__setActive, __setInactive, __setInfo, __orient) {
export function MediaStreamer(__setActive, __setInactive, __setInfo, __organizeHook, __orient) {
var self = this;
/************************************************************************/
@@ -282,6 +282,7 @@ export function MediaStreamer(__setActive, __setInactive, __setInfo, __orient) {
if (__canvas.width !== width || __canvas.height !== height) {
__canvas.width = width;
__canvas.height = height;
__organizeHook();
}
if (__orient === 0) {

View File

@@ -27,7 +27,7 @@ import {ROOT_PREFIX} from "../vars.js";
import {tools, $} from "../tools.js";
export function MjpegStreamer(__setActive, __setInactive, __setInfo) {
export function MjpegStreamer(__setActive, __setInactive, __setInfo, __organizeHook) {
var self = this;
/************************************************************************/
@@ -62,6 +62,7 @@ export function MjpegStreamer(__setActive, __setInactive, __setInfo) {
if (__id.length > 0 && __id in __state.stream.clients_stat) {
__setStreamActive();
__stopChecking();
__organizeHook();
} else {
__ensureChecking();
}