@web-ppt/viewer-core 0.4.2 → 0.4.4
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/CHANGELOG.md +31 -0
- package/README.md +12 -13
- package/README.zh-CN.md +55 -0
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,37 @@
|
|
|
2
2
|
|
|
3
3
|
本文件记录对使用者可见的变化。版本号遵循 [语义化版本](https://semver.org/lang/zh-CN/)。
|
|
4
4
|
|
|
5
|
+
## 0.4.4
|
|
6
|
+
|
|
7
|
+
本版没有代码改动,只动文档——但 npm 上看到的东西全变了,所以值得单独发一版。
|
|
8
|
+
|
|
9
|
+
### 变更
|
|
10
|
+
|
|
11
|
+
- **npm 页面改英文**。三个包的 README 与 `description` 之前全是中文,
|
|
12
|
+
而 npm 的读者以国际开发者为主,等于最有说服力的能力矩阵对他们不存在。
|
|
13
|
+
现在 `@web-ppt/core` 的 npm 页取仓库的 `README.en.md`,另两个包各自
|
|
14
|
+
维护英文版,中文移到同目录的 `README.zh-CN.md`,两边顶部互链。
|
|
15
|
+
|
|
16
|
+
GitHub 首页仍是中文,两个入口各自面向自己的人群。
|
|
17
|
+
|
|
18
|
+
- **README 首屏补了演示 GIF 与定位段**。GIF 由 `npm run demo-gif` 录制,
|
|
19
|
+
录的是仓库自己生成的 `fixtures/showcase.pptx`,引擎改了重跑即可,
|
|
20
|
+
不是一次性的手工录屏。
|
|
21
|
+
|
|
22
|
+
## 0.4.3
|
|
23
|
+
|
|
24
|
+
### 变更
|
|
25
|
+
|
|
26
|
+
- **静态画面改回动画终态**,撤销 0.4.1 里改成初始态的那次调整。
|
|
27
|
+
|
|
28
|
+
对齐 PowerPoint 的模型:普通视图与缩略图看到的是「这一页演完的样子」,
|
|
29
|
+
按 F5 进入演示才从第一步开始建。所以**进全屏时画面跳一次是预期行为**,
|
|
30
|
+
不是 bug —— 0.4.1 当时是把这个跳变当成缺陷去消除的,方向错了。
|
|
31
|
+
|
|
32
|
+
「不能简单摊开全画」这条不变:一页里入场与退场的元素属于不同时刻,
|
|
33
|
+
全画出来等于把几帧叠在一起。全员退场的收尾页终态是空白,那种情况仍然
|
|
34
|
+
退回全部可见。
|
|
35
|
+
|
|
5
36
|
## 0.4.2
|
|
6
37
|
|
|
7
38
|
### 修复
|
package/README.md
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
# @web-ppt/viewer-core
|
|
2
2
|
|
|
3
|
-
[
|
|
3
|
+
**English** · [简体中文](https://github.com/unStone/web-ppt/blob/master/packages/viewer-core/README.zh-CN.md)
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
`Viewer`
|
|
5
|
+
The headless layer of [Web-PPT](https://github.com/unStone/web-ppt).
|
|
6
|
+
|
|
7
|
+
`PresentationState` is a pure state machine with zero DOM — navigation, zoom, search, animation batching, auto-advance. Drive it from plain DOM, React, Vue or Svelte, or run it straight in Node for tests. `Viewer` is the thinnest possible DOM binding on top (inject SVG, set visibility, kick off playback — about 24 lines).
|
|
8
8
|
|
|
9
9
|
```bash
|
|
10
10
|
npm i @web-ppt/core @web-ppt/viewer-core
|
|
11
11
|
```
|
|
12
12
|
|
|
13
|
-
##
|
|
13
|
+
## Batteries included
|
|
14
14
|
|
|
15
15
|
```ts
|
|
16
16
|
import { parse } from '@web-ppt/core';
|
|
@@ -19,14 +19,14 @@ import { Viewer } from '@web-ppt/viewer-core';
|
|
|
19
19
|
const pres = await parse(file);
|
|
20
20
|
const v = new Viewer(container, pres, { animate: true, autoAdvance: true });
|
|
21
21
|
|
|
22
|
-
v.next(); //
|
|
23
|
-
v.finishAnimations(); //
|
|
22
|
+
v.next(); // plays a pending animation batch, otherwise advances the slide
|
|
23
|
+
v.finishAnimations(); // jump to this slide's end state
|
|
24
24
|
v.setZoom(1.5);
|
|
25
|
-
v.search('
|
|
25
|
+
v.search('keyword'); // → array of matching slide indices
|
|
26
26
|
await v.exportPng(2); // → Blob
|
|
27
27
|
```
|
|
28
28
|
|
|
29
|
-
##
|
|
29
|
+
## Bring your own UI
|
|
30
30
|
|
|
31
31
|
```ts
|
|
32
32
|
import { PresentationState, playGroup, playTransition } from '@web-ppt/viewer-core';
|
|
@@ -43,11 +43,10 @@ st.subscribe((change) => {
|
|
|
43
43
|
});
|
|
44
44
|
|
|
45
45
|
st.next();
|
|
46
|
-
st.hiddenElementIds; //
|
|
47
|
-
st.resolveLink(href); // 'slide:3' → 2
|
|
46
|
+
st.hiddenElementIds; // element ids that should be hidden at the current batch
|
|
47
|
+
st.resolveLink(href); // 'slide:3' → 2, external links → null
|
|
48
48
|
```
|
|
49
49
|
|
|
50
|
-
|
|
51
|
-
所以换框架时不需要重写任何逻辑。
|
|
50
|
+
The state machine only decides *what should be visible*; the UI layer performs the actual playback through `playGroup` / `playTransition` — so switching frameworks rewrites no logic.
|
|
52
51
|
|
|
53
52
|
MIT
|
package/README.zh-CN.md
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
# @web-ppt/viewer-core
|
|
2
|
+
|
|
3
|
+
[English](README.md) · **简体中文**
|
|
4
|
+
|
|
5
|
+
[Web-PPT](https://github.com/unStone/web-ppt) 查看器的 headless 层。
|
|
6
|
+
|
|
7
|
+
`PresentationState` 是零 DOM 的纯状态机——导航 / 缩放 / 搜索 / 动画批次 / 自动换片,
|
|
8
|
+
可被原生 DOM、React、Vue、Svelte 任意 UI 驱动,也能在 Node 里直接跑测试。
|
|
9
|
+
`Viewer` 是它之上最薄的一层 DOM 绑定(塞 SVG、设可见性、调播放,约 24 行)。
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
npm i @web-ppt/core @web-ppt/viewer-core
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
## 开箱即用
|
|
16
|
+
|
|
17
|
+
```ts
|
|
18
|
+
import { parse } from '@web-ppt/core';
|
|
19
|
+
import { Viewer } from '@web-ppt/viewer-core';
|
|
20
|
+
|
|
21
|
+
const pres = await parse(file);
|
|
22
|
+
const v = new Viewer(container, pres, { animate: true, autoAdvance: true });
|
|
23
|
+
|
|
24
|
+
v.next(); // 有待播动画时先播动画,否则翻页
|
|
25
|
+
v.finishAnimations(); // 跳到本页动画终态
|
|
26
|
+
v.setZoom(1.5);
|
|
27
|
+
v.search('关键词'); // → 命中的页索引数组
|
|
28
|
+
await v.exportPng(2); // → Blob
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## 接自己的 UI
|
|
32
|
+
|
|
33
|
+
```ts
|
|
34
|
+
import { PresentationState, playGroup, playTransition } from '@web-ppt/viewer-core';
|
|
35
|
+
|
|
36
|
+
const st = new PresentationState(pres, { skipHidden: true, animate: true });
|
|
37
|
+
|
|
38
|
+
st.subscribe((change) => {
|
|
39
|
+
if (change.type === 'slide') {
|
|
40
|
+
render(change.index);
|
|
41
|
+
if (change.transition) playTransition(prevEl, nextEl, change.transition);
|
|
42
|
+
} else if (change.type === 'animation' && change.group) {
|
|
43
|
+
playGroup(container, change.group);
|
|
44
|
+
}
|
|
45
|
+
});
|
|
46
|
+
|
|
47
|
+
st.next();
|
|
48
|
+
st.hiddenElementIds; // 当前批次下应隐藏的元素 id
|
|
49
|
+
st.resolveLink(href); // 'slide:3' → 2,外链 → null
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
状态机只决定「该显示什么」,实际播放由 UI 层调 `playGroup` / `playTransition` 完成——
|
|
53
|
+
所以换框架时不需要重写任何逻辑。
|
|
54
|
+
|
|
55
|
+
MIT
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@web-ppt/viewer-core",
|
|
3
|
-
"version": "0.4.
|
|
4
|
-
"description": "Web-PPT
|
|
3
|
+
"version": "0.4.4",
|
|
4
|
+
"description": "Headless presentation state machine for Web-PPT: navigation, zoom, search and click-batched animation playback, drivable from any UI framework.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"pptx",
|
|
7
7
|
"ppt",
|