diff options
| author | Maxim Devaev <[email protected]> | 2021-10-02 03:36:48 +0300 |
|---|---|---|
| committer | Maxim Devaev <[email protected]> | 2021-10-02 03:36:48 +0300 |
| commit | fdf3c0f8d4cdc6253bebe67c8a7f1aaea357c42e (patch) | |
| tree | eb892a6d3c5f96e6cec7d006caabeded89caf615 | |
| parent | c162bb7ea4f4edea29be03b89258c8c1a562c49e (diff) | |
pikvm/pikvm#481: check webrtc caps
| -rw-r--r-- | web/kvm/index.html | 22 | ||||
| -rw-r--r-- | web/kvm/navbar-system.pug | 6 | ||||
| -rw-r--r-- | web/share/js/kvm/stream.js | 17 |
3 files changed, 41 insertions, 4 deletions
diff --git a/web/kvm/index.html b/web/kvm/index.html index 9b9a4a9b..daabd503 100644 --- a/web/kvm/index.html +++ b/web/kvm/index.html @@ -126,6 +126,28 @@ </tr> </table> <hr> + <div class="hidden" id="stream-message-no-webrtc"> + <div class="text"> + <table> + <tr> + <td rowspan="2"><img class="sign " src="/share/svg/warning.svg"></td> + <td style="line-height:1.5"><b>WebRTC is not supported by this browser</b></td> + </tr> + </table> + </div> + <hr> + </div> + <div class="hidden" id="stream-message-no-h264"> + <div class="text"> + <table> + <tr> + <td rowspan="2"><img class="sign " src="/share/svg/warning.svg"></td> + <td style="line-height:1.5"><b>H.264 is not supported by this browser</b></td> + </tr> + </table> + </div> + <hr> + </div> <table class="kv" style="width: calc(100% - 20px)"> <tr class="feature-disabled" id="stream-resolution"> <td>Resolution:</td> diff --git a/web/kvm/navbar-system.pug b/web/kvm/navbar-system.pug index 20a92c03..33d1b302 100644 --- a/web/kvm/navbar-system.pug +++ b/web/kvm/navbar-system.pug @@ -16,6 +16,12 @@ li(class="right") button(data-force-hide-menu id="gpio-button-__wol__" class="gpio-button small" data-channel="__wol__" data-confirm="Are you sure to send Wake-on-LAN packet to the server?") • WoL hr + div(id="stream-message-no-webrtc" class="hidden") + +menu_message("warning", "WebRTC is not supported by this browser") + hr + div(id="stream-message-no-h264" class="hidden") + +menu_message("warning", "H.264 is not supported by this browser") + hr table(class="kv" style="width: calc(100% - 20px)") tr(id="stream-resolution" class="feature-disabled") td Resolution: diff --git a/web/share/js/kvm/stream.js b/web/share/js/kvm/stream.js index 14f5ecfc..9aa77545 100644 --- a/web/share/js/kvm/stream.js +++ b/web/share/js/kvm/stream.js @@ -454,15 +454,24 @@ export function Streamer() { }; self.setJanusEnabled = function(enabled) { - let supported = !!window.RTCPeerConnection; + let has_webrtc = !!window.RTCPeerConnection; + + let has_h264 = true; + if ($("stream-video").canPlayType) { + has_h264 = $("stream-video").canPlayType("video/mp4; codecs=\"avc1.42E01F\""); + } + let set_enabled = function() { - __janus_enabled = (enabled && supported && _Janus !== null); + tools.hidden.setVisible($("stream-message-no-webrtc"), !has_webrtc); + tools.hidden.setVisible($("stream-message-no-h264"), !has_h264); + __janus_enabled = (enabled && has_webrtc && _Janus !== null); // Don't check has_h264 for sure tools.feature.setEnabled($("stream-mode"), __janus_enabled); - tools.info(`Stream: Janus WebRTC state: enabled=${enabled}, supported=${supported}, imported=${!!_Janus}`); + tools.info(`Stream: Janus WebRTC state: enabled=${enabled}, webrtc=${has_webrtc}, h264=${has_h264}, imported=${!!_Janus}`); tools.radio.clickValue("stream-mode-radio", tools.storage.get("stream.mode", "mjpeg")); self.setState(__state); }; - if (enabled && supported) { + + if (enabled && has_webrtc) { if (_Janus === null) { import("./janus.js").then((module) => { module.Janus.init({ |