BigBlueButton/bigbluebutton-Github
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix inconsistent zoom between live session and recording

Browse Source
This commit is contained in:
KDSBrowne 2024-05-10 20:36:55 +00:00
parent 4a1c81fa76
commit cc53fb58f2
1 changed files with 23 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
bigbluebutton-html5/imports/ui/components/whiteboard/component.jsx
View File

@ -468,15 +468,14 @@ export default function Whiteboard(props) {
// change tldraw camera when slidePosition changes // change tldraw camera when slidePosition changes
React.useEffect(() => { React.useEffect(() => {
const camera = tldrawAPI?.getPageState()?.camera;
if (tldrawAPI && !isPresenter && curPageId && slidePosition) { if (tldrawAPI && !isPresenter && curPageId && slidePosition) {
const newZoom = calculateZoom(slidePosition.viewBoxWidth, slidePosition.viewBoxHeight); const newZoom = calculateZoom(slidePosition.viewBoxWidth, slidePosition.viewBoxHeight);
tldrawAPI?.setCamera([slidePosition.x, slidePosition.y], newZoom, 'zoomed'); tldrawAPI?.setCamera([slidePosition.x, slidePosition.y], newZoom, 'zoomed');
} }
const camera = tldrawAPI?.getPageState()?.camera;
if (isPresenter && slidePosition && camera) { if (isPresenter && slidePosition && camera) {
const zoomFitSlide = calculateZoom(slidePosition.width, slidePosition.height); const zoomFitSlide = calculateZoom(slidePosition.width, slidePosition.height);
const zoomCamera = (zoomFitSlide * zoomValue) / HUNDRED_PERCENT;
let zoomToolbar = Math.round( let zoomToolbar = Math.round(
((HUNDRED_PERCENT * camera.zoom) / zoomFitSlide) * 100, ((HUNDRED_PERCENT * camera.zoom) / zoomFitSlide) * 100,
) / 100; ) / 100;
@ -487,6 +486,28 @@ export default function Whiteboard(props) {
} }
}, [curPageId, slidePosition]); }, [curPageId, slidePosition]);
React.useEffect(() => {
if (isPresenter && slidePosition && !isMounting) {
const zoomFitSlide = calculateZoom(slidePosition?.width, slidePosition?.height);
const zoomCamera = (zoomFitSlide * zoomValue) / HUNDRED_PERCENT;
let viewedRegionW = SlideCalcUtil.calcViewedRegionWidth(
tldrawAPI?.viewport?.width, slidePosition?.width,
);
let viewedRegionH = SlideCalcUtil.calcViewedRegionHeight(
tldrawAPI?.viewport?.height, slidePosition?.height,
);
zoomSlide(
parseInt(curPageId, 10),
podId,
viewedRegionW,
viewedRegionH,
slidePosition?.x,
slidePosition?.y,
);
}
}, [curPageId]);
// update zoom according to toolbar // update zoom according to toolbar
React.useEffect(() => { React.useEffect(() => {
if (tldrawAPI && isPresenter && curPageId && slidePosition && zoom !== zoomValue) { if (tldrawAPI && isPresenter && curPageId && slidePosition && zoom !== zoomValue) {