GithubFollow/One-KVM
1
0
Fork 0
mirror of https://github.com/mofeng-git/One-KVM.git synced 2026-01-31 18:11:54 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

pikvm/pikvm#1440: Websocket-based transport and decoding for H.264

Browse Source
This commit is contained in:
Maxim Devaev
2024-12-25 09:16:59 +02:00
parent eda7ab3a49
commit ab08d823c4
10 changed files with 314 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
web/share/js/kvm/stream.js
View File

@@ -27,6 +27,7 @@ import {tools, $} from "../tools.js";
import {wm} from "../wm.js";
import {JanusStreamer} from "./stream_janus.js";
import {MediaStreamer} from "./stream_media.js";
import {MjpegStreamer} from "./stream_mjpeg.js";
@@ -168,17 +169,20 @@ export function Streamer() {
if (state.features) {
let f = state.features;
let l = state.limits;
let has_webrtc = JanusStreamer.is_webrtc_available();
let has_h264 = JanusStreamer.is_h264_available();
let has_janus = (__janus_imported && f.h264 && has_webrtc); // Don't check has_h264 for sure
let sup_h264 = $("stream-video").canPlayType("video/mp4; codecs=\"avc1.42E01F\"");
let sup_vd = MediaStreamer.is_videodecoder_available();
let sup_webrtc = JanusStreamer.is_webrtc_available();
let has_media = (f.h264 && sup_vd); // Don't check sup_h264 for sure
let has_janus = (__janus_imported && f.h264 && sup_webrtc); // Same
tools.info(
`Stream: Janus WebRTC state: features.h264=${f.h264},`
+ ` webrtc=${has_webrtc}, h264=${has_h264}, janus_imported=${__janus_imported}`
+ ` webrtc=${sup_webrtc}, h264=${sup_h264}, janus_imported=${__janus_imported}`
);
tools.hidden.setVisible($("stream-message-no-webrtc"), __janus_imported && f.h264 && !has_webrtc);
tools.hidden.setVisible($("stream-message-no-h264"), __janus_imported && f.h264 && !has_h264);
tools.hidden.setVisible($("stream-message-no-webrtc"), __janus_imported && f.h264 && !sup_webrtc);
tools.hidden.setVisible($("stream-message-no-vd"), f.h264 && !sup_vd);
tools.hidden.setVisible($("stream-message-no-h264"), __janus_imported && f.h264 && !sup_h264);
tools.slider.setRange($("stream-desired-fps-slider"), l.desired_fps.min, l.desired_fps.max);
if (f.resolution) {
@@ -190,21 +194,27 @@ export function Streamer() {
} else {
$("stream-resolution-selector").options.length = 0;
}
if (has_janus) {
if (f.h264) {
tools.slider.setRange($("stream-h264-bitrate-slider"), l.h264_bitrate.min, l.h264_bitrate.max);
tools.slider.setRange($("stream-h264-gop-slider"), l.h264_gop.min, l.h264_gop.max);
}
// tools.feature.setEnabled($("stream-quality"), f.quality); // Only on s.encoder.quality
tools.feature.setEnabled($("stream-resolution"), f.resolution);
tools.feature.setEnabled($("stream-h264-bitrate"), has_janus);
tools.feature.setEnabled($("stream-h264-gop"), has_janus);
tools.feature.setEnabled($("stream-mode"), has_janus);
if (!has_janus) {
tools.feature.setEnabled($("stream-h264-bitrate"), f.h264);
tools.feature.setEnabled($("stream-h264-gop"), f.h264);
tools.feature.setEnabled($("stream-mode"), f.h264);
if (!f.h264) {
tools.feature.setEnabled($("stream-audio"), false);
}
let mode = (has_janus ? tools.storage.get("stream.mode", "janus") : "mjpeg");
let mode = tools.storage.get("stream.mode", "janus");
if (mode === "janus" && !has_janus) {
mode = "media";
}
if (mode === "media" && !has_media) {
mode = "mjpeg";
}
tools.radio.clickValue("stream-mode-radio", mode);
}
@@ -285,8 +295,12 @@ export function Streamer() {
// 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 { // mjpeg
__streamer = new MjpegStreamer(__setActive, __setInactive, __setInfo);
} else {
if (mode === "media") {
__streamer = new MediaStreamer(__setActive, __setInactive, __setInfo);
} else { // mjpeg
__streamer = new MjpegStreamer(__setActive, __setInactive, __setInfo);
}
tools.feature.setEnabled($("stream-orient"), false);
tools.feature.setEnabled($("stream-audio"), false); // Enabling in stream_janus.js
}
@@ -299,7 +313,8 @@ export function Streamer() {
let mode = tools.radio.getValue("stream-mode-radio");
tools.storage.set("stream.mode", mode);
if (mode !== __streamer.getMode()) {
tools.hidden.setVisible($("stream-image"), (mode !== "janus"));
tools.hidden.setVisible($("stream-canvas"), (mode === "media"));
tools.hidden.setVisible($("stream-image"), (mode === "mjpeg"));
tools.hidden.setVisible($("stream-video"), (mode === "janus"));
__resetStream(mode);
}