don't sleep mobile devices when fullscreen (#11652)

This commit is contained in:
Josh Hawkins 2024-05-30 10:37:08 -05:00 committed by GitHub
parent 3e6b8c23bc
commit 402c16e7df
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 12 additions and 0 deletions

6
web/package-lock.json generated
View File

@ -43,6 +43,7 @@
"lucide-react": "^0.379.0", "lucide-react": "^0.379.0",
"monaco-yaml": "^5.1.1", "monaco-yaml": "^5.1.1",
"next-themes": "^0.3.0", "next-themes": "^0.3.0",
"nosleep.js": "^0.12.0",
"react": "^18.3.1", "react": "^18.3.1",
"react-apexcharts": "^1.4.1", "react-apexcharts": "^1.4.1",
"react-day-picker": "^8.10.1", "react-day-picker": "^8.10.1",
@ -5724,6 +5725,11 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/nosleep.js": {
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/nosleep.js/-/nosleep.js-0.12.0.tgz",
"integrity": "sha512-9d1HbpKLh3sdWlhXMhU6MMH+wQzKkrgfRkYV0EBdvt99YJfj0ilCJrWRDYG2130Tm4GXbEoTCx5b34JSaP+HhA=="
},
"node_modules/npm-run-path": { "node_modules/npm-run-path": {
"version": "5.1.0", "version": "5.1.0",
"resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.1.0.tgz", "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.1.0.tgz",

View File

@ -49,6 +49,7 @@
"lucide-react": "^0.379.0", "lucide-react": "^0.379.0",
"monaco-yaml": "^5.1.1", "monaco-yaml": "^5.1.1",
"next-themes": "^0.3.0", "next-themes": "^0.3.0",
"nosleep.js": "^0.12.0",
"react": "^18.3.1", "react": "^18.3.1",
"react-apexcharts": "^1.4.1", "react-apexcharts": "^1.4.1",
"react-day-picker": "^8.10.1", "react-day-picker": "^8.10.1",

View File

@ -1,4 +1,7 @@
import { RefObject, useCallback, useEffect, useState } from "react"; import { RefObject, useCallback, useEffect, useState } from "react";
import nosleep from "nosleep.js";
const NoSleep = new nosleep();
function getFullscreenElement(): HTMLElement | null { function getFullscreenElement(): HTMLElement | null {
return ( return (
@ -96,9 +99,11 @@ export function useFullscreen<T extends HTMLElement = HTMLElement>(
const toggleFullscreen = useCallback(async () => { const toggleFullscreen = useCallback(async () => {
try { try {
if (!getFullscreenElement()) { if (!getFullscreenElement()) {
NoSleep.enable();
await enterFullScreen(elementRef.current!); await enterFullScreen(elementRef.current!);
} else { } else {
await exitFullscreen(); await exitFullscreen();
NoSleep.disable();
} }
setError(null); setError(null);
} catch (err) { } catch (err) {