Полноэкранный API на мобильных устройствах ⇐ Javascript

[Anonymous]

Я пишу собственный проигрыватель на React, и у меня возникла проблема с адаптацией полноэкранного режима для мобильных устройств.
Вот как сейчас выглядит функция, которая переводит компонент в полноэкранный режим:

Код: Выделить всё

const handleFullScreen = () => {
const player = playerRef.current;
const video = videoRef.current;
if (!player || !video) return;

if (!document.fullscreenElement) {
player.requestFullscreen();
setIsFullscreen(true);
} else {
document.exitFullscreen();
setIsFullscreen(false);
}
};

Вот как выглядит тег видео:

Код: Выделить всё

 handlePlayerClick()}
playsInline
controls={false}
/>

На данный момент кнопка просто ничего не делает, но ее можно нажать, если вы добавите оповещение или ведение журнала.
Я искал информацию и так и не понял, как заставить все работать. Насколько я понимаю, в iOS и Android есть свои особенности перехода в режим FS.
Для iOS я разобрался, что сделать, чтобы кнопка FS транслировалась в сам плеер Safari. Другими словами, сохранить кастомные кнопки в полноэкранном режиме вы не сможете.
На Android уже можно сохранить полную настройку плеера, но у меня кнопка вообще не работает ни на одной мобильной ОС.
На ПК всё работает нормально.
Как я понимаю, на мобильных телефонах переход в FS надо делать не для div, а для тега видео? Но как при этом сохранить кастомизацию под андроид?
Хотелось бы получить совет от человека, который сталкивался с этим.

Подробнее здесь: https://stackoverflow.com/questions/798 ... le-devices