@ue-too/board 0.9.4 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +66 -2
- package/boardify/index.d.ts +280 -9
- package/camera/base.d.ts +364 -68
- package/camera/camera-edge-auto-input.d.ts +105 -0
- package/camera/camera-mux/animation-and-lock/animation-and-lock.d.ts +316 -14
- package/camera/camera-mux/animation-and-lock/index.d.ts +27 -0
- package/camera/camera-mux/animation-and-lock/pan-control-state-machine.d.ts +143 -60
- package/camera/camera-mux/animation-and-lock/rotation-control-state-machine.d.ts +143 -55
- package/camera/camera-mux/animation-and-lock/zoom-control-state-machine.d.ts +205 -58
- package/camera/camera-mux/index.d.ts +26 -0
- package/camera/camera-mux/interface.d.ts +161 -5
- package/camera/camera-mux/relay.d.ts +79 -16
- package/camera/camera-rig/camera-rig.d.ts +536 -94
- package/camera/camera-rig/index.d.ts +26 -1
- package/camera/camera-rig/pan-handler.d.ts +508 -48
- package/camera/camera-rig/rotation-handler.d.ts +353 -31
- package/camera/camera-rig/zoom-handler.d.ts +369 -32
- package/camera/default-camera.d.ts +173 -26
- package/camera/index.d.ts +20 -0
- package/camera/interface.d.ts +202 -2
- package/camera/update-publisher.d.ts +128 -38
- package/camera/utils/coordinate-conversion.d.ts +323 -26
- package/camera/utils/index.d.ts +22 -0
- package/camera/utils/matrix.d.ts +217 -14
- package/camera/utils/position.d.ts +249 -11
- package/camera/utils/rotation.d.ts +139 -9
- package/camera/utils/zoom.d.ts +72 -4
- package/index.d.ts +37 -0
- package/index.js +2 -4796
- package/index.js.map +39 -38
- package/input-interpretation/index.d.ts +29 -0
- package/input-interpretation/input-orchestrator.d.ts +197 -0
- package/input-interpretation/input-state-machine/index.d.ts +18 -0
- package/input-interpretation/input-state-machine/kmt-input-context.d.ts +191 -38
- package/input-interpretation/input-state-machine/kmt-input-state-machine.d.ts +201 -85
- package/input-interpretation/input-state-machine/touch-input-context.d.ts +76 -10
- package/input-interpretation/input-state-machine/touch-input-state-machine.d.ts +138 -17
- package/input-interpretation/raw-input-parser/index.d.ts +19 -0
- package/input-interpretation/raw-input-parser/vanilla-kmt-event-parser.d.ts +107 -21
- package/input-interpretation/raw-input-parser/vanilla-touch-event-parser.d.ts +71 -8
- package/input-interpretation/raw-input-publisher/index.d.ts +18 -0
- package/input-interpretation/raw-input-publisher/raw-input-publisher.d.ts +133 -37
- package/package.json +3 -3
- package/utils/canvas-position-dimension.d.ts +282 -1
- package/utils/coordinate-conversions/canvas-viewport.d.ts +79 -0
- package/utils/coordinate-conversions/viewport-world.d.ts +101 -0
- package/utils/coordinate-conversions/window-canvas.d.ts +90 -0
- package/utils/coorindate-conversion.d.ts +91 -0
- package/utils/drawing.d.ts +151 -3
- package/utils/index.d.ts +21 -0
- package/utils/observable.d.ts +179 -0
- package/utils/ruler.d.ts +36 -0
- package/utils/zoomlevel-adjustment.d.ts +144 -8
- package/camera/camera-rig/update-batcher/index.d.ts +0 -3
- package/camera/camera-rig/update-batcher/position-update-batcher.d.ts +0 -58
- package/camera/camera-rig/update-batcher/rotation-update-batcher.d.ts +0 -54
- package/camera/camera-rig/update-batcher/zoom-udpate-batcher.d.ts +0 -60
|
@@ -2,123 +2,161 @@ import { PanHandlerConfig } from "./pan-handler";
|
|
|
2
2
|
import { ZoomHandlerConfig } from "./zoom-handler";
|
|
3
3
|
import type { RotationHandlerConfig } from "./rotation-handler";
|
|
4
4
|
import { ObservableBoardCamera } from "../interface";
|
|
5
|
-
import { PanContext } from "../camera-mux/animation-and-lock/pan-control-state-machine";
|
|
6
|
-
import { ZoomContext } from "../camera-mux/animation-and-lock/zoom-control-state-machine";
|
|
7
5
|
import { Point } from "@ue-too/math";
|
|
8
|
-
import {
|
|
6
|
+
import type { BaseContext } from "@ue-too/being";
|
|
9
7
|
/**
|
|
10
|
-
*
|
|
11
|
-
*
|
|
8
|
+
* Configuration for camera rig behavior combining pan, zoom, and rotation settings.
|
|
9
|
+
* Composed from individual handler configs.
|
|
12
10
|
*
|
|
13
|
-
* @
|
|
11
|
+
* @remarks
|
|
12
|
+
* This type merges configuration from:
|
|
13
|
+
* - {@link PanHandlerConfig} - Pan clamping and boundaries
|
|
14
|
+
* - {@link ZoomHandlerConfig} - Zoom limits and restrictions
|
|
15
|
+
* - {@link RotationHandlerConfig} - Rotation constraints
|
|
16
|
+
*
|
|
17
|
+
* @category Camera Rig
|
|
18
|
+
* @see {@link PanHandlerConfig}
|
|
19
|
+
* @see {@link ZoomHandlerConfig}
|
|
20
|
+
* @see {@link RotationHandlerConfig}
|
|
14
21
|
*/
|
|
15
22
|
export type CameraRigConfig = PanHandlerConfig & ZoomHandlerConfig & RotationHandlerConfig;
|
|
16
|
-
export interface CameraRig extends PanContext, ZoomContext, RotateContext {
|
|
17
|
-
camera: ObservableBoardCamera;
|
|
18
|
-
config: CameraRigConfig;
|
|
19
|
-
configure(config: Partial<CameraRigConfig>): void;
|
|
20
|
-
update(): void;
|
|
21
|
-
}
|
|
22
23
|
/**
|
|
23
|
-
*
|
|
24
|
+
* High-level camera control interface providing intuitive methods for pan, zoom, and rotation.
|
|
25
|
+
* The camera rig acts as a facade over the camera, handling coordinate conversions and constraints.
|
|
26
|
+
*
|
|
27
|
+
* @remarks
|
|
28
|
+
* CameraRig provides:
|
|
29
|
+
* - **Coordinate-aware methods**: Separate methods for viewport and world coordinates
|
|
30
|
+
* - **Anchor-point zooming**: Keep points stationary during zoom (zoom-to-cursor)
|
|
31
|
+
* - **Configuration management**: Unified config for all camera operations
|
|
32
|
+
* - **Handler composition**: Combines pan, zoom, rotation handlers with proper sequencing
|
|
24
33
|
*
|
|
25
|
-
*
|
|
26
|
-
*
|
|
34
|
+
* The rig ensures correct transformation order when combining operations
|
|
35
|
+
* (e.g., zoom-at-point requires zoom followed by pan compensation).
|
|
27
36
|
*
|
|
28
|
-
* @category Camera
|
|
37
|
+
* @category Camera Rig
|
|
38
|
+
* @see {@link DefaultCameraRig} for the default implementation
|
|
39
|
+
* @see {@link createDefaultCameraRig} for a factory function
|
|
29
40
|
*/
|
|
30
|
-
export
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
private _rotateBy;
|
|
36
|
-
private _rotateTo;
|
|
37
|
-
private _config;
|
|
38
|
-
private _camera;
|
|
39
|
-
private _positionBatcher;
|
|
40
|
-
private _zoomBatcher;
|
|
41
|
-
private _rotationBatcher;
|
|
42
|
-
constructor(config: PanHandlerConfig & ZoomHandlerConfig, camera?: ObservableBoardCamera);
|
|
41
|
+
export interface CameraRig extends BaseContext {
|
|
42
|
+
/** The underlying observable camera being controlled */
|
|
43
|
+
camera: ObservableBoardCamera;
|
|
44
|
+
/** Current configuration for all camera operations */
|
|
45
|
+
config: CameraRigConfig;
|
|
43
46
|
/**
|
|
44
|
-
*
|
|
47
|
+
* Updates the camera rig configuration.
|
|
48
|
+
* @param config - Partial configuration to merge with current config
|
|
45
49
|
*/
|
|
46
|
-
|
|
50
|
+
configure(config: Partial<CameraRigConfig>): void;
|
|
47
51
|
/**
|
|
48
|
-
*
|
|
52
|
+
* Updates the camera rig state (called per frame if needed).
|
|
49
53
|
*/
|
|
50
|
-
|
|
54
|
+
update(): void;
|
|
51
55
|
/**
|
|
52
|
-
*
|
|
56
|
+
* Pans the camera by a delta in viewport coordinates.
|
|
57
|
+
* @param delta - Movement delta in viewport space (CSS pixels, origin at center)
|
|
53
58
|
*/
|
|
54
|
-
|
|
59
|
+
panByViewPort: (delta: Point) => void;
|
|
55
60
|
/**
|
|
56
|
-
*
|
|
61
|
+
* Pans the camera to a target position in viewport coordinates.
|
|
62
|
+
* @param target - Target position in viewport space
|
|
57
63
|
*/
|
|
58
|
-
|
|
64
|
+
panToViewPort: (target: Point) => void;
|
|
59
65
|
/**
|
|
60
|
-
*
|
|
66
|
+
* Pans the camera by a delta in world coordinates.
|
|
67
|
+
* @param delta - Movement delta in world space
|
|
61
68
|
*/
|
|
62
|
-
|
|
69
|
+
panByWorld: (delta: Point) => void;
|
|
63
70
|
/**
|
|
64
|
-
*
|
|
71
|
+
* Pans the camera to a target position in world coordinates.
|
|
72
|
+
* @param target - Target position in world space
|
|
65
73
|
*/
|
|
66
|
-
|
|
74
|
+
panToWorld: (target: Point) => void;
|
|
67
75
|
/**
|
|
68
|
-
*
|
|
76
|
+
* Rotates the camera by a delta angle.
|
|
77
|
+
* @param delta - Rotation delta in radians
|
|
69
78
|
*/
|
|
70
|
-
|
|
79
|
+
rotateBy: (delta: number) => void;
|
|
71
80
|
/**
|
|
72
|
-
*
|
|
81
|
+
* Rotates the camera to a target angle.
|
|
82
|
+
* @param target - Target rotation in radians
|
|
73
83
|
*/
|
|
74
|
-
|
|
75
|
-
panByWorld(delta: Point): void;
|
|
76
|
-
panByViewPort(delta: Point): void;
|
|
77
|
-
panToWorld(target: Point): void;
|
|
78
|
-
panToViewPort(target: Point): void;
|
|
84
|
+
rotateTo: (target: number) => void;
|
|
79
85
|
/**
|
|
80
|
-
*
|
|
86
|
+
* Zooms to a target level, keeping a viewport point stationary.
|
|
87
|
+
* @param targetZoom - Target zoom level
|
|
88
|
+
* @param at - Anchor point in viewport coordinates
|
|
81
89
|
*/
|
|
82
|
-
|
|
90
|
+
zoomToAt: (targetZoom: number, at: Point) => void;
|
|
83
91
|
/**
|
|
84
|
-
*
|
|
92
|
+
* Zooms by a delta, keeping a viewport point stationary.
|
|
93
|
+
* @param delta - Zoom delta
|
|
94
|
+
* @param at - Anchor point in viewport coordinates
|
|
85
95
|
*/
|
|
86
|
-
|
|
87
|
-
set limitEntireViewPort(limit: boolean);
|
|
96
|
+
zoomByAt: (delta: number, at: Point) => void;
|
|
88
97
|
/**
|
|
89
|
-
*
|
|
98
|
+
* Zooms to a target level at viewport center.
|
|
99
|
+
* @param targetZoom - Target zoom level
|
|
90
100
|
*/
|
|
91
|
-
|
|
92
|
-
get camera(): ObservableBoardCamera;
|
|
93
|
-
get config(): CameraRigConfig;
|
|
94
|
-
set config(config: CameraRigConfig);
|
|
95
|
-
updatePosition(): void;
|
|
96
|
-
updateZoom(): void;
|
|
97
|
-
updateRotation(): void;
|
|
98
|
-
update(): void;
|
|
99
|
-
private _zoomToAtViewPort;
|
|
100
|
-
private _zoomToAtWorld;
|
|
101
|
-
private _zoomByAtViewPort;
|
|
102
|
-
private _zoomByAtWorld;
|
|
101
|
+
zoomTo: (targetZoom: number) => void;
|
|
103
102
|
/**
|
|
104
|
-
*
|
|
103
|
+
* Zooms by a delta at viewport center.
|
|
104
|
+
* @param delta - Zoom delta
|
|
105
105
|
*/
|
|
106
|
-
|
|
106
|
+
zoomBy: (delta: number) => void;
|
|
107
107
|
/**
|
|
108
|
-
*
|
|
108
|
+
* Zooms to a target level, keeping a world point stationary.
|
|
109
|
+
* @param targetZoom - Target zoom level
|
|
110
|
+
* @param at - Anchor point in world coordinates
|
|
109
111
|
*/
|
|
110
|
-
|
|
112
|
+
zoomToAtWorld: (targetZoom: number, at: Point) => void;
|
|
111
113
|
/**
|
|
112
|
-
*
|
|
114
|
+
* Zooms by a delta, keeping a world point stationary.
|
|
115
|
+
* @param delta - Zoom delta
|
|
116
|
+
* @param at - Anchor point in world coordinates
|
|
113
117
|
*/
|
|
114
|
-
|
|
118
|
+
zoomByAtWorld: (delta: number, at: Point) => void;
|
|
115
119
|
}
|
|
116
120
|
/**
|
|
117
|
-
*
|
|
121
|
+
* Default implementation of the camera rig providing comprehensive camera control.
|
|
122
|
+
* Composes pan, zoom, and rotation handlers into a unified, easy-to-use API.
|
|
123
|
+
*
|
|
124
|
+
* @remarks
|
|
125
|
+
* DefaultCameraRig serves as:
|
|
126
|
+
* - **Context for state machines**: Passed to pan/zoom state machines as execution context
|
|
127
|
+
* - **Handler composition**: Combines individual pan/zoom/rotation handlers
|
|
128
|
+
* - **Coordinate conversion**: Manages conversions between viewport and world space
|
|
129
|
+
* - **Configuration management**: Applies constraints and limits through handlers
|
|
130
|
+
*
|
|
131
|
+
* The rig ensures proper transformation sequencing:
|
|
132
|
+
* 1. For anchor-point zoom: Apply zoom, then compensate camera position to keep anchor stationary
|
|
133
|
+
* 2. For rotation: Transform coordinates based on current camera rotation
|
|
134
|
+
* 3. For pan: Apply clamping and boundary constraints
|
|
135
|
+
*
|
|
136
|
+
* @example
|
|
137
|
+
* ```typescript
|
|
138
|
+
* const camera = new DefaultBoardCamera();
|
|
139
|
+
* const rig = new DefaultCameraRig({
|
|
140
|
+
* limitEntireViewPort: true,
|
|
141
|
+
* clampTranslation: true,
|
|
142
|
+
* clampZoom: true,
|
|
143
|
+
* restrictZoom: false
|
|
144
|
+
* }, camera);
|
|
118
145
|
*
|
|
119
|
-
*
|
|
146
|
+
* // Pan in viewport coordinates
|
|
147
|
+
* rig.panByViewPort({ x: 50, y: -30 });
|
|
148
|
+
*
|
|
149
|
+
* // Zoom at cursor position
|
|
150
|
+
* rig.zoomByAt(0.1, mousePosition);
|
|
151
|
+
*
|
|
152
|
+
* // Rotate camera
|
|
153
|
+
* rig.rotateBy(Math.PI / 4);
|
|
154
|
+
* ```
|
|
155
|
+
*
|
|
156
|
+
* @category Camera Rig
|
|
157
|
+
* @see {@link CameraRig} for the interface definition
|
|
158
|
+
* @see {@link createDefaultCameraRig} for a convenient factory function
|
|
120
159
|
*/
|
|
121
|
-
export declare function createDefaultCameraRigWithUpdateBatcher(camera: ObservableBoardCamera): CameraRigWithUpdateBatcher;
|
|
122
160
|
export declare class DefaultCameraRig implements CameraRig {
|
|
123
161
|
private _panBy;
|
|
124
162
|
private _panTo;
|
|
@@ -128,81 +166,485 @@ export declare class DefaultCameraRig implements CameraRig {
|
|
|
128
166
|
private _rotateTo;
|
|
129
167
|
private _config;
|
|
130
168
|
private _camera;
|
|
169
|
+
/**
|
|
170
|
+
* Creates a new DefaultCameraRig with specified configuration and camera.
|
|
171
|
+
*
|
|
172
|
+
* @param config - Camera rig configuration for pan and zoom constraints
|
|
173
|
+
* @param camera - Observable camera instance to control (defaults to new DefaultBoardCamera)
|
|
174
|
+
*
|
|
175
|
+
* @remarks
|
|
176
|
+
* The constructor initializes:
|
|
177
|
+
* - Default pan, zoom, and rotation handler functions
|
|
178
|
+
* - Rotation config with `restrictRotation: false` and `clampRotation: true`
|
|
179
|
+
* - Handler functions that will be used to process and constrain all camera operations
|
|
180
|
+
*
|
|
181
|
+
* @example
|
|
182
|
+
* ```typescript
|
|
183
|
+
* const rig = new DefaultCameraRig({
|
|
184
|
+
* limitEntireViewPort: true,
|
|
185
|
+
* clampTranslation: true,
|
|
186
|
+
* clampZoom: true,
|
|
187
|
+
* restrictZoom: false,
|
|
188
|
+
* restrictXTranslation: false,
|
|
189
|
+
* restrictYTranslation: false
|
|
190
|
+
* });
|
|
191
|
+
* ```
|
|
192
|
+
*/
|
|
131
193
|
constructor(config: PanHandlerConfig & ZoomHandlerConfig, camera?: ObservableBoardCamera);
|
|
132
194
|
/**
|
|
133
|
-
*
|
|
195
|
+
* Zooms to a target level while keeping a viewport point stationary (zoom-to-cursor).
|
|
196
|
+
*
|
|
197
|
+
* @param targetZoom - Target zoom level to reach
|
|
198
|
+
* @param at - Anchor point in viewport coordinates (center-anchored, CSS pixels)
|
|
199
|
+
*
|
|
200
|
+
* @remarks
|
|
201
|
+
* This implements the "zoom to cursor" behavior commonly seen in map applications.
|
|
202
|
+
* The algorithm:
|
|
203
|
+
* 1. Converts anchor point from viewport to world space (before zoom)
|
|
204
|
+
* 2. Applies zoom transformation (may be clamped by config)
|
|
205
|
+
* 3. Converts anchor point from viewport to world space (after zoom)
|
|
206
|
+
* 4. Calculates position difference and pans camera to compensate
|
|
207
|
+
*
|
|
208
|
+
* The anchor point remains stationary on screen, while the world zooms around it.
|
|
209
|
+
*
|
|
210
|
+
* @example
|
|
211
|
+
* ```typescript
|
|
212
|
+
* // Zoom to 2x at mouse cursor position
|
|
213
|
+
* rig.zoomToAt(2.0, { x: mouseX, y: mouseY });
|
|
214
|
+
*
|
|
215
|
+
* // The world point under the cursor stays in place
|
|
216
|
+
* ```
|
|
134
217
|
*/
|
|
135
218
|
zoomToAt(targetZoom: number, at: Point): void;
|
|
136
219
|
/**
|
|
137
|
-
*
|
|
220
|
+
* Zooms by a relative delta while keeping a viewport point stationary.
|
|
221
|
+
*
|
|
222
|
+
* @param delta - Relative zoom delta (multiplied by current zoom level)
|
|
223
|
+
* @param at - Anchor point in viewport coordinates (center-anchored, CSS pixels)
|
|
224
|
+
*
|
|
225
|
+
* @remarks
|
|
226
|
+
* This method is ideal for mouse wheel zoom interactions where the delta
|
|
227
|
+
* represents a relative change rather than an absolute target.
|
|
228
|
+
*
|
|
229
|
+
* The delta is scaled by current zoom level: `actualDelta = delta * currentZoom`
|
|
230
|
+
* This provides consistent zoom "speed" regardless of current zoom level.
|
|
231
|
+
*
|
|
232
|
+
* Like {@link zoomToAt}, this keeps the anchor point stationary during zoom.
|
|
233
|
+
*
|
|
234
|
+
* @example
|
|
235
|
+
* ```typescript
|
|
236
|
+
* // Zoom in by 10% at cursor position (mouse wheel up)
|
|
237
|
+
* rig.zoomByAt(0.1, cursorPosition);
|
|
238
|
+
*
|
|
239
|
+
* // Zoom out by 10% at cursor position (mouse wheel down)
|
|
240
|
+
* rig.zoomByAt(-0.1, cursorPosition);
|
|
241
|
+
* ```
|
|
242
|
+
*
|
|
243
|
+
* @see {@link zoomToAt} for zooming to an absolute level
|
|
138
244
|
*/
|
|
139
245
|
zoomByAt(delta: number, at: Point): void;
|
|
140
246
|
/**
|
|
141
|
-
*
|
|
247
|
+
* Zooms to a target level with the viewport center as the anchor point.
|
|
248
|
+
*
|
|
249
|
+
* @param targetZoom - Target zoom level to reach
|
|
250
|
+
*
|
|
251
|
+
* @remarks
|
|
252
|
+
* This is a simpler version of {@link zoomToAt} that always zooms relative to the
|
|
253
|
+
* viewport center. The camera position remains unchanged, so the center point of
|
|
254
|
+
* the viewport stays fixed in world space.
|
|
255
|
+
*
|
|
256
|
+
* Use this when you want straightforward zoom without anchor-point tracking,
|
|
257
|
+
* such as zoom controls in a UI toolbar.
|
|
258
|
+
*
|
|
259
|
+
* @example
|
|
260
|
+
* ```typescript
|
|
261
|
+
* // Zoom to 2x, centered on current view
|
|
262
|
+
* rig.zoomTo(2.0);
|
|
263
|
+
*
|
|
264
|
+
* // Zoom to fit (100%)
|
|
265
|
+
* rig.zoomTo(1.0);
|
|
266
|
+
* ```
|
|
267
|
+
*
|
|
268
|
+
* @see {@link zoomToAt} for zoom with custom anchor point
|
|
142
269
|
*/
|
|
143
270
|
zoomTo(targetZoom: number): void;
|
|
144
271
|
/**
|
|
145
|
-
*
|
|
272
|
+
* Zooms by a relative delta with the viewport center as the anchor point.
|
|
273
|
+
*
|
|
274
|
+
* @param delta - Zoom delta (added to current zoom level)
|
|
275
|
+
*
|
|
276
|
+
* @remarks
|
|
277
|
+
* Unlike {@link zoomByAt}, the delta is NOT scaled by current zoom level.
|
|
278
|
+
* This provides absolute delta changes, useful for programmatic zoom adjustments.
|
|
279
|
+
*
|
|
280
|
+
* The camera position remains unchanged, keeping the viewport center fixed in world space.
|
|
281
|
+
*
|
|
282
|
+
* @example
|
|
283
|
+
* ```typescript
|
|
284
|
+
* // Increase zoom by 0.5
|
|
285
|
+
* rig.zoomBy(0.5);
|
|
286
|
+
*
|
|
287
|
+
* // Decrease zoom by 0.2
|
|
288
|
+
* rig.zoomBy(-0.2);
|
|
289
|
+
* ```
|
|
290
|
+
*
|
|
291
|
+
* @see {@link zoomByAt} for zoom with custom anchor point and scaling
|
|
146
292
|
*/
|
|
147
293
|
zoomBy(delta: number): void;
|
|
148
294
|
/**
|
|
149
|
-
*
|
|
295
|
+
* Zooms to a target level while keeping a world-space point stationary.
|
|
296
|
+
*
|
|
297
|
+
* @param targetZoom - Target zoom level to reach
|
|
298
|
+
* @param at - Anchor point in world coordinates
|
|
299
|
+
*
|
|
300
|
+
* @remarks
|
|
301
|
+
* Similar to {@link zoomToAt}, but accepts world-space coordinates instead of viewport coordinates.
|
|
302
|
+
* Useful when you want to zoom to keep a specific world object or location centered,
|
|
303
|
+
* rather than a screen position.
|
|
304
|
+
*
|
|
305
|
+
* The algorithm:
|
|
306
|
+
* 1. Converts world anchor to viewport space (before zoom)
|
|
307
|
+
* 2. Applies zoom transformation
|
|
308
|
+
* 3. Converts world anchor to viewport space (after zoom)
|
|
309
|
+
* 4. Calculates viewport movement and converts to world space
|
|
310
|
+
* 5. Pans camera to compensate
|
|
311
|
+
*
|
|
312
|
+
* @example
|
|
313
|
+
* ```typescript
|
|
314
|
+
* // Zoom to 3x while keeping a specific world object in place
|
|
315
|
+
* const objectWorldPos = { x: 1000, y: 500 };
|
|
316
|
+
* rig.zoomToAtWorld(3.0, objectWorldPos);
|
|
317
|
+
* ```
|
|
318
|
+
*
|
|
319
|
+
* @see {@link zoomToAt} for viewport-space variant
|
|
150
320
|
*/
|
|
151
321
|
zoomToAtWorld(targetZoom: number, at: Point): void;
|
|
152
322
|
/**
|
|
153
|
-
*
|
|
323
|
+
* Zooms by a delta while keeping a world-space point stationary.
|
|
324
|
+
*
|
|
325
|
+
* @param delta - Zoom delta (added to current zoom level, not scaled)
|
|
326
|
+
* @param at - Anchor point in world coordinates
|
|
327
|
+
*
|
|
328
|
+
* @remarks
|
|
329
|
+
* World-space variant of {@link zoomByAt}. The delta is NOT scaled by current zoom level,
|
|
330
|
+
* unlike the viewport-space version.
|
|
331
|
+
*
|
|
332
|
+
* Use this when programmatically zooming around specific world objects or coordinates.
|
|
333
|
+
*
|
|
334
|
+
* @example
|
|
335
|
+
* ```typescript
|
|
336
|
+
* // Zoom in by 0.5 while keeping a world landmark stationary
|
|
337
|
+
* const landmarkPos = { x: 2000, y: 1500 };
|
|
338
|
+
* rig.zoomByAtWorld(0.5, landmarkPos);
|
|
339
|
+
* ```
|
|
340
|
+
*
|
|
341
|
+
* @see {@link zoomByAt} for viewport-space variant with scaled delta
|
|
154
342
|
*/
|
|
155
343
|
zoomByAtWorld(delta: number, at: Point): void;
|
|
156
344
|
/**
|
|
157
|
-
*
|
|
345
|
+
* Pans the camera by a delta in viewport coordinates.
|
|
346
|
+
*
|
|
347
|
+
* @param delta - Movement delta in viewport space (center-anchored, CSS pixels)
|
|
348
|
+
*
|
|
349
|
+
* @remarks
|
|
350
|
+
* This is the most common pan method for user input (mouse drag, touch pan).
|
|
351
|
+
* The delta is in screen/viewport coordinates and gets converted to world space
|
|
352
|
+
* accounting for current camera rotation and zoom.
|
|
353
|
+
*
|
|
354
|
+
* Conversion formula:
|
|
355
|
+
* 1. Rotate delta by camera rotation
|
|
356
|
+
* 2. Scale by inverse zoom (1 / zoomLevel)
|
|
357
|
+
* 3. Apply as world-space pan
|
|
358
|
+
*
|
|
359
|
+
* @example
|
|
360
|
+
* ```typescript
|
|
361
|
+
* // Pan camera when user drags mouse
|
|
362
|
+
* canvas.addEventListener('mousemove', (e) => {
|
|
363
|
+
* if (isDragging) {
|
|
364
|
+
* const delta = { x: e.movementX, y: e.movementY };
|
|
365
|
+
* rig.panByViewPort(delta);
|
|
366
|
+
* }
|
|
367
|
+
* });
|
|
368
|
+
* ```
|
|
369
|
+
*
|
|
370
|
+
* @see {@link panByWorld} for world-space panning
|
|
158
371
|
*/
|
|
159
372
|
panByViewPort(delta: Point): void;
|
|
160
373
|
/**
|
|
161
|
-
*
|
|
374
|
+
* Pans the camera by a delta in world coordinates.
|
|
375
|
+
*
|
|
376
|
+
* @param delta - Movement delta in world space
|
|
377
|
+
*
|
|
378
|
+
* @remarks
|
|
379
|
+
* Use this for programmatic camera movement or when you already have world-space
|
|
380
|
+
* coordinates (e.g., moving camera to follow a world object).
|
|
381
|
+
*
|
|
382
|
+
* The delta is passed through the pan handler which may apply:
|
|
383
|
+
* - Boundary clamping
|
|
384
|
+
* - Movement restrictions (restrictXTranslation, restrictYTranslation)
|
|
385
|
+
* - Other constraints from {@link CameraRigConfig}
|
|
386
|
+
*
|
|
387
|
+
* @example
|
|
388
|
+
* ```typescript
|
|
389
|
+
* // Move camera 100 units right, 50 units up in world space
|
|
390
|
+
* rig.panByWorld({ x: 100, y: -50 });
|
|
391
|
+
*
|
|
392
|
+
* // Follow a moving object
|
|
393
|
+
* const objectMovement = { x: obj.dx, y: obj.dy };
|
|
394
|
+
* rig.panByWorld(objectMovement);
|
|
395
|
+
* ```
|
|
396
|
+
*
|
|
397
|
+
* @see {@link panByViewPort} for viewport-space panning
|
|
162
398
|
*/
|
|
163
399
|
panByWorld(delta: Point): void;
|
|
164
400
|
/**
|
|
165
|
-
*
|
|
401
|
+
* Pans the camera to an absolute position in world coordinates.
|
|
402
|
+
*
|
|
403
|
+
* @param target - Target camera position in world space
|
|
404
|
+
*
|
|
405
|
+
* @remarks
|
|
406
|
+
* Sets the camera position directly (subject to constraints).
|
|
407
|
+
* Unlike pan-by methods, this is an absolute positioning operation.
|
|
408
|
+
*
|
|
409
|
+
* The target is passed through the pan handler which may apply:
|
|
410
|
+
* - Boundary clamping
|
|
411
|
+
* - Position restrictions
|
|
412
|
+
*
|
|
413
|
+
* Use this for:
|
|
414
|
+
* - "Go to location" features
|
|
415
|
+
* - Centering camera on specific world coordinates
|
|
416
|
+
* - Resetting camera to a known position
|
|
417
|
+
*
|
|
418
|
+
* @example
|
|
419
|
+
* ```typescript
|
|
420
|
+
* // Center camera on world origin
|
|
421
|
+
* rig.panToWorld({ x: 0, y: 0 });
|
|
422
|
+
*
|
|
423
|
+
* // Go to specific landmark
|
|
424
|
+
* const landmark = { x: 1000, y: 500 };
|
|
425
|
+
* rig.panToWorld(landmark);
|
|
426
|
+
* ```
|
|
427
|
+
*
|
|
428
|
+
* @see {@link panToViewPort} for viewport-space variant
|
|
166
429
|
*/
|
|
167
430
|
panToWorld(target: Point): void;
|
|
168
431
|
/**
|
|
169
|
-
*
|
|
432
|
+
* Pans the camera to position a viewport point at a specific location.
|
|
433
|
+
*
|
|
434
|
+
* @param target - Target position in viewport coordinates (center-anchored, CSS pixels)
|
|
435
|
+
*
|
|
436
|
+
* @remarks
|
|
437
|
+
* Moves the camera so that the specified viewport point ends up at the viewport center.
|
|
438
|
+
* This is less commonly used than world-space pan-to operations.
|
|
439
|
+
*
|
|
440
|
+
* The method converts the viewport target to world space, then uses {@link panToWorld}.
|
|
441
|
+
*
|
|
442
|
+
* @example
|
|
443
|
+
* ```typescript
|
|
444
|
+
* // Center the camera on what's currently at the top-left of viewport
|
|
445
|
+
* rig.panToViewPort({ x: -400, y: -300 });
|
|
446
|
+
* ```
|
|
447
|
+
*
|
|
448
|
+
* @see {@link panToWorld} for world-space variant (more commonly used)
|
|
170
449
|
*/
|
|
171
450
|
panToViewPort(target: Point): void;
|
|
172
451
|
/**
|
|
173
|
-
*
|
|
452
|
+
* Rotates the camera by a delta angle.
|
|
453
|
+
*
|
|
454
|
+
* @param delta - Rotation delta in radians (positive = counter-clockwise)
|
|
455
|
+
*
|
|
456
|
+
* @remarks
|
|
457
|
+
* Applies a relative rotation to the camera. The delta is passed through the
|
|
458
|
+
* rotation handler which may apply clamping or restrictions based on {@link CameraRigConfig}.
|
|
459
|
+
*
|
|
460
|
+
* Camera rotation affects:
|
|
461
|
+
* - How viewport coordinates map to world coordinates
|
|
462
|
+
* - The orientation of pan operations
|
|
463
|
+
* - Visual rendering of the world
|
|
464
|
+
*
|
|
465
|
+
* @example
|
|
466
|
+
* ```typescript
|
|
467
|
+
* // Rotate 45 degrees counter-clockwise
|
|
468
|
+
* rig.rotateBy(Math.PI / 4);
|
|
469
|
+
*
|
|
470
|
+
* // Rotate 90 degrees clockwise
|
|
471
|
+
* rig.rotateBy(-Math.PI / 2);
|
|
472
|
+
* ```
|
|
473
|
+
*
|
|
474
|
+
* @see {@link rotateTo} for absolute rotation
|
|
174
475
|
*/
|
|
175
476
|
rotateBy(delta: number): void;
|
|
176
477
|
/**
|
|
177
|
-
*
|
|
478
|
+
* Rotates the camera to an absolute angle.
|
|
479
|
+
*
|
|
480
|
+
* @param target - Target rotation in radians (0 = no rotation, positive = counter-clockwise)
|
|
481
|
+
*
|
|
482
|
+
* @remarks
|
|
483
|
+
* Sets the camera rotation to a specific angle (subject to constraints).
|
|
484
|
+
* The target is passed through the rotation handler which may apply clamping.
|
|
485
|
+
*
|
|
486
|
+
* Use this for:
|
|
487
|
+
* - Resetting camera to north-up orientation (0 radians)
|
|
488
|
+
* - Snapping to cardinal directions
|
|
489
|
+
* - Setting rotation from UI controls
|
|
490
|
+
*
|
|
491
|
+
* @example
|
|
492
|
+
* ```typescript
|
|
493
|
+
* // Reset to north-up
|
|
494
|
+
* rig.rotateTo(0);
|
|
495
|
+
*
|
|
496
|
+
* // Rotate to 90 degrees
|
|
497
|
+
* rig.rotateTo(Math.PI / 2);
|
|
498
|
+
* ```
|
|
499
|
+
*
|
|
500
|
+
* @see {@link rotateBy} for relative rotation
|
|
178
501
|
*/
|
|
179
502
|
rotateTo(target: number): void;
|
|
503
|
+
/**
|
|
504
|
+
* Sets whether the entire viewport must remain within boundaries.
|
|
505
|
+
*
|
|
506
|
+
* @remarks
|
|
507
|
+
* When true, pan boundaries ensure the entire viewport stays within configured limits.
|
|
508
|
+
* When false, only the camera center point is constrained.
|
|
509
|
+
*
|
|
510
|
+
* This is a convenience setter for {@link CameraRigConfig.limitEntireViewPort}.
|
|
511
|
+
*/
|
|
180
512
|
set limitEntireViewPort(limit: boolean);
|
|
181
513
|
/**
|
|
182
|
-
*
|
|
514
|
+
* Gets whether the entire viewport must remain within boundaries.
|
|
515
|
+
*
|
|
516
|
+
* @returns True if entire viewport is constrained, false if only center is constrained
|
|
183
517
|
*/
|
|
184
518
|
get limitEntireViewPort(): boolean;
|
|
519
|
+
/**
|
|
520
|
+
* Gets the underlying observable camera instance.
|
|
521
|
+
*
|
|
522
|
+
* @returns The camera being controlled by this rig
|
|
523
|
+
*/
|
|
185
524
|
get camera(): ObservableBoardCamera;
|
|
525
|
+
/**
|
|
526
|
+
* Sets the underlying camera instance.
|
|
527
|
+
*
|
|
528
|
+
* @param camera - New camera to control
|
|
529
|
+
*
|
|
530
|
+
* @remarks
|
|
531
|
+
* Use this to swap cameras at runtime, though this is uncommon.
|
|
532
|
+
* Usually you create a new rig instead.
|
|
533
|
+
*/
|
|
186
534
|
set camera(camera: ObservableBoardCamera);
|
|
535
|
+
/**
|
|
536
|
+
* Gets the current camera rig configuration.
|
|
537
|
+
*
|
|
538
|
+
* @returns Current configuration object
|
|
539
|
+
*
|
|
540
|
+
* @remarks
|
|
541
|
+
* Returns a reference to the internal config. Modifications will affect rig behavior.
|
|
542
|
+
* For safer updates, use {@link configure} instead.
|
|
543
|
+
*/
|
|
187
544
|
get config(): CameraRigConfig;
|
|
545
|
+
/**
|
|
546
|
+
* Sets the camera rig configuration.
|
|
547
|
+
*
|
|
548
|
+
* @param config - New configuration object
|
|
549
|
+
*
|
|
550
|
+
* @remarks
|
|
551
|
+
* Creates a shallow copy of the provided config.
|
|
552
|
+
* For partial updates, use {@link configure} instead.
|
|
553
|
+
*/
|
|
188
554
|
set config(config: CameraRigConfig);
|
|
189
555
|
/**
|
|
190
|
-
*
|
|
556
|
+
* Updates camera rig configuration with partial settings.
|
|
557
|
+
*
|
|
558
|
+
* @param config - Partial configuration to merge with current config
|
|
559
|
+
*
|
|
560
|
+
* @remarks
|
|
561
|
+
* This is the recommended way to update configuration at runtime.
|
|
562
|
+
* Only provided properties are updated; others remain unchanged.
|
|
563
|
+
*
|
|
564
|
+
* @example
|
|
565
|
+
* ```typescript
|
|
566
|
+
* // Enable zoom restrictions without changing other settings
|
|
567
|
+
* rig.configure({
|
|
568
|
+
* restrictZoom: true,
|
|
569
|
+
* zoomLevelLimits: { min: 0.5, max: 5.0 }
|
|
570
|
+
* });
|
|
571
|
+
*
|
|
572
|
+
* // Disable position clamping
|
|
573
|
+
* rig.configure({ clampTranslation: false });
|
|
574
|
+
* ```
|
|
191
575
|
*/
|
|
192
576
|
configure(config: Partial<CameraRigConfig>): void;
|
|
193
577
|
/**
|
|
194
|
-
*
|
|
578
|
+
* Cleans up resources used by the camera rig.
|
|
579
|
+
*
|
|
580
|
+
* @remarks
|
|
581
|
+
* Currently a no-op as DefaultCameraRig has no resources to clean up.
|
|
582
|
+
* Implements {@link BaseContext} interface for consistency with other systems.
|
|
195
583
|
*/
|
|
196
584
|
cleanup(): void;
|
|
197
585
|
/**
|
|
198
|
-
*
|
|
586
|
+
* Sets up the camera rig.
|
|
587
|
+
*
|
|
588
|
+
* @remarks
|
|
589
|
+
* Currently a no-op as DefaultCameraRig requires no setup.
|
|
590
|
+
* Implements {@link BaseContext} interface for consistency with other systems.
|
|
199
591
|
*/
|
|
200
592
|
setup(): void;
|
|
593
|
+
/**
|
|
594
|
+
* Updates the camera rig state.
|
|
595
|
+
*
|
|
596
|
+
* @remarks
|
|
597
|
+
* Currently a no-op as DefaultCameraRig has no per-frame update logic.
|
|
598
|
+
* Implements {@link BaseContext} interface for consistency with other systems.
|
|
599
|
+
*
|
|
600
|
+
* In stateful rig implementations, this might handle:
|
|
601
|
+
* - Animation interpolation
|
|
602
|
+
* - Momentum/inertia
|
|
603
|
+
* - Smooth camera following
|
|
604
|
+
*/
|
|
201
605
|
update(): void;
|
|
202
606
|
}
|
|
203
607
|
/**
|
|
204
|
-
*
|
|
608
|
+
* Creates a camera rig with sensible default configuration.
|
|
609
|
+
*
|
|
610
|
+
* @param camera - Observable camera instance to control
|
|
611
|
+
* @returns Configured camera rig ready for use
|
|
612
|
+
*
|
|
613
|
+
* @remarks
|
|
614
|
+
* This factory function creates a {@link DefaultCameraRig} with a balanced default configuration:
|
|
615
|
+
*
|
|
616
|
+
* **Enabled by default:**
|
|
617
|
+
* - `limitEntireViewPort: true` - Entire viewport stays within boundaries
|
|
618
|
+
* - `clampTranslation: true` - Position is clamped to boundaries
|
|
619
|
+
* - `clampZoom: true` - Zoom is clamped to limits
|
|
620
|
+
*
|
|
621
|
+
* **Disabled by default:**
|
|
622
|
+
* - All movement restrictions (`restrictXTranslation`, `restrictYTranslation`, etc.)
|
|
623
|
+
* - Zoom restrictions (`restrictZoom`)
|
|
624
|
+
* - Relative translation restrictions
|
|
625
|
+
*
|
|
626
|
+
* This configuration allows free camera movement with boundary enforcement,
|
|
627
|
+
* suitable for most infinite canvas applications.
|
|
628
|
+
*
|
|
629
|
+
* @example
|
|
630
|
+
* ```typescript
|
|
631
|
+
* const camera = new DefaultBoardCamera(1920, 1080);
|
|
632
|
+
* const rig = createDefaultCameraRig(camera);
|
|
633
|
+
*
|
|
634
|
+
* // Ready to use with sensible defaults
|
|
635
|
+
* rig.configure({
|
|
636
|
+
* boundaries: {
|
|
637
|
+
* min: { x: -1000, y: -1000 },
|
|
638
|
+
* max: { x: 1000, y: 1000 }
|
|
639
|
+
* }
|
|
640
|
+
* });
|
|
641
|
+
*
|
|
642
|
+
* rig.panByViewPort({ x: 100, y: 50 });
|
|
643
|
+
* rig.zoomByAt(0.1, mousePosition);
|
|
644
|
+
* ```
|
|
205
645
|
*
|
|
206
|
-
* @category Camera
|
|
646
|
+
* @category Camera Rig
|
|
647
|
+
* @see {@link DefaultCameraRig} for the implementation
|
|
648
|
+
* @see {@link CameraRigConfig} for all available configuration options
|
|
207
649
|
*/
|
|
208
650
|
export declare function createDefaultCameraRig(camera: ObservableBoardCamera): CameraRig;
|