@netless/forge-slide 0.1.1-alpha.7 → 0.1.1-alpha.8
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/dist/SiderBarView.d.ts +4 -0
- package/dist/SiderBarView.d.ts.map +1 -1
- package/dist/Slide.d.ts +1 -0
- package/dist/Slide.d.ts.map +1 -1
- package/dist/SlideApplication.d.ts +3 -0
- package/dist/SlideApplication.d.ts.map +1 -1
- package/dist/index.esm.js +175 -105
- package/dist/index.esm.js.map +2 -2
- package/dist/index.js +175 -105
- package/dist/index.js.map +2 -2
- package/package.json +1 -1
- package/src/SiderBarView.ts +24 -3
- package/src/Slide.ts +1 -0
- package/src/SlideApplication.ts +141 -106
package/dist/index.js
CHANGED
|
@@ -66596,6 +66596,7 @@ var SlideForge = class extends import_eventemitter314.default {
|
|
|
66596
66596
|
permissions;
|
|
66597
66597
|
footView;
|
|
66598
66598
|
sideBarView;
|
|
66599
|
+
whiteboardView;
|
|
66599
66600
|
/**
|
|
66600
66601
|
* 当前页面索引, 从 0 开始
|
|
66601
66602
|
*/
|
|
@@ -66879,6 +66880,7 @@ var FooterView = class extends import_eventemitter316.default {
|
|
|
66879
66880
|
var import_eventemitter317 = __toESM(require("eventemitter3"));
|
|
66880
66881
|
var SideBarView = class extends import_eventemitter317.default {
|
|
66881
66882
|
root = document.createElement("div");
|
|
66883
|
+
isShow = false;
|
|
66882
66884
|
itemList = [];
|
|
66883
66885
|
constructor() {
|
|
66884
66886
|
super();
|
|
@@ -66892,13 +66894,14 @@ var SideBarView = class extends import_eventemitter317.default {
|
|
|
66892
66894
|
this.root.style.zIndex = "5";
|
|
66893
66895
|
this.root.style.transition = "left 0.3s ease-in-out";
|
|
66894
66896
|
this.root.style.overflow = "auto";
|
|
66895
|
-
this.root.style.border = "1px solid #ccc";
|
|
66896
|
-
this.root.style.boxShadow = "0 0 10px rgba(0, 0, 0, 0.1)";
|
|
66897
66897
|
this.root.style.display = "flex";
|
|
66898
66898
|
this.root.style.flexDirection = "column";
|
|
66899
66899
|
this.root.style.justifyContent = "flex-start";
|
|
66900
66900
|
this.root.style.alignItems = "center";
|
|
66901
66901
|
}
|
|
66902
|
+
get isShowSideBar() {
|
|
66903
|
+
return this.isShow;
|
|
66904
|
+
}
|
|
66902
66905
|
onMouseOver = (itemContainer) => {
|
|
66903
66906
|
itemContainer.style.borderColor = "#ccc";
|
|
66904
66907
|
};
|
|
@@ -66916,7 +66919,6 @@ var SideBarView = class extends import_eventemitter317.default {
|
|
|
66916
66919
|
itemContainer.style.display = "flex";
|
|
66917
66920
|
itemContainer.style.justifyContent = "center";
|
|
66918
66921
|
itemContainer.style.alignItems = "flex-start";
|
|
66919
|
-
itemContainer.style.border = "7px solid transparent";
|
|
66920
66922
|
itemContainer.style.position = "relative";
|
|
66921
66923
|
itemContainer.style.borderRadius = "4px";
|
|
66922
66924
|
itemContainer.style.transition = "border-color .3s";
|
|
@@ -66941,6 +66943,24 @@ var SideBarView = class extends import_eventemitter317.default {
|
|
|
66941
66943
|
this.root.appendChild(itemContainer);
|
|
66942
66944
|
}
|
|
66943
66945
|
}
|
|
66946
|
+
hidden() {
|
|
66947
|
+
if (!this.root) {
|
|
66948
|
+
return;
|
|
66949
|
+
}
|
|
66950
|
+
this.root.style.left = "-240px";
|
|
66951
|
+
this.root.style.border = "none";
|
|
66952
|
+
this.root.style.boxShadow = "none";
|
|
66953
|
+
this.isShow = false;
|
|
66954
|
+
}
|
|
66955
|
+
show() {
|
|
66956
|
+
if (!this.root) {
|
|
66957
|
+
return;
|
|
66958
|
+
}
|
|
66959
|
+
this.root.style.left = "0";
|
|
66960
|
+
this.root.style.border = "1px solid #ccc";
|
|
66961
|
+
this.root.style.boxShadow = "0 0 10px rgba(0, 0, 0, 0.1)";
|
|
66962
|
+
this.isShow = true;
|
|
66963
|
+
}
|
|
66944
66964
|
dispose() {
|
|
66945
66965
|
this.itemList.forEach((item) => {
|
|
66946
66966
|
item.removeEventListener("mouseover", () => this.onMouseOver(item));
|
|
@@ -67073,108 +67093,116 @@ var SlideApplication = class extends import_forge_room4.AbstractApplication {
|
|
|
67073
67093
|
if (!this.permissions.hasPermission(2 /* changePage */)) {
|
|
67074
67094
|
return;
|
|
67075
67095
|
}
|
|
67076
|
-
if (this.sideBar.
|
|
67077
|
-
this.sideBar.
|
|
67096
|
+
if (this.sideBar.isShowSideBar) {
|
|
67097
|
+
this.sideBar.hidden();
|
|
67078
67098
|
} else {
|
|
67079
|
-
this.sideBar.
|
|
67099
|
+
this.sideBar.show();
|
|
67080
67100
|
}
|
|
67081
67101
|
});
|
|
67082
67102
|
this.rootView.appendChild(this.contentContainer);
|
|
67083
67103
|
this.emitter.on("renderStart", (pageIndex) => {
|
|
67084
67104
|
this.footer.prevPageState(pageIndex !== 0);
|
|
67085
67105
|
});
|
|
67086
|
-
const
|
|
67087
|
-
|
|
67088
|
-
get() {
|
|
67089
|
-
return that.rootView;
|
|
67090
|
-
}
|
|
67091
|
-
});
|
|
67092
|
-
Object.defineProperty(this.emitter, "permissions", {
|
|
67093
|
-
get() {
|
|
67094
|
-
return that.permissions;
|
|
67095
|
-
}
|
|
67096
|
-
});
|
|
67097
|
-
Object.defineProperty(this.emitter, "footView", {
|
|
67098
|
-
get() {
|
|
67099
|
-
return that.footer.root;
|
|
67100
|
-
}
|
|
67101
|
-
});
|
|
67102
|
-
Object.defineProperty(this.emitter, "sidebarView", {
|
|
67103
|
-
get() {
|
|
67104
|
-
return that.sideBar.root;
|
|
67105
|
-
}
|
|
67106
|
-
});
|
|
67107
|
-
Object.defineProperty(this.emitter, "pageIndex", {
|
|
67108
|
-
get() {
|
|
67109
|
-
return that.currentSlideIndex;
|
|
67110
|
-
}
|
|
67111
|
-
});
|
|
67112
|
-
Object.defineProperty(this.emitter, "pageCount", {
|
|
67113
|
-
get() {
|
|
67114
|
-
return that.slideCount;
|
|
67115
|
-
}
|
|
67116
|
-
});
|
|
67117
|
-
Object.defineProperty(this.emitter, "goto", {
|
|
67118
|
-
writable: false,
|
|
67119
|
-
enumerable: false,
|
|
67120
|
-
value: (pageIndex) => {
|
|
67121
|
-
this.sideBar.emit("pageChange", pageIndex);
|
|
67122
|
-
}
|
|
67123
|
-
});
|
|
67124
|
-
Object.defineProperty(this.emitter, "nextStep", {
|
|
67125
|
-
writable: false,
|
|
67126
|
-
enumerable: false,
|
|
67127
|
-
value: () => {
|
|
67128
|
-
this.footer.emit("nextStep");
|
|
67129
|
-
}
|
|
67130
|
-
});
|
|
67131
|
-
Object.defineProperty(this.emitter, "prevStep", {
|
|
67132
|
-
writable: false,
|
|
67133
|
-
enumerable: false,
|
|
67134
|
-
value: () => {
|
|
67135
|
-
this.footer.emit("prevStep");
|
|
67136
|
-
}
|
|
67137
|
-
});
|
|
67138
|
-
Object.defineProperty(this.emitter, "nextPage", {
|
|
67139
|
-
writable: false,
|
|
67140
|
-
enumerable: false,
|
|
67141
|
-
value: () => {
|
|
67142
|
-
this.footer.emit("nextPage");
|
|
67143
|
-
}
|
|
67144
|
-
});
|
|
67145
|
-
Object.defineProperty(this.emitter, "prevPage", {
|
|
67146
|
-
writable: false,
|
|
67147
|
-
enumerable: false,
|
|
67148
|
-
value: () => {
|
|
67149
|
-
this.footer.emit("prevPage");
|
|
67150
|
-
}
|
|
67151
|
-
});
|
|
67152
|
-
Object.defineProperty(this.emitter, "sideBarToggle", {
|
|
67153
|
-
writable: false,
|
|
67154
|
-
enumerable: false,
|
|
67155
|
-
value: () => {
|
|
67156
|
-
this.footer.emit("sideBarToggle");
|
|
67157
|
-
}
|
|
67158
|
-
});
|
|
67159
|
-
Object.defineProperty(this.emitter, "imgContent", {
|
|
67160
|
-
writable: false,
|
|
67161
|
-
enumerable: false,
|
|
67162
|
-
value: (pageIndex) => {
|
|
67163
|
-
return this.getImageContent(pageIndex);
|
|
67164
|
-
}
|
|
67165
|
-
});
|
|
67166
|
-
Object.defineProperty(this.emitter, "imgUrl", {
|
|
67167
|
-
writable: false,
|
|
67168
|
-
enumerable: false,
|
|
67169
|
-
value: (pageIndex) => {
|
|
67170
|
-
return this.getImageUrl(pageIndex);
|
|
67171
|
-
}
|
|
67172
|
-
});
|
|
67173
|
-
Object.defineProperty(this.emitter, "imgSize", {
|
|
67174
|
-
writable: false,
|
|
67106
|
+
const propertyConfig = {
|
|
67107
|
+
configurable: false,
|
|
67175
67108
|
enumerable: false,
|
|
67176
|
-
|
|
67177
|
-
|
|
67109
|
+
writable: false
|
|
67110
|
+
};
|
|
67111
|
+
const that = this;
|
|
67112
|
+
Object.defineProperties(this.emitter, {
|
|
67113
|
+
view: {
|
|
67114
|
+
get() {
|
|
67115
|
+
return that.rootView;
|
|
67116
|
+
}
|
|
67117
|
+
},
|
|
67118
|
+
permissions: {
|
|
67119
|
+
get() {
|
|
67120
|
+
return that.permissions;
|
|
67121
|
+
}
|
|
67122
|
+
},
|
|
67123
|
+
footView: {
|
|
67124
|
+
get() {
|
|
67125
|
+
return that.footer.root;
|
|
67126
|
+
}
|
|
67127
|
+
},
|
|
67128
|
+
sidebarView: {
|
|
67129
|
+
get() {
|
|
67130
|
+
return that.sideBar.root;
|
|
67131
|
+
}
|
|
67132
|
+
},
|
|
67133
|
+
whiteboardView: {
|
|
67134
|
+
get() {
|
|
67135
|
+
return that.whiteboard.view;
|
|
67136
|
+
}
|
|
67137
|
+
},
|
|
67138
|
+
slideView: {
|
|
67139
|
+
get() {
|
|
67140
|
+
return that.slideContainer;
|
|
67141
|
+
}
|
|
67142
|
+
},
|
|
67143
|
+
pageIndex: {
|
|
67144
|
+
get() {
|
|
67145
|
+
return that.currentSlideIndex;
|
|
67146
|
+
}
|
|
67147
|
+
},
|
|
67148
|
+
pageCount: {
|
|
67149
|
+
get() {
|
|
67150
|
+
return that.slideCount;
|
|
67151
|
+
}
|
|
67152
|
+
},
|
|
67153
|
+
goto: {
|
|
67154
|
+
...propertyConfig,
|
|
67155
|
+
value: (pageIndex) => {
|
|
67156
|
+
this.sideBar.emit("pageChange", pageIndex);
|
|
67157
|
+
}
|
|
67158
|
+
},
|
|
67159
|
+
nextStep: {
|
|
67160
|
+
...propertyConfig,
|
|
67161
|
+
value: () => {
|
|
67162
|
+
this.footer.emit("nextStep");
|
|
67163
|
+
}
|
|
67164
|
+
},
|
|
67165
|
+
prevStep: {
|
|
67166
|
+
...propertyConfig,
|
|
67167
|
+
value: () => {
|
|
67168
|
+
this.footer.emit("prevStep");
|
|
67169
|
+
}
|
|
67170
|
+
},
|
|
67171
|
+
nextPage: {
|
|
67172
|
+
...propertyConfig,
|
|
67173
|
+
value: () => {
|
|
67174
|
+
this.footer.emit("nextPage");
|
|
67175
|
+
}
|
|
67176
|
+
},
|
|
67177
|
+
prevPage: {
|
|
67178
|
+
...propertyConfig,
|
|
67179
|
+
value: () => {
|
|
67180
|
+
this.footer.emit("prevPage");
|
|
67181
|
+
}
|
|
67182
|
+
},
|
|
67183
|
+
sideBarToggle: {
|
|
67184
|
+
...propertyConfig,
|
|
67185
|
+
value: () => {
|
|
67186
|
+
this.footer.emit("sideBarToggle");
|
|
67187
|
+
}
|
|
67188
|
+
},
|
|
67189
|
+
imgContent: {
|
|
67190
|
+
...propertyConfig,
|
|
67191
|
+
value: (pageIndex) => {
|
|
67192
|
+
return this.getImageContent(pageIndex);
|
|
67193
|
+
}
|
|
67194
|
+
},
|
|
67195
|
+
imgUrl: {
|
|
67196
|
+
...propertyConfig,
|
|
67197
|
+
value: (pageIndex) => {
|
|
67198
|
+
return this.getImageUrl(pageIndex);
|
|
67199
|
+
}
|
|
67200
|
+
},
|
|
67201
|
+
imgSize: {
|
|
67202
|
+
...propertyConfig,
|
|
67203
|
+
value: (pageIndex) => {
|
|
67204
|
+
return this.getImageSize(pageIndex);
|
|
67205
|
+
}
|
|
67178
67206
|
}
|
|
67179
67207
|
});
|
|
67180
67208
|
}
|
|
@@ -67264,6 +67292,23 @@ var SlideApplication = class extends import_forge_room4.AbstractApplication {
|
|
|
67264
67292
|
}
|
|
67265
67293
|
}
|
|
67266
67294
|
};
|
|
67295
|
+
keyBoardEvents = (event) => {
|
|
67296
|
+
if (event.key === "ArrowLeft") {
|
|
67297
|
+
this.footer.emit("prevStep");
|
|
67298
|
+
} else if (event.key === "ArrowRight") {
|
|
67299
|
+
this.footer.emit("nextStep");
|
|
67300
|
+
} else if (event.key === "ArrowUp") {
|
|
67301
|
+
this.footer.emit("prevPage");
|
|
67302
|
+
} else if (event.key === "ArrowDown") {
|
|
67303
|
+
this.footer.emit("nextPage");
|
|
67304
|
+
}
|
|
67305
|
+
};
|
|
67306
|
+
bindKeyBoardEvent() {
|
|
67307
|
+
document.addEventListener("keydown", this.keyBoardEvents);
|
|
67308
|
+
}
|
|
67309
|
+
unbindKeyBoarEvent() {
|
|
67310
|
+
document.removeEventListener("keydown", this.keyBoardEvents);
|
|
67311
|
+
}
|
|
67267
67312
|
async initialize(option) {
|
|
67268
67313
|
this.prefix = option.prefix;
|
|
67269
67314
|
this.taskId = option.taskId;
|
|
@@ -67319,30 +67364,34 @@ var SlideApplication = class extends import_forge_room4.AbstractApplication {
|
|
|
67319
67364
|
});
|
|
67320
67365
|
this.slide.setResource(option.taskId, option.prefix);
|
|
67321
67366
|
this.sideBar.initialize(json.slideCount, option);
|
|
67322
|
-
this.slide.on(
|
|
67367
|
+
this.slide.on(import_slide.SLIDE_EVENTS.syncDispatch, (event) => {
|
|
67323
67368
|
this.getMap(this.name).set("syncSlide", {
|
|
67324
67369
|
slideState: this.slide.slideState,
|
|
67325
67370
|
dispatch: event
|
|
67326
67371
|
});
|
|
67327
67372
|
});
|
|
67328
|
-
this.slide.on(
|
|
67373
|
+
this.slide.on(import_slide.SLIDE_EVENTS.mainSeqStepStart, (animateIndex) => {
|
|
67329
67374
|
this.emitter.emit("mainSeqStepStart", animateIndex);
|
|
67330
67375
|
});
|
|
67331
|
-
this.slide.on(
|
|
67376
|
+
this.slide.on(import_slide.SLIDE_EVENTS.mainSeqStepEnd, (animateIndex) => {
|
|
67332
67377
|
this.emitter.emit("mainSeqStepEnd", animateIndex);
|
|
67333
67378
|
});
|
|
67334
|
-
this.slide.on(
|
|
67379
|
+
this.slide.on(import_slide.SLIDE_EVENTS.animateStart, () => {
|
|
67380
|
+
this.sideBar.hidden();
|
|
67381
|
+
});
|
|
67382
|
+
this.slide.on(import_slide.SLIDE_EVENTS.renderStart, (slideIndex) => {
|
|
67335
67383
|
this.whiteboardApp.emitter.view.style.opacity = "0";
|
|
67336
67384
|
this.whiteboardApp.emitter.addPage(`${slideIndex}`);
|
|
67337
67385
|
this.whiteboardApp.emitter.gotoPage(`${slideIndex}`);
|
|
67338
67386
|
this.emitter.emit("renderStart", slideIndex);
|
|
67387
|
+
this.sideBar.hidden();
|
|
67339
67388
|
});
|
|
67340
|
-
this.slide.on(
|
|
67389
|
+
this.slide.on(import_slide.SLIDE_EVENTS.renderEnd, (slideIndex) => {
|
|
67341
67390
|
this.currentSlideIndex = slideIndex;
|
|
67342
67391
|
this.whiteboardApp.emitter.view.style.opacity = "1";
|
|
67343
67392
|
this.emitter.emit("renderEnd", slideIndex);
|
|
67344
67393
|
});
|
|
67345
|
-
this.slide.on(
|
|
67394
|
+
this.slide.on(import_slide.SLIDE_EVENTS.stateChange, (state) => {
|
|
67346
67395
|
this.getMap(this.name).set("slideState", state);
|
|
67347
67396
|
});
|
|
67348
67397
|
this.getMap(this.name).observe(this.onSlideEventHandler);
|
|
@@ -67368,8 +67417,30 @@ var SlideApplication = class extends import_forge_room4.AbstractApplication {
|
|
|
67368
67417
|
}
|
|
67369
67418
|
}
|
|
67370
67419
|
});
|
|
67371
|
-
this.permissions.addPermission(7 /* all */);
|
|
67372
67420
|
this.whiteboardApp.disableViewModel();
|
|
67421
|
+
if (this.window) {
|
|
67422
|
+
let prevStatus = "normal";
|
|
67423
|
+
this.window.on("statusChange", (status) => {
|
|
67424
|
+
if (prevStatus === "minimized") {
|
|
67425
|
+
this.bindKeyBoardEvent();
|
|
67426
|
+
prevStatus = status;
|
|
67427
|
+
return;
|
|
67428
|
+
}
|
|
67429
|
+
prevStatus = status;
|
|
67430
|
+
if (status === "normal") {
|
|
67431
|
+
this.bindKeyBoardEvent();
|
|
67432
|
+
} else if (status === "minimized") {
|
|
67433
|
+
this.unbindKeyBoarEvent();
|
|
67434
|
+
}
|
|
67435
|
+
});
|
|
67436
|
+
this.window.on("focusedChange", (status) => {
|
|
67437
|
+
if (status) {
|
|
67438
|
+
this.bindKeyBoardEvent();
|
|
67439
|
+
} else {
|
|
67440
|
+
this.unbindKeyBoarEvent();
|
|
67441
|
+
}
|
|
67442
|
+
});
|
|
67443
|
+
}
|
|
67373
67444
|
window.__forge_slide = this;
|
|
67374
67445
|
window.slidePermissions = this.permissions;
|
|
67375
67446
|
return Promise.resolve(void 0);
|
|
@@ -67383,7 +67454,6 @@ var SlideApplication = class extends import_forge_room4.AbstractApplication {
|
|
|
67383
67454
|
this.slide.destroy();
|
|
67384
67455
|
this.sideBar.dispose();
|
|
67385
67456
|
this.getMap(this.name).unobserve(this.onSlideEventHandler);
|
|
67386
|
-
return Promise.resolve(void 0);
|
|
67387
67457
|
}
|
|
67388
67458
|
};
|
|
67389
67459
|
/*! Bundled license information:
|