Mirrors/blakeblackshear.frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2024-11-21 19:07:46 +01:00
Code Issues Projects Releases Wiki Activity

Fix mobile playback (#10774)

Browse Source
This commit is contained in:
Nicolas Mowen 2024-04-01 08:20:27 -06:00 committed by GitHub
parent 7e5eb82882
commit 5853393396
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/components/player/HlsVideoPlayer.tsx
View File

@ -6,10 +6,12 @@ import {
useState, useState,
} from "react"; } from "react";
import Hls from "hls.js"; import Hls from "hls.js";
import { isDesktop, isMobile } from "react-device-detect"; import { isAndroid, isDesktop, isMobile } from "react-device-detect";
import { TransformComponent, TransformWrapper } from "react-zoom-pan-pinch"; import { TransformComponent, TransformWrapper } from "react-zoom-pan-pinch";
import VideoControls from "./VideoControls"; import VideoControls from "./VideoControls";
// Android native hls does not seek correctly
const USE_NATIVE_HLS = !isAndroid;
const HLS_MIME_TYPE = "application/vnd.apple.mpegurl" as const; const HLS_MIME_TYPE = "application/vnd.apple.mpegurl" as const;
const unsupportedErrorCodes = [ const unsupportedErrorCodes = [
MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED, MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED,
@ -51,7 +53,7 @@ export default function HlsVideoPlayer({
return; return;
} }
if (videoRef.current.canPlayType(HLS_MIME_TYPE)) { if (USE_NATIVE_HLS && videoRef.current.canPlayType(HLS_MIME_TYPE)) {
return; return;
} else if (Hls.isSupported()) { } else if (Hls.isSupported()) {
setUseHlsCompat(true); setUseHlsCompat(true);

2
web/src/utils/iconUtil.tsx
View File

@ -76,7 +76,7 @@ function getVerifiedIcon(label: string, className?: string) {
const simpleLabel = label.substring(0, label.lastIndexOf("-")); const simpleLabel = label.substring(0, label.lastIndexOf("-"));
return ( return (
<div className="flex items-center"> <div key={label} className="flex items-center">
{getIconForLabel(simpleLabel, className)} {getIconForLabel(simpleLabel, className)}
<FaCheckCircle className="absolute size-2 translate-x-[80%] translate-y-3/4" /> <FaCheckCircle className="absolute size-2 translate-x-[80%] translate-y-3/4" />
</div> </div>