Fix mobile playback (#10774)

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

View File

@ -6,10 +6,12 @@ import {
useState,
} from "react";
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 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 unsupportedErrorCodes = [
MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED,
@ -51,7 +53,7 @@ export default function HlsVideoPlayer({
return;
}
if (videoRef.current.canPlayType(HLS_MIME_TYPE)) {
if (USE_NATIVE_HLS && videoRef.current.canPlayType(HLS_MIME_TYPE)) {
return;
} else if (Hls.isSupported()) {
setUseHlsCompat(true);

View File

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