Camera options followups (#3701)

This PR adds a slideshow example (similar to @TodePond's slides but more
on rails) as a way to put some pressure on camera controls.

Along the way, it fixes some issues I found with animations and the new
camera controls.

- forced changes will continue to force through animations
- animations no longer set unnecessary additional listeners
- animations end correctly
- updating camera options does not immediately update the camera (to
allow for animations, etc.)

It also changes the location of the "in front of the canvas" element so
that it is not hidden by the hit test blocking element.

### Change Type

- [x] `sdk` — Changes the tldraw SDK
- [x] `improvement` — Improving existing features
This commit is contained in:
Steve Ruiz 2024-05-07 11:06:35 +01:00 committed by GitHub
parent fabba66c0f
commit ebc892a1a6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
22 changed files with 636 additions and 277 deletions

View file

@ -169,7 +169,6 @@ export function DefaultCanvas({ className }: TLCanvasComponentProps) {
<SelectionForegroundWrapper />
<LiveCollaborators />
</div>
<InFrontOfTheCanvasWrapper />
</div>
<MovingCameraHitTestBlocker />
</div>
@ -647,12 +646,6 @@ function OnTheCanvasWrapper() {
return <OnTheCanvas />
}
function InFrontOfTheCanvasWrapper() {
const { InFrontOfTheCanvas } = useEditorComponents()
if (!InFrontOfTheCanvas) return null
return <InFrontOfTheCanvas />
}
function MovingCameraHitTestBlocker() {
const editor = useEditor()
const cameraState = useValue('camera state', () => editor.getCameraState(), [editor])