Merge pull request #7530 from viown/add-title-to-experimental-layout-video

Add video title to experimental layout
This commit is contained in:
Bill Thornton
2026-01-27 17:35:48 -05:00
committed by GitHub
3 changed files with 21 additions and 4 deletions
+17 -3
View File
@@ -8,6 +8,7 @@ import AppToolbar from 'components/toolbar/AppToolbar';
import ViewManagerPage from 'components/viewManager/ViewManagerPage';
import { EventType } from 'constants/eventType';
import Events, { type Event } from 'utils/events';
import Typography from '@mui/material/Typography';
/**
* Video player page component that renders mui controls for the top controls and the legacy view for everything else.
@@ -15,18 +16,29 @@ import Events, { type Event } from 'utils/events';
const VideoPage: FC = () => {
const documentRef = useRef<Document>(document);
const [ isVisible, setIsVisible ] = useState(true);
const [ videoTitle, setVideoTitle ] = useState<string>('');
const onShowVideoOsd = (_e: Event, isShowing: boolean) => {
setIsVisible(isShowing);
};
const onTitleChange = (_e: Event, title: string) => {
setVideoTitle(title);
};
useEffect(() => {
const doc = documentRef.current;
if (doc) Events.on(doc, EventType.SHOW_VIDEO_OSD, onShowVideoOsd);
if (doc) {
Events.on(doc, EventType.SHOW_VIDEO_OSD, onShowVideoOsd);
Events.on(doc, EventType.VIDEO_TITLE_CHANGE, onTitleChange);
}
return () => {
if (doc) Events.off(doc, EventType.SHOW_VIDEO_OSD, onShowVideoOsd);
if (doc) {
Events.off(doc, EventType.SHOW_VIDEO_OSD, onShowVideoOsd);
Events.off(doc, EventType.VIDEO_TITLE_CHANGE, onTitleChange);
}
};
}, []);
@@ -54,7 +66,9 @@ const VideoPage: FC = () => {
<RemotePlayButton />
</>
}
/>
>
<Typography>{videoTitle}</Typography>
</AppToolbar>
</Box>
</Fade>