Live View - View in Timeline - Fullscreen to Fullscreen

[CDx4f3kCAf3Y]

On the Live View page, the View in Timeline button was added. That's working great.

Can it be improved so that if the Live View is in full screen when the button is clicked, it takes the user to the full screen mode of the Timeline and pre-selects the 'fine' keyboard navigation mode?

[CDx4f3kCAf3Y]

This is the full screen mode of the individual streams, not the full screen mode of the page that shows multiple streams.

[CDx4f3kCAf3Y]

I'm wondering if browser security will not allow this feature.

TimelinePlayer calls Element.requestFullscreen() and variants to request switching to fullscreen mode.

lightNVR/web/js/components/preact/timeline/TimelinePlayer.jsx

Lines 732 to 760 in c8c5c9a

	const handleToggleFullscreen = useCallback(async () => {
	const container = videoContainerRef.current;
	if (!container) return;
	try {
	const fullscreenElement = document.fullscreenElement || document.webkitFullscreenElement;
	if (fullscreenElement === container) {
	if (document.exitFullscreen) {
	await document.exitFullscreen();
	} else if (document.webkitExitFullscreen) {
	document.webkitExitFullscreen();
	}
	return;
	}
	if (container.requestFullscreen) {
	await container.requestFullscreen();
	} else if (container.webkitRequestFullscreen) {
	container.webkitRequestFullscreen();
	} else if (container.msRequestFullscreen) {
	container.msRequestFullscreen();
	} else {
	showStatusMessage(t('timeline.fullscreenNotSupported'), 'warning');
	}
	} catch (error) {
	console.error('Error toggling fullscreen:', error);
	showStatusMessage(t('timeline.couldNotToggleFullscreen', { message: error.message }), 'error');
	}
	}, [t]);

The documentation for the Element: requestFullscreen() method has this security note:

• Transient user activation is required. The user has to interact with the page or a UI element in order for this feature to work.

[matteius]

Changes pushed that need testing.

[CDx4f3kCAf3Y]

Tested with commit 767ed94.

This only partially works:

• The pre-selection of the 'fine' keyboard navigation mode works.
• The pre-selection of the fullscreen mode does not work.
  • The translucent overlay mentioned in the commit does not appear. Tested in Chrome and Firefox.

[CDx4f3kCAf3Y]

This also seems to have re-introduced the video control's native click to play functionality.

This occurs regardless what steps where taken to load the timeline page. (The simplest being fresh load of the site, click Recordings in the site header, click Timeline in the page header.)

When the video element is shown, a big play icon appears in front of the video. Clicking anywhere on the video causes the video to start playing.

This breaks the click the video to enter 'fine' keyboard navigation mode, that was added in #275.

Note that this only happens in Firefox. Chrome seems to be unaffected.

[CDx4f3kCAf3Y]

Tested in commit b624c98.

Switching to Timeline and staying in fullscreen mode still does not work.

Being able to switch to 'fine' keyboard navigation mode in Firefox still does not work... clicking the video control starts playing the video instead.

[matteius]

PR opened