chris/frigate
1
0
Fork 0
forked from Github/frigate
Code Pull Requests Packages Activity

Add option for live mode & timezone config, fix MSE check for iPad (#5079)

Browse Source 
* Add config fields

* Clean up camera default values

* Set recordings timezone with config if available

* Adjust for timezone config

* Cleanup setting of the timezone

* Don't fail on MSE check iPad

* Fix MSE check for birdseye

* Add docs

* Fix test
This commit is contained in:
Nicolas Mowen
2023-01-13 16:27:16 -07:00
committed by GitHub
parent 170899bd71
commit e0b3b27b8a
6 changed files with 64 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
web/src/routes/Camera.jsx
View File

@@ -15,7 +15,6 @@ import { useApiHost } from '../api';
import useSWR from 'swr';
import WebRtcPlayer from '../components/WebRtcPlayer';
import MsePlayer from '../components/MsePlayer';
import videojs from 'video.js';
const emptyObject = Object.freeze({});
@@ -29,7 +28,10 @@ export default function Camera({ camera }) {
const jsmpegWidth = cameraConfig
? Math.round(cameraConfig.restream.jsmpeg.height * (cameraConfig.detect.width / cameraConfig.detect.height))
: 0;
const [viewSource, setViewSource, sourceIsLoaded] = usePersistence(`${camera}-source`, 'mse');
const [viewSource, setViewSource, sourceIsLoaded] = usePersistence(
`${camera}-source`,
getDefaultLiveMode(config, cameraConfig)
);
const sourceValues = cameraConfig && cameraConfig.restream.enabled ? ['mse', 'webrtc', 'jsmpeg'] : ['jsmpeg'];
const [options, setOptions] = usePersistence(`${camera}-feed`, emptyObject);
@@ -77,7 +79,13 @@ export default function Camera({ camera }) {
labelPosition="after"
/>
<Switch checked={options['zones']} id="zones" onChange={handleSetOption} label="Zones" labelPosition="after" />
<Switch checked={options['mask']} id="mask" onChange={handleSetOption} label="Motion Masks" labelPosition="after" />
<Switch
checked={options['mask']}
id="mask"
onChange={handleSetOption}
label="Motion Masks"
labelPosition="after"
/>
<Switch
checked={options['motion']}
id="motion"
@@ -99,19 +107,19 @@ export default function Camera({ camera }) {
let player;
if (viewMode === 'live') {
if (viewSource == 'mse' && cameraConfig.restream.enabled) {
if (videojs.browser.IS_IOS) {
if ('MediaSource' in window) {
player = (
<Fragment>
<div className="w-5xl text-center text-sm">
MSE is not supported on iOS devices. You'll need to use jsmpeg or webRTC. See the docs for more info.
<div className="max-w-5xl">
<MsePlayer camera={camera} />
</div>
</Fragment>
);
} else {
player = (
<Fragment>
<div className="max-w-5xl">
<MsePlayer camera={camera} />
<div className="w-5xl text-center text-sm">
MSE is not supported on iOS devices. You'll need to use jsmpeg or webRTC. See the docs for more info.
</div>
</Fragment>
);
@@ -191,3 +199,15 @@ export default function Camera({ camera }) {
</div>
);
}
function getDefaultLiveMode(config, cameraConfig) {
if (cameraConfig) {
if (cameraConfig.restream.enabled) {
return config.ui.live_mode;
}
return 'jsmpeg';
}
return undefined;
}