@netless/app-presentation 0.1.10 → 0.1.11
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-zh.md +42 -1
- package/README.md +47 -1
- package/dist/index.d.ts +20 -5
- package/dist/index.global.js +424 -119
- package/dist/index.js +424 -119
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +424 -119
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -2
- package/src/app-presentation.ts +423 -117
- package/src/camera-options.ts +19 -0
- package/src/camera-reference.ts +81 -0
package/README-zh.md
CHANGED
|
@@ -64,10 +64,27 @@ fastboard.manager.addApp({
|
|
|
64
64
|
previewURL: e.preview
|
|
65
65
|
}
|
|
66
66
|
}))
|
|
67
|
+
},
|
|
68
|
+
attributes: {
|
|
69
|
+
originSize: { width: 1280, height: 720 }
|
|
67
70
|
}
|
|
68
71
|
})
|
|
69
72
|
```
|
|
70
73
|
|
|
74
|
+
配置 `originSize` 后,它表示 `scale = 1` 时的共享白板原始尺寸。Presentation 在写入白板
|
|
75
|
+
scene 前,将每页 `ppt.width/ppt.height` 按原始宽高比等比 contain 到 `originSize`:
|
|
76
|
+
|
|
77
|
+
```text
|
|
78
|
+
ratio = min(originSize.width / ppt.width, originSize.height / ppt.height)
|
|
79
|
+
scenePpt.width = ppt.width * ratio
|
|
80
|
+
scenePpt.height = ppt.height * ratio
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
图片 URL 不变。归一化后的尺寸同时用于 scene、CameraBound、滚动条和裁剪范围,因此相对倍率为
|
|
84
|
+
`1` 时页面以最大等比例完整显示,不出现滚动条。切页时如果 shared viewport 已建立,会直接恢复
|
|
85
|
+
该 viewport 并保持当前相对 scale,不会先应用一次中间 fit camera。未配置 `originSize` 时继续
|
|
86
|
+
直接使用输入的 `ppt.width/ppt.height`。
|
|
87
|
+
|
|
71
88
|
请注意,如果你没有使用 `{ as: 'DocsViewer' }` 替换 DocsViewer 应用,
|
|
72
89
|
[`dispatchDocsEvent()`](https://github.com/netless-io/fastboard#control-the-pdfpptx-apps)
|
|
73
90
|
函数将无法在 Presentation 应用上工作。这是因为该函数只处理类型为 `DocsViewer` 或 `Slide` 的应用。
|
|
@@ -76,6 +93,30 @@ fastboard.manager.addApp({
|
|
|
76
93
|
|
|
77
94
|
### 应用选项
|
|
78
95
|
|
|
96
|
+
#### `disableDeviceCameraTransform`
|
|
97
|
+
|
|
98
|
+
禁止鼠标滚轮、触摸手势等本地设备输入改变相机,但不改变程序化相机操作使用的
|
|
99
|
+
CameraBound:
|
|
100
|
+
|
|
101
|
+
```js
|
|
102
|
+
const manager = await WindowManager.mount({
|
|
103
|
+
room,
|
|
104
|
+
container,
|
|
105
|
+
builtinAppOptions: {
|
|
106
|
+
Presentation: {
|
|
107
|
+
disableDeviceCameraTransform: true,
|
|
108
|
+
},
|
|
109
|
+
},
|
|
110
|
+
})
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
该配置仅在本地客户端生效,不会同步给其他客户端。不要同时启用旧的
|
|
114
|
+
`disableCameraTransform`,因为旧配置会按原有语义将 CameraBound 锁定到页面适配缩放。
|
|
115
|
+
|
|
116
|
+
`useScrollbar` 和 `maxCameraScale` 是相互独立的配置。Presentation Controller 的程序化
|
|
117
|
+
`moveCamera` 要求启用 `useScrollbar`;`maxCameraScale` 只控制程序化缩放上限,默认值为
|
|
118
|
+
`3`,只有业务需要调用 `scalePage({ scale: 4 })` 时才需要设为 `4`。
|
|
119
|
+
|
|
79
120
|
#### `useScrollbar`
|
|
80
121
|
启用滚动条功能,提供水平和垂直滚动条用于导航和查看演示文稿。
|
|
81
122
|
|
|
@@ -141,7 +182,7 @@ if (app && app.kind === 'DocsViewer') {
|
|
|
141
182
|
```
|
|
142
183
|
|
|
143
184
|
#### `getPageSize()`
|
|
144
|
-
|
|
185
|
+
获取当前页面在白板 scene 中的尺寸(宽度和高度)。配置 `originSize` 时返回等比归一化后的尺寸。
|
|
145
186
|
|
|
146
187
|
```js
|
|
147
188
|
const app = fastboard.manager.queryOne(appId)
|
package/README.md
CHANGED
|
@@ -67,10 +67,29 @@ fastboard.manager.addApp({
|
|
|
67
67
|
previewURL: e.preview
|
|
68
68
|
}
|
|
69
69
|
}))
|
|
70
|
+
},
|
|
71
|
+
attributes: {
|
|
72
|
+
originSize: { width: 1280, height: 720 }
|
|
70
73
|
}
|
|
71
74
|
})
|
|
72
75
|
```
|
|
73
76
|
|
|
77
|
+
When `originSize` is configured, it is the shared whiteboard reference size for `scale = 1`.
|
|
78
|
+
Before writing each page into the whiteboard scene, Presentation contains its
|
|
79
|
+
`ppt.width/ppt.height` proportionally within `originSize`:
|
|
80
|
+
|
|
81
|
+
```text
|
|
82
|
+
ratio = min(originSize.width / ppt.width, originSize.height / ppt.height)
|
|
83
|
+
scenePpt.width = ppt.width * ratio
|
|
84
|
+
scenePpt.height = ppt.height * ratio
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
The image URL is unchanged. The normalized size is used consistently by the scene, CameraBound,
|
|
88
|
+
scrollbars, and clipping, so relative scale `1` shows the largest complete page without scrollbars.
|
|
89
|
+
When switching pages, an established shared viewport is restored directly so the current relative
|
|
90
|
+
scale is preserved without first applying an intermediate fit camera.
|
|
91
|
+
Without `originSize`, the input `ppt.width/ppt.height` remains unchanged.
|
|
92
|
+
|
|
74
93
|
Note that if you do not replace the DocsViewer app with `{ as: 'DocsViewer' }`,
|
|
75
94
|
the [`dispatchDocsEvent()`](https://github.com/netless-io/fastboard#control-the-pdfpptx-apps)
|
|
76
95
|
function won't work on the Presentation app. This is because that function only
|
|
@@ -80,6 +99,32 @@ handles app whose kind is `DocsViewer` or `Slide`.
|
|
|
80
99
|
|
|
81
100
|
### App Options
|
|
82
101
|
|
|
102
|
+
#### `disableDeviceCameraTransform`
|
|
103
|
+
|
|
104
|
+
Disable camera transforms initiated by local device input, such as mouse-wheel and touch gestures,
|
|
105
|
+
without changing the camera bound used by programmatic camera operations:
|
|
106
|
+
|
|
107
|
+
```js
|
|
108
|
+
const manager = await WindowManager.mount({
|
|
109
|
+
room,
|
|
110
|
+
container,
|
|
111
|
+
builtinAppOptions: {
|
|
112
|
+
Presentation: {
|
|
113
|
+
disableDeviceCameraTransform: true,
|
|
114
|
+
},
|
|
115
|
+
},
|
|
116
|
+
})
|
|
117
|
+
```
|
|
118
|
+
|
|
119
|
+
This option is local and is not synchronized to other clients. Do not enable the legacy
|
|
120
|
+
`disableCameraTransform` option at the same time because it intentionally locks the camera bound
|
|
121
|
+
to the fitted page scale.
|
|
122
|
+
|
|
123
|
+
`useScrollbar` and `maxCameraScale` are independent options. `useScrollbar` is required by the
|
|
124
|
+
Presentation controller's programmatic `moveCamera` operation. `maxCameraScale` only controls its
|
|
125
|
+
upper scaling bound and defaults to `3`; set it to `4` only when the application needs
|
|
126
|
+
`scalePage({ scale: 4 })`.
|
|
127
|
+
|
|
83
128
|
#### `useScrollbar`
|
|
84
129
|
Enable scrollbar feature, providing horizontal and vertical scrollbars for navigation and viewing presentations.
|
|
85
130
|
|
|
@@ -141,7 +186,8 @@ if (app && app.kind === 'DocsViewer') {
|
|
|
141
186
|
```
|
|
142
187
|
|
|
143
188
|
#### `getPageSize()`
|
|
144
|
-
Get the size
|
|
189
|
+
Get the current page size in whiteboard scene coordinates. With `originSize`, this returns the
|
|
190
|
+
proportionally normalized size.
|
|
145
191
|
|
|
146
192
|
```js
|
|
147
193
|
const app = fastboard.manager.queryOne(appId)
|
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { View, NetlessApp, AppContext, WindowManager } from '@netless/window-manager';
|
|
1
|
+
import { View, NetlessApp, Size, AppContext, WindowManager } from '@netless/window-manager';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* A combination of {@link Disposer} and {@link IDisposable}.
|
|
@@ -378,6 +378,13 @@ declare class Scrollbar {
|
|
|
378
378
|
}
|
|
379
379
|
|
|
380
380
|
type Logger = (...data: any[]) => void;
|
|
381
|
+
declare const ORIGIN_SIZE_COORDINATE_VERSION = 2;
|
|
382
|
+
interface PresentationAttributes {
|
|
383
|
+
/** Shared logical camera reference size. New pages are proportionally contained within it. */
|
|
384
|
+
originSize?: Size | null;
|
|
385
|
+
/** Internal marker for scenes whose ppt size has been normalized to originSize. */
|
|
386
|
+
_originSizeCoordinateVersion?: typeof ORIGIN_SIZE_COORDINATE_VERSION;
|
|
387
|
+
}
|
|
381
388
|
interface Viewport {
|
|
382
389
|
readonly x: number;
|
|
383
390
|
readonly y: number;
|
|
@@ -387,6 +394,8 @@ interface Viewport {
|
|
|
387
394
|
interface PresentationAppOptions {
|
|
388
395
|
/** Disables user move / scale the image and whiteboard. */
|
|
389
396
|
disableCameraTransform?: boolean;
|
|
397
|
+
/** Disables camera transforms from local device input without restricting programmatic scaling. */
|
|
398
|
+
disableDeviceCameraTransform?: boolean;
|
|
390
399
|
/** Max scale = `maxCameraScale` * default scale. Not working when `disableCameraTransform` is true. Default: 3 */
|
|
391
400
|
maxCameraScale?: number;
|
|
392
401
|
/** Custom logger. Default: a logger that reports to the whiteboard server. */
|
|
@@ -405,7 +414,7 @@ interface PresentationAppOptions {
|
|
|
405
414
|
viewport?: Viewport | ((page: PresentationPage) => Viewport);
|
|
406
415
|
/** justDocsViewReadonly is used to set the presentation readonly, it will be used in the presentation, and the presentation will be readonly when the app is initialized */
|
|
407
416
|
justDocsViewReadonly?: true;
|
|
408
|
-
/**
|
|
417
|
+
/** Shows draggable scrollbars. This does not affect PresentationController.moveCamera(). */
|
|
409
418
|
useScrollbar?: boolean;
|
|
410
419
|
/** debounceSync is used to set the presentation debounce sync, it will be used in the presentation, and the presentation will be debounce sync when the app is initialized */
|
|
411
420
|
debounceSync?: boolean;
|
|
@@ -425,6 +434,12 @@ interface PresentationController {
|
|
|
425
434
|
prevPage(): boolean;
|
|
426
435
|
/** Returns false if failed to jump */
|
|
427
436
|
nextPage(): boolean;
|
|
437
|
+
/** Resolves after the whiteboard View has accepted the target scene path. */
|
|
438
|
+
jumpPageAsync(index: number): Promise<boolean>;
|
|
439
|
+
/** Resolves after the whiteboard View has accepted the previous scene path. */
|
|
440
|
+
prevPageAsync(): Promise<boolean>;
|
|
441
|
+
/** Resolves after the whiteboard View has accepted the next scene path. */
|
|
442
|
+
nextPageAsync(): Promise<boolean>;
|
|
428
443
|
/** `index` ranges from 0 to `length - 1` */
|
|
429
444
|
pageState(): {
|
|
430
445
|
index: number;
|
|
@@ -439,7 +454,7 @@ interface PresentationController {
|
|
|
439
454
|
setDocsViewReadonly: (bol: boolean) => void;
|
|
440
455
|
/** set the presentation readonly */
|
|
441
456
|
setReadonly: (bol: boolean) => void;
|
|
442
|
-
/**
|
|
457
|
+
/** Moves the camera through the API, regardless of whether scrollbars are shown. */
|
|
443
458
|
moveCamera: (camera: {
|
|
444
459
|
centerX: number;
|
|
445
460
|
centerY: number;
|
|
@@ -457,7 +472,7 @@ interface PresentationController {
|
|
|
457
472
|
/** screenshot the current page */
|
|
458
473
|
screenshotCurrentPageAsync: (context: CanvasRenderingContext2D, width?: number, height?: number) => Promise<void>;
|
|
459
474
|
}
|
|
460
|
-
declare const NetlessAppPresentation: NetlessApp<
|
|
475
|
+
declare const NetlessAppPresentation: NetlessApp<PresentationAttributes, {}, PresentationAppOptions, PresentationController>;
|
|
461
476
|
type RegisterFn = typeof WindowManager["register"];
|
|
462
477
|
interface InstallOptions {
|
|
463
478
|
/**
|
|
@@ -483,4 +498,4 @@ declare const install: (register: RegisterFn, options?: InstallOptions) => Promi
|
|
|
483
498
|
declare const version: string;
|
|
484
499
|
|
|
485
500
|
export { NetlessAppPresentation, Presentation, Scrollbar, NetlessAppPresentation as default, install, version };
|
|
486
|
-
export type { InstallOptions, Logger, PresentationAppOptions, PresentationConfig, PresentationController, PresentationPage, RegisterFn, ScrollbarEventCallback, ScrollbarOption };
|
|
501
|
+
export type { InstallOptions, Logger, PresentationAppOptions, PresentationAttributes, PresentationConfig, PresentationController, PresentationPage, RegisterFn, ScrollbarEventCallback, ScrollbarOption };
|