ginipick commited on
Commit
8b7579c
·
verified ·
1 Parent(s): e3217f5

Upload 6 files

Browse files
Files changed (6) hide show
  1. flipbook.book3.js +1230 -0
  2. flipbook.css +2515 -0
  3. flipbook.js +0 -0
  4. flipbook.scroll.js +539 -0
  5. flipbook.swipe.js +1294 -0
  6. flipbook.webgl.js +0 -0
flipbook.book3.js ADDED
@@ -0,0 +1,1230 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /*
2
+ * Real3D FlipBook [https://real3dflipbook.com]
3
+ * @author creativeinteractivemedia [https://codecanyon.net/user/creativeinteractivemedia/portfolio]
4
+ * @version 4.10
5
+ * @date 2025-05-15
6
+ */
7
+ 'use strict';
8
+ var FLIPBOOK = FLIPBOOK || {};
9
+
10
+ FLIPBOOK.Book3 = function (el, main, options) {
11
+ this.options = options;
12
+ this.main = main;
13
+
14
+ this.singlePage = options.singlePageMode;
15
+ this.pageWidth = options.pageWidth;
16
+ this.pageHeight = options.pageHeight;
17
+
18
+ // Set up the wrapper and parent container
19
+ this.wrapper = el;
20
+ this.wrapper.classList.add('flipbook-book3');
21
+ this.bookLayer = this.wrapper.parentNode;
22
+
23
+ this.flipEasing = 'easeOutQuad';
24
+ this.translateZ = '';
25
+
26
+ // Initialize IScroll with options
27
+ this.iscroll = new FLIPBOOK.IScroll(this.bookLayer, {
28
+ zoom: true,
29
+ scrollX: true,
30
+ scrollY: true,
31
+ scrollbars: true,
32
+ keepInCenterV: true,
33
+ keepInCenterH: true,
34
+ freeScroll: true,
35
+ preventDefault: false,
36
+ });
37
+
38
+ // Event listeners for enabling/disabling IScroll
39
+ main.on('disableIScroll', this.disableIscroll.bind(this));
40
+ main.on('enableIScroll', this.enableIscroll.bind(this));
41
+
42
+ // Handle zoom end event
43
+ this.iscroll.on('zoomEnd', () => {
44
+ if (isNaN(this.iscroll.scale)) {
45
+ return this.zoomTo(options.zoomMin);
46
+ }
47
+
48
+ options.main.onZoom(this.iscroll.scale / this.ratio);
49
+ this.updateVisiblePages();
50
+
51
+ const zoomed = options.main.zoom > 1;
52
+
53
+ if (this.zoomed !== zoomed) {
54
+ const scrollOptions = this.iscroll.options;
55
+ scrollOptions.eventPassthrough = zoomed ? '' : 'vertical';
56
+ scrollOptions.freeScroll = zoomed;
57
+ this.iscroll.refresh();
58
+ this.zoomed = zoomed;
59
+ }
60
+ });
61
+
62
+ // Set wrapper and center container dimensions
63
+ this.wrapper.style.width = `${2 * this.pageWidth}px`;
64
+ this.wrapper.style.height = `${this.pageHeight}px`;
65
+
66
+ this.centerContainer = document.createElement('div');
67
+ this.centerContainer.className = 'flipbook-center-container3';
68
+ this.centerContainer.style.width = `${2 * this.pageWidth}px`;
69
+ this.centerContainer.style.height = `${this.pageHeight}px`;
70
+ this.wrapper.appendChild(this.centerContainer);
71
+
72
+ // Set perspective based on options or view mode
73
+ const perspective = this.options.perspective || (this.options.viewMode === '3d' ? 3 * this.pageHeight : 200000);
74
+ this.centerContainer.style.perspective = `${perspective}px`;
75
+
76
+ // Initialize pages
77
+ this.pagesArr = [];
78
+ this.animating = false;
79
+
80
+ let numSheets = this.options.pages.length;
81
+ if (!this.options.cover) numSheets += 1;
82
+
83
+ for (let i = 0; i < numSheets; i++) {
84
+ const page = new FLIPBOOK.Page3(this, i);
85
+ this.pagesArr.push(page);
86
+ this.centerContainer.appendChild(page.wrapper);
87
+ }
88
+ };
89
+
90
+ FLIPBOOK.Book3.prototype = Object.create(FLIPBOOK.Book.prototype);
91
+
92
+ FLIPBOOK.Book3.prototype.constructor = FLIPBOOK.Book3;
93
+
94
+ FLIPBOOK.Book3.prototype.enableIscroll = function () {
95
+ if (this.iscrollDisabled) {
96
+ this.iscroll.enable();
97
+ this.iscrollDisabled = false;
98
+ }
99
+ };
100
+
101
+ FLIPBOOK.Book3.prototype.disableIscroll = function () {
102
+ if (!this.iscrollDisabled) {
103
+ this.iscroll.disable();
104
+ this.iscroll.initiated = false;
105
+ this.iscrollDisabled = true;
106
+ }
107
+ };
108
+
109
+ FLIPBOOK.Book3.prototype.enableMouseWheelZoom = function () {
110
+ this.iscroll.options.eventPassthrough = 'vertical';
111
+ this.iscroll.refresh();
112
+ };
113
+
114
+ FLIPBOOK.Book3.prototype.disableMouseWheelZoom = function () {
115
+ this.iscroll.options.eventPassthrough = '';
116
+ this.iscroll.refresh();
117
+ };
118
+
119
+ FLIPBOOK.Book3.prototype.enablePrev = function (val) {
120
+ this.prevEnabled = val;
121
+ };
122
+
123
+ FLIPBOOK.Book3.prototype.enablePan = function () {
124
+ this.iscroll.enable();
125
+ };
126
+
127
+ FLIPBOOK.Book3.prototype.disablePan = function () {
128
+ this.iscroll.disable();
129
+ };
130
+
131
+ FLIPBOOK.Book3.prototype.setRightIndex = function (val) {
132
+ this.rightIndex = val;
133
+ };
134
+
135
+ FLIPBOOK.Book3.prototype.enableNext = function (val) {
136
+ this.nextEnabled = val;
137
+ };
138
+
139
+ FLIPBOOK.Book3.prototype.isZoomed = function () {
140
+ return this.options.main.zoom > this.options.zoomMin && this.options.main.zoom > 1;
141
+ };
142
+
143
+ FLIPBOOK.Book3.prototype.getNumPages = function () {};
144
+
145
+ FLIPBOOK.Book3.prototype.move = function (direction) {
146
+ if (this.zoom <= 1) {
147
+ return;
148
+ }
149
+
150
+ var iscroll = this.iscroll;
151
+ var offset2 = 0;
152
+
153
+ if (iscroll) {
154
+ var posX = iscroll.x;
155
+ var posY = iscroll.y;
156
+ var offset = 20 * this.zoom;
157
+ switch (direction) {
158
+ case 'left':
159
+ posX += offset;
160
+ break;
161
+ case 'right':
162
+ posX -= offset;
163
+ break;
164
+ case 'up':
165
+ posY += offset;
166
+ break;
167
+ case 'down':
168
+ posY -= offset;
169
+ break;
170
+ }
171
+
172
+ if (posX > 0) {
173
+ posX = offset2;
174
+ }
175
+ if (posX < iscroll.maxScrollX) {
176
+ posX = iscroll.maxScrollX - offset2;
177
+ }
178
+ if (posY > 0) {
179
+ posY = offset2;
180
+ }
181
+ if (posY < iscroll.maxScrollY) {
182
+ posY = iscroll.maxScrollY - offset2;
183
+ }
184
+
185
+ iscroll.scrollTo(posX, posY, 0);
186
+ }
187
+ };
188
+
189
+ FLIPBOOK.Book3.prototype.zoomTo = function (zoom, time, x, y) {
190
+ if (!this.enabled) {
191
+ return;
192
+ }
193
+
194
+ x = x || 0;
195
+ y = y || 0;
196
+ time = time || 0;
197
+ this.zoom = zoom;
198
+
199
+ time = 0;
200
+
201
+ var iscroll = this.iscroll;
202
+ if (iscroll) {
203
+ iscroll.zoom(zoom * this.ratio, x, y, time);
204
+ }
205
+ };
206
+
207
+ FLIPBOOK.Book3.prototype.setWrapperW = function (w) {
208
+ if (this.wrapperW != w) {
209
+ this.wrapper.style.width = w + 'px';
210
+ this.wrapperW = w;
211
+ }
212
+ };
213
+
214
+ FLIPBOOK.Book3.prototype.updateBookPosition = function () {
215
+ if (this.singlePage) {
216
+ this.setWrapperW(this.pageWidth);
217
+ if (this.iscroll) {
218
+ this.iscroll.refresh();
219
+ }
220
+ this.view = 1;
221
+ this.focusRight();
222
+ return;
223
+ }
224
+
225
+ if (this.view == 1) {
226
+ this.setWrapperW(this.pageWidth);
227
+ } else {
228
+ this.setWrapperW(2 * this.pageWidth);
229
+ }
230
+ if (this.iscroll) {
231
+ this.iscroll.refresh();
232
+ }
233
+
234
+ if (this.view == 2) {
235
+ if (this.isCover()) {
236
+ this.focusRight();
237
+ } else if (this.isBackCover()) {
238
+ if (!this.options.cover) {
239
+ this.focusBoth();
240
+ } else {
241
+ this.focusLeft();
242
+ }
243
+ } else {
244
+ this.focusBoth();
245
+ }
246
+ } else if (this.view == 1) {
247
+ if (this.isCover()) {
248
+ this.focusRight();
249
+ } else if (this.isBackCover()) {
250
+ this.focusLeft();
251
+ }
252
+ }
253
+ };
254
+
255
+ FLIPBOOK.Book3.prototype.focusLeft = function (time, delay) {
256
+ var pos = this.view == 1 || this.singlePage ? 0 : this.pageWidth / 2;
257
+
258
+ this.setBookPosition(pos, time, delay);
259
+ };
260
+
261
+ FLIPBOOK.Book3.prototype.focusRight = function (time, delay, updatePageNumber) {
262
+ var pos = this.view == 1 || this.singlePage ? -this.pageWidth : -this.pageWidth / 2;
263
+
264
+ this.setBookPosition(pos, time, delay, updatePageNumber);
265
+ };
266
+
267
+ FLIPBOOK.Book3.prototype.focusBoth = function (time, delay) {
268
+ var pos = this.view == 1 ? -this.pageWidth / 2 : 0;
269
+
270
+ this.setBookPosition(pos, time, delay);
271
+ };
272
+
273
+ FLIPBOOK.Book3.prototype.setBookPosition = function (pos, time, delay, updatePageNumber) {
274
+ if (this.centerContainerPosition == pos) {
275
+ return;
276
+ }
277
+ var start = this.centerContainerPosition;
278
+
279
+ if (time) {
280
+ var self = this;
281
+ delay = delay || 0;
282
+
283
+ const animationParams = {
284
+ from: start,
285
+ to: pos,
286
+ delay,
287
+ duration: time,
288
+ step(now) {
289
+ self.centerContainer.style.transform = 'translateX(' + now + 'px) ' + self.translateZ;
290
+ },
291
+ complete() {
292
+ self.centerContainerPosition = pos;
293
+ if (updatePageNumber) {
294
+ self.updateFlipped();
295
+ self.options.main.turnPageComplete();
296
+ }
297
+ },
298
+ };
299
+
300
+ this.animate(animationParams);
301
+ } else if (this.centerContainerPosition != pos) {
302
+ this.centerContainerPosition = pos;
303
+ this.centerContainer.style.transform = 'translateX(' + pos + 'px) ' + this.translateZ;
304
+
305
+ this.updateFlipped();
306
+ this.options.main.turnPageComplete();
307
+ }
308
+ };
309
+
310
+ FLIPBOOK.Book3.prototype.updateSinglePage = function (singlePage) {
311
+ this.singlePage = singlePage;
312
+ let ri = this.rightIndex;
313
+ if (ri > 0) {
314
+ if (this.singlePage) {
315
+ ri--;
316
+ } else if (ri % 2 == 1) {
317
+ ri++;
318
+ }
319
+ this.setRightIndex(ri);
320
+ }
321
+ this.resetLoadedPages();
322
+ this.onResize();
323
+ this.updateVisiblePages();
324
+ };
325
+
326
+ FLIPBOOK.Book3.prototype.resetLoadedPages = function () {
327
+ this.pagesArr.forEach(function (page) {
328
+ if (page.bgFront) page.bgFront.replaceChildren();
329
+ if (page.bgBack) page.bgBack.replaceChildren();
330
+ page.sizeFront = 0;
331
+ page.sizeBack = 0;
332
+
333
+ if (page.html.front) page.html.front.replaceChildren();
334
+ if (page.html.back) page.html.back.replaceChildren();
335
+ if (page.htmlContent) {
336
+ page.htmlContent.front = null;
337
+ page.htmlContent.back = null;
338
+ }
339
+ if (page.htmlLoaded) {
340
+ page.htmlLoaded.front = null;
341
+ page.htmlLoaded.back = null;
342
+ }
343
+ });
344
+ };
345
+
346
+ FLIPBOOK.Book3.prototype.updateVisiblePages = function (loadNextPrev) {
347
+ if (typeof loadNextPrev == 'undefined') {
348
+ loadNextPrev = true;
349
+ }
350
+ var self = this;
351
+
352
+ var index = this.rightIndex;
353
+ if (!this.singlePage) {
354
+ index /= 2;
355
+ }
356
+
357
+ // if (!this.options.backCover && this.options.rightToLeft) {
358
+ // index--;
359
+ // }
360
+
361
+ let numPages = this.options.pages.length;
362
+ let numSheets = this.singlePage ? numPages : numPages / 2;
363
+ if (!this.options.cover) numSheets++;
364
+ this.visibleSheets = [];
365
+ for (let i = 0; i < numSheets; i++) {
366
+ this.visibleSheets.push(this.pagesArr[i]);
367
+ }
368
+
369
+ var right = this.visibleSheets[index];
370
+ var next = this.visibleSheets[index + 1];
371
+ var left = this.visibleSheets[index - 1];
372
+ var prev = this.visibleSheets[index - 2];
373
+
374
+ if (left) {
375
+ left._setAngle(180);
376
+ }
377
+ if (right) {
378
+ right._setAngle(0);
379
+ }
380
+
381
+ for (var i = 0; i < this.pagesArr.length; i++) {
382
+ if (this.pagesArr[i] == right) {
383
+ this.pagesArr[i].show();
384
+ this.pagesArr[i].unpauseHtml('front');
385
+ this.pagesArr[i].pauseHtml('back');
386
+ } else if (this.pagesArr[i] == left && !this.singlePage) {
387
+ this.pagesArr[i].show();
388
+ this.pagesArr[i].unpauseHtml('back');
389
+ this.pagesArr[i].pauseHtml('front');
390
+ } else {
391
+ this.pagesArr[i].hide();
392
+ this.pagesArr[i].pauseHtml('front');
393
+ this.pagesArr[i].pauseHtml('back');
394
+ }
395
+
396
+ this.pagesArr[i]._setZIndex(0);
397
+ }
398
+ this.updateBookPosition();
399
+
400
+ if (left && !this.singlePage) {
401
+ self.options.main.setLoadingProgress(0.1);
402
+ left.load('back', function () {
403
+ self.options.main.setLoadingProgress(1);
404
+ left.startHTML('back');
405
+ if (right) {
406
+ self.options.main.setLoadingProgress(0.1);
407
+ right.load('front', function () {
408
+ self.options.main.setLoadingProgress(1);
409
+ right.load('back', null, true);
410
+ if (next) {
411
+ next.load('front', null, true);
412
+ }
413
+ if (!self.options.doublePage || self.view != 2) {
414
+ right.startHTML('front');
415
+ }
416
+ });
417
+ } else {
418
+ left.load('front', null, true);
419
+ if (prev) {
420
+ prev.load('back', null, true);
421
+ }
422
+ }
423
+ });
424
+ } else {
425
+ self.options.main.setLoadingProgress(0.1);
426
+ right.load('front', function () {
427
+ self.options.main.setLoadingProgress(1);
428
+ if (!self.singlePage) {
429
+ right.load('back', null, true);
430
+ } else {
431
+ if (left) {
432
+ left.load('front', null, true);
433
+ }
434
+ }
435
+ if (next) {
436
+ next.load('front', null, true);
437
+ }
438
+ right.startHTML('front');
439
+ });
440
+ }
441
+ };
442
+
443
+ FLIPBOOK.Book3.prototype.enable = function () {
444
+ this.onResize();
445
+ this.enabled = true;
446
+ };
447
+
448
+ FLIPBOOK.Book3.prototype.disable = function () {
449
+ this.enabled = false;
450
+ };
451
+
452
+ FLIPBOOK.Book3.prototype.getLeftPage = function () {
453
+ return this.pagesArr[this.flippedleft - 1];
454
+ };
455
+
456
+ FLIPBOOK.Book3.prototype.getRightPage = function () {
457
+ return this.pagesArr[this.flippedleft];
458
+ };
459
+
460
+ FLIPBOOK.Book3.prototype.getLeftBackPage = function () {
461
+ return this.pagesArr[this.flippedleft - 2];
462
+ };
463
+
464
+ FLIPBOOK.Book3.prototype.getRightBackPage = function () {
465
+ return this.pagesArr[this.flippedleft + 1];
466
+ };
467
+
468
+ FLIPBOOK.Book3.prototype.getNextPage = function () {
469
+ return this.pagesArr[this.flippedleft + 2];
470
+ };
471
+
472
+ FLIPBOOK.Book3.prototype.getPrevPage = function () {
473
+ return this.pagesArr[this.flippedleft - 3];
474
+ };
475
+
476
+ FLIPBOOK.Book3.prototype.nextPage = function () {
477
+ if (!this.nextEnabled) {
478
+ return;
479
+ }
480
+
481
+ if (this.view == 1 && this.isFocusedLeft() && !this.singlePage) {
482
+ var duration = 700;
483
+ var d = (this.options.pageFlipDuration * duration) / 2;
484
+ this.focusRight(d, 0, true);
485
+ return;
486
+ }
487
+ this.goToPage(this.rightIndex + 2);
488
+ };
489
+
490
+ FLIPBOOK.Book3.prototype.prevPage = function () {
491
+ if (!this.prevEnabled) {
492
+ return;
493
+ }
494
+
495
+ if (this.view == 1 && this.isFocusedRight() && !this.singlePage) {
496
+ var duration = 700;
497
+ var d = (this.options.pageFlipDuration * duration) / 2;
498
+ this.focusLeft(d, 0, true);
499
+ return;
500
+ }
501
+ var target = this.singlePage ? this.rightIndex : this.rightIndex - 2;
502
+ this.goToPage(target);
503
+ };
504
+
505
+ FLIPBOOK.Book3.prototype.goToPage = function (index, instant) {
506
+ if (!this.enabled || this.flipping || isNaN(index)) {
507
+ return;
508
+ }
509
+
510
+ if (this.singlePage || index % 2 != 0) {
511
+ index--;
512
+ }
513
+
514
+ if (index < 0) {
515
+ index = 0;
516
+ }
517
+
518
+ if (index > this.options.pages.length) {
519
+ index = this.options.pages.length;
520
+ }
521
+
522
+ if (index == this.rightIndex) {
523
+ return;
524
+ }
525
+
526
+ if (instant || this.options.instantFlip) {
527
+ this.setRightIndex(index);
528
+ this.updateFlipped();
529
+ this.updateVisiblePages();
530
+ this.options.main.turnPageComplete();
531
+ } else {
532
+ var self = this;
533
+ var end;
534
+ var duration = 600;
535
+ var d = this.options.pageFlipDuration * duration;
536
+ var easing = this.flipEasing;
537
+
538
+ if (index > this.rightIndex) {
539
+ end = 180;
540
+ if (self.angle <= 0 || self.angle >= 180 || !self.angle) {
541
+ self.angle = 1;
542
+ }
543
+ } else if (index < this.rightIndex) {
544
+ end = -180;
545
+ if (self.angle >= 0 || self.angle <= -180 || !self.angle) {
546
+ self.angle = -1;
547
+ }
548
+ }
549
+
550
+ this.flipping = true;
551
+
552
+ if (!this.singlePage) {
553
+ if (this.view == 1) {
554
+ if (index < this.rightIndex) {
555
+ this.focusRight(d);
556
+ } else {
557
+ this.focusLeft(d);
558
+ }
559
+ } else {
560
+ if (index == 0) {
561
+ this.focusRight(d);
562
+ } else if (index == this.visibleSheets.length * 2) {
563
+ this.focusLeft(d);
564
+ } else {
565
+ this.focusBoth(d);
566
+ }
567
+ }
568
+ }
569
+
570
+ this.goingToPage = index;
571
+
572
+ if (this.singlePage) {
573
+ d /= 2;
574
+ }
575
+
576
+ const animationParams = {
577
+ from: self.angle,
578
+ to: end,
579
+ duration: d,
580
+ easing: easing,
581
+ step(now) {
582
+ self._setPageAngle(now);
583
+ },
584
+ complete() {
585
+ self.setRightIndex(self.goingToPage);
586
+ self.angle = 0;
587
+ self.flipping = false;
588
+
589
+ self.updateFlipped();
590
+ self.updateVisiblePages();
591
+ self.options.main.turnPageComplete();
592
+ },
593
+ };
594
+ this.animate(animationParams);
595
+
596
+ this.options.main.turnPageStart();
597
+ }
598
+ };
599
+
600
+ FLIPBOOK.Book3.prototype.animate = function (params) {
601
+ FLIPBOOK.animate(params);
602
+ // const jq = true;
603
+ // if (!jq) {
604
+ // FLIPBOOK.animate(params);
605
+ // } else {
606
+ // jQuery({
607
+ // someValue: params.from,
608
+ // }).animate(
609
+ // {
610
+ // someValue: params.to,
611
+ // },
612
+ // params
613
+ // );
614
+ // }
615
+ };
616
+
617
+ FLIPBOOK.Book3.prototype.updateFlipped = function () {
618
+ if (this.singlePage) {
619
+ this.flippedleft = this.rightIndex;
620
+ this.flippedright = this.options.pages.length - this.rightIndex;
621
+ } else {
622
+ this.flippedleft = (this.rightIndex + (this.rightIndex % 2)) / 2;
623
+ this.flippedright = this.options.pages.length / 2 - this.flippedleft;
624
+ }
625
+ };
626
+
627
+ FLIPBOOK.Book3.prototype.onSwipe = function (event, phase, distanceX, distanceY, duration, fingerCount) {
628
+ if (this.isZoomed() || event.target.className === 'flipbook-page-link' || this.flipping) {
629
+ return;
630
+ }
631
+
632
+ const angle = (-distanceX * 180) / this.main.wrapperW;
633
+ const threshold = 5;
634
+ const distance = Math.abs(distanceX);
635
+
636
+ if (phase === 'start') {
637
+ this.dragging = true;
638
+ return;
639
+ }
640
+
641
+ if ((phase === 'end' || phase === 'cancel') && fingerCount <= 1 && distance > threshold) {
642
+ angle > 0 ? this.nextPage() : this.prevPage();
643
+ this.dragging = false;
644
+ return;
645
+ }
646
+
647
+ if (phase === 'move' && fingerCount <= 1 && this.dragging && distance > threshold) {
648
+ let increment = angle > 0 ? (this.singlePage ? 1 : 2) : this.singlePage ? -1 : -2;
649
+ if ((angle > 0 && !this.nextEnabled) || (angle < 0 && !this.prevEnabled)) {
650
+ return;
651
+ }
652
+
653
+ this.goingToPage = this.rightIndex + increment;
654
+
655
+ if (
656
+ this.goingToPage !== this.rightIndex &&
657
+ this.goingToPage >= 0 &&
658
+ this.goingToPage <= this.pagesArr.length * 2 &&
659
+ !this.options.instantFlip
660
+ ) {
661
+ this._setPageAngle(angle);
662
+ }
663
+ }
664
+ };
665
+
666
+ FLIPBOOK.Book3.prototype.pauseHtml = function () {
667
+ for (var i = 0; i < this.pagesArr.length; i++) {
668
+ this.pagesArr[i].pauseHtml();
669
+ }
670
+ };
671
+
672
+ FLIPBOOK.Book3.prototype._setPageAngle = function (angle) {
673
+ if (this.angle == angle) {
674
+ return;
675
+ }
676
+
677
+ this.angle = angle;
678
+
679
+ var prev;
680
+ var next;
681
+ var left;
682
+ var right;
683
+ this.angle = angle;
684
+ // this.pauseHtml();
685
+
686
+ var ri = this.rightIndex;
687
+ var ri2 = this.goingToPage;
688
+ // if (this.options.rightToLeft && !this.options.backCover) {
689
+ // ri--;
690
+ // ri2--;
691
+ // }
692
+
693
+ var flippping;
694
+
695
+ if (this.singlePage) {
696
+ right = this.visibleSheets[ri];
697
+ left = this.visibleSheets[ri - 1];
698
+ if (angle > 0) {
699
+ right._setAngle(angle / 2);
700
+ next = this.visibleSheets[ri2];
701
+ if (next) {
702
+ next.show();
703
+ next.load('front');
704
+ }
705
+ } else {
706
+ left = this.visibleSheets[ri2];
707
+ left.show();
708
+ left.load('front');
709
+ left._setAngle(angle / 2 + 90);
710
+ }
711
+
712
+ if (next) {
713
+ next._setAngle(0);
714
+ }
715
+ if (prev) {
716
+ prev._setAngle(90);
717
+ }
718
+ } else {
719
+ right = this.visibleSheets[ri / 2];
720
+ left = this.visibleSheets[ri / 2 - 1];
721
+ var newRight = this.visibleSheets[ri2 / 2 - 1];
722
+ var newLeft = this.visibleSheets[ri2 / 2];
723
+ if (angle > 0) {
724
+ if (this.view == 1 && this.isFocusedLeft()) {
725
+ return;
726
+ }
727
+ //flipping from right to left
728
+ //angle 0 -> 180
729
+
730
+ if (angle < 90) {
731
+ flippping = right;
732
+ if (newRight) newRight.hide();
733
+ } else {
734
+ flippping = newRight;
735
+ right.hide();
736
+ }
737
+ flippping.show();
738
+ flippping._setAngle(angle);
739
+ next = this.visibleSheets[ri2 / 2];
740
+ flippping.load(
741
+ 'back',
742
+ function () {
743
+ if (next) {
744
+ next.show();
745
+ next.load('front', null, true);
746
+ }
747
+ },
748
+ true
749
+ );
750
+ } else {
751
+ if (this.view == 1 && this.isFocusedRight()) {
752
+ return;
753
+ }
754
+ //flipping from left to right
755
+ //angle 0 -> -180
756
+
757
+ if (angle > -90) {
758
+ flippping = left;
759
+ if (newLeft) newLeft.hide();
760
+ } else {
761
+ flippping = newLeft;
762
+ left.hide();
763
+ }
764
+ flippping.show();
765
+ flippping._setAngle(180 + angle);
766
+ prev = this.visibleSheets[ri2 / 2 - 1];
767
+ flippping.load(
768
+ 'front',
769
+ function () {
770
+ if (prev) {
771
+ prev.show();
772
+ prev.load('back', null, true);
773
+ }
774
+ },
775
+ true
776
+ );
777
+ }
778
+
779
+ if (next) {
780
+ next._setAngle(0);
781
+ }
782
+ if (prev) {
783
+ prev._setAngle(180);
784
+ }
785
+ }
786
+ };
787
+
788
+ FLIPBOOK.Book3.prototype.isCover = function () {
789
+ return this.rightIndex == 0;
790
+ };
791
+
792
+ FLIPBOOK.Book3.prototype.isBackCover = function () {
793
+ return this.rightIndex == this.options.pages.length;
794
+ };
795
+
796
+ FLIPBOOK.Book3.prototype.onPageUnloaded = function (index) {
797
+ var pageIndex = index;
798
+
799
+ if (this.options.rightToLeft) {
800
+ pageIndex = this.options.pages.length - index - 1;
801
+ }
802
+
803
+ if (this.pagesArr[pageIndex]) {
804
+ this.pagesArr[pageIndex].unload();
805
+ }
806
+ };
807
+
808
+ FLIPBOOK.Book3.prototype.onResize = function () {
809
+ var self = this;
810
+
811
+ var main = this.main;
812
+ var w = main.wrapperW;
813
+ var h = main.wrapperH;
814
+ var bw = main.bookW;
815
+ var bh = main.bookH;
816
+ var pw = main.pageW;
817
+ var ph = main.pageH;
818
+ var r1 = w / h;
819
+ var r2 = pw / ph;
820
+ var options = this.options;
821
+
822
+ function fitToHeight() {
823
+ self.ratio = h / bh;
824
+ fit();
825
+ }
826
+
827
+ function fitToWidth() {
828
+ self.ratio = self.view == 1 ? w / pw : w / bw;
829
+ fit();
830
+ }
831
+
832
+ function fit() {
833
+ if (self.iscroll) {
834
+ self.iscroll.options.zoomMin = self.ratio * options.zoomMin;
835
+ }
836
+ if (self.iscroll) {
837
+ self.iscroll.options.zoomMax = self.ratio * options.zoomMax;
838
+ }
839
+
840
+ self.updateBookPosition();
841
+ if (self.iscroll) {
842
+ self.iscroll.zoom(self.ratio * options.main.zoom, w / 2, h / 2, 0);
843
+ }
844
+
845
+ self.bookScale = self.iscroll.scale;
846
+ }
847
+
848
+ var s = Math.min(this.zoom, 1);
849
+
850
+ var zoomMin = Number(this.options.zoomMin);
851
+
852
+ if (
853
+ this.singlePage ||
854
+ (this.options.responsiveView &&
855
+ w <= this.options.responsiveViewTreshold &&
856
+ r1 < 2 * r2 &&
857
+ r1 < this.options.responsiveViewRatio)
858
+ ) {
859
+ this.view = 1;
860
+
861
+ if (r2 > r1) {
862
+ this.sc = (zoomMin * r1) / (r2 * s);
863
+ } else {
864
+ this.sc = 1;
865
+ }
866
+
867
+ if (w / h > pw / ph) {
868
+ fitToHeight();
869
+ } else {
870
+ fitToWidth();
871
+ }
872
+ } else {
873
+ this.view = 2;
874
+
875
+ if (r1 < 2 * r2) {
876
+ this.sc = (zoomMin * r1) / (2 * r2 * s);
877
+ } else {
878
+ this.sc = 1;
879
+ }
880
+
881
+ if (w / h >= bw / bh) {
882
+ fitToHeight();
883
+ } else {
884
+ fitToWidth();
885
+ }
886
+ }
887
+
888
+ this.updateBookPosition();
889
+ this.updateFlipped();
890
+ this.options.main.turnPageComplete();
891
+ };
892
+
893
+ FLIPBOOK.Book3.prototype.isFocusedRight = function () {
894
+ var center = this.view == 1 ? -this.pageWidth / 2 : 0;
895
+ if (this.singlePage) {
896
+ return this.rightIndex % 2 == 0;
897
+ } else {
898
+ return this.centerContainerPosition < center;
899
+ }
900
+ };
901
+
902
+ FLIPBOOK.Book3.prototype.isFocusedLeft = function () {
903
+ var center = this.view == 1 ? -this.pageWidth / 2 : 0;
904
+
905
+ if (this.singlePage) {
906
+ return this.rightIndex % 2 == 1;
907
+ } else {
908
+ return this.centerContainerPosition > center;
909
+ }
910
+ };
911
+
912
+ FLIPBOOK.Page3 = function (book, index) {
913
+ this.book = book;
914
+ this.main = book.main;
915
+ this.options = book.options;
916
+
917
+ this.index = index;
918
+
919
+ this.wrapper = document.createElement('div');
920
+ this.wrapper.className = 'flipbook-page3';
921
+ this.wrapper.style.width = book.options.pageWidth + 'px';
922
+ this.wrapper.style.height = book.options.pageHeight + 'px';
923
+ this.angle = 0;
924
+ this.wrapper.dataset.sheet = index;
925
+
926
+ var options = book.options;
927
+
928
+ let preloaderSrc = options.pagePreloader || options.assets.spinner;
929
+ let preloaderClass = options.pagePreloader ? 'flipbook-page-preloader-image' : 'flipbook-page-preloader';
930
+
931
+ this.front = document.createElement('div');
932
+ this.wrapper.appendChild(this.front);
933
+ this.front.className = 'flipbook-page3-inner flipbook-page3-inner-front';
934
+
935
+ this.bgFront = document.createElement('div');
936
+ this.front.appendChild(this.bgFront);
937
+ this.bgFront.className = 'flipbook-page3-bg';
938
+
939
+ this.htmlFront = document.createElement('div');
940
+ this.front.appendChild(this.htmlFront);
941
+ this.htmlFront.className = 'flipbook-page3-html page_' + String(2 * index);
942
+ this.htmlFront.style.width = (1000 * options.pageWidth) / options.pageHeight + 'px';
943
+
944
+ var transform = 'scale(' + this.options.pageHeight / 1000 + ')';
945
+ if (this.options.doublePage && this.index > 0) {
946
+ this.htmlFront.style.transform = transform + ' translateX(-100%)';
947
+ } else {
948
+ this.htmlFront.style.transform = transform;
949
+ }
950
+
951
+ this.html = { front: this.htmlFront };
952
+
953
+ this.frontHtmlContentVisible = false;
954
+
955
+ this.preloaderFront = new Image();
956
+ this.preloaderFront.src = preloaderSrc;
957
+ this.preloaderFront.className = preloaderClass;
958
+ this.front.appendChild(this.preloaderFront);
959
+
960
+ if (!book.singlePage) {
961
+ this.back = document.createElement('div');
962
+ this.wrapper.appendChild(this.back);
963
+ this.back.className = 'flipbook-page3-inner flipbook-page3-inner-back';
964
+ this._setVisibility(this.back, false);
965
+
966
+ this.bgBack = document.createElement('div');
967
+ this.back.appendChild(this.bgBack);
968
+ this.bgBack.className = 'flipbook-page3-bg';
969
+
970
+ this.htmlBack = document.createElement('div');
971
+ this.back.appendChild(this.htmlBack);
972
+ this.htmlBack.className = 'flipbook-page3-html page_' + String(2 * index + 1);
973
+ this.htmlBack.style.width = (1000 * options.pageWidth) / options.pageHeight + 'px';
974
+
975
+ this.htmlBack.style.transform = transform;
976
+
977
+ this.html.back = this.htmlBack;
978
+
979
+ this.backHtmlContentVisible = false;
980
+
981
+ this.preloaderBack = new Image();
982
+ this.preloaderBack.src = preloaderSrc;
983
+ this.preloaderBack.className = preloaderClass;
984
+ this.back.appendChild(this.preloaderBack);
985
+ }
986
+
987
+ this.htmlPaused = { front: false, back: false };
988
+
989
+ this.hide();
990
+ this.zIndex = 0;
991
+
992
+ if (this.options.rightToLeft && !this.options.backCover) {
993
+ index++;
994
+ }
995
+ this.wrapper.style.left = String(this.book.options.pageWidth - 1) + 'px';
996
+ };
997
+
998
+ FLIPBOOK.Page3.prototype = {
999
+ load: function (side, callback, thumb) {
1000
+ var pageSize = this.book.pageHeight * this.book.iscroll.scale * window.devicePixelRatio;
1001
+ var o = this.options;
1002
+ var size = pageSize < o.pageTextureSizeSmall ? o.pageTextureSizeSmall : o.pageTextureSize;
1003
+ var isFront = side == 'front' || this.book.singlePage;
1004
+
1005
+ var pageIndex = this.book.singlePage ? this.index : isFront ? this.index * 2 : this.index * 2 + 1;
1006
+ var index = o.rightToLeft ? o.pages.length - pageIndex - 1 : pageIndex;
1007
+
1008
+ if (
1009
+ (this.sizeFront == size && isFront && this.indexFront == index) ||
1010
+ (this.sizeBack == size && !isFront && this.indexBack == index)
1011
+ ) {
1012
+ if (!thumb) {
1013
+ this.loadHTML(side);
1014
+ }
1015
+ if (callback) {
1016
+ callback.call(this);
1017
+ }
1018
+ } else {
1019
+ if (isFront) {
1020
+ this.sizeFront = size;
1021
+ } else {
1022
+ this.sizeBack = size;
1023
+ }
1024
+
1025
+ var self = this;
1026
+
1027
+ if (isFront) this.indexFront = index;
1028
+ else this.indexBack = index;
1029
+
1030
+ o.main.loadPage(index, size, function (page) {
1031
+ if (page && page.image) {
1032
+ var img = page.image[size] || page.image;
1033
+ var page = o.pages[index];
1034
+ if (
1035
+ (isFront && page && page.side == 'right') ||
1036
+ (o.rightToLeft && isFront && page && page.side == 'left')
1037
+ ) {
1038
+ if (!img.clone) {
1039
+ img.clone = new Image();
1040
+ img.clone.src = img.src;
1041
+ }
1042
+ img = img.clone;
1043
+ img.style.transform = 'translateX(-50%)';
1044
+ }
1045
+
1046
+ if (isFront) {
1047
+ if (self.bgFront) self.bgFront.replaceChildren(img);
1048
+ if (self.preloaderFront) self.preloaderFront.style.display = 'none';
1049
+ } else {
1050
+ if (self.bgBack) self.bgBack.replaceChildren(img);
1051
+ if (self.preloaderBack) self.preloaderBack.style.display = 'none';
1052
+ }
1053
+
1054
+ if (!thumb) {
1055
+ self.loadHTML(side);
1056
+ }
1057
+ }
1058
+
1059
+ if (callback) {
1060
+ callback.call(self);
1061
+ }
1062
+ });
1063
+ }
1064
+ },
1065
+
1066
+ loadHTML: function (side) {
1067
+ var self = this;
1068
+
1069
+ var isFront = side == 'front';
1070
+
1071
+ var pageIndex = this.book.singlePage ? this.index : isFront ? this.index * 2 : this.index * 2 + 1;
1072
+
1073
+ var o = this.options;
1074
+ var index = o.rightToLeft ? o.pages.length - pageIndex - 1 : pageIndex;
1075
+
1076
+ if (index < 0) {
1077
+ return;
1078
+ }
1079
+
1080
+ if (this.htmlContent && this.htmlContent[side]) {
1081
+ this.updateHtmlContent(side);
1082
+ } else {
1083
+ this.options.main.loadPageHTML(index, function (html) {
1084
+ self.htmlContent = this.htmlContent || {};
1085
+ self.htmlContent[side] = html;
1086
+ self.updateHtmlContent(side);
1087
+ });
1088
+ }
1089
+ },
1090
+
1091
+ startHTML: function (side) {
1092
+ this.book.startPageItems(this.html[side]);
1093
+ },
1094
+
1095
+ unload: function () {
1096
+ this.size = null;
1097
+ this.mat = false;
1098
+ this.pageSize = null;
1099
+ },
1100
+
1101
+ pauseHtml: function (side) {
1102
+ if (!this.htmlPaused[side]) {
1103
+ this.htmlPaused[side] = true;
1104
+ const htmlContainer = this.html[side];
1105
+ if (!htmlContainer) {
1106
+ return;
1107
+ }
1108
+ this.main.trigger('hidepagehtml', { page: this });
1109
+
1110
+ var mediaElements = htmlContainer.querySelectorAll('video, audio');
1111
+ mediaElements.forEach(function (media) {
1112
+ media.pause();
1113
+ });
1114
+
1115
+ var iframes = htmlContainer.querySelectorAll('iframe');
1116
+ for (var i = 0; i < iframes.length; i++) {
1117
+ var iframe = iframes[i];
1118
+ var src = iframe.src;
1119
+ var youtubeRegex = /(?:youtube\.com\/embed\/|youtu\.be\/)/;
1120
+ // var youtubeRegex =
1121
+ // /(?:youtube\.com\/(?:[^\/\n\s]+\/\S+\/|(?:v|e(?:mbed)?)\/|\S*?[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/;
1122
+
1123
+ // if (youtubeRegex.test(src)) {
1124
+ // var youtubeVideo = iframe.contentWindow;
1125
+ // youtubeVideo.postMessage('{"event":"command","func":"pauseVideo","args":""}', '*');
1126
+ // } else {
1127
+ this.removedIframes = this.removedIframes || [];
1128
+ this.removedIframes.push({
1129
+ iframe: iframe,
1130
+ parentNode: iframe.parentNode,
1131
+ });
1132
+ iframe.parentNode.removeChild(iframe);
1133
+ // }
1134
+ }
1135
+ }
1136
+ },
1137
+
1138
+ unpauseHtml: function (side) {
1139
+ this.htmlPaused[side] = false;
1140
+ if (this.removedIframes && this.removedIframes.length) {
1141
+ this.removedIframes.forEach(function (obj) {
1142
+ obj.parentNode.appendChild(obj.iframe);
1143
+ });
1144
+ }
1145
+ this.removedIframes = [];
1146
+ },
1147
+
1148
+ showHtml: function () {
1149
+ if (!this.htmlContentVisible) {
1150
+ this.htmlContentVisible = true;
1151
+ }
1152
+ },
1153
+
1154
+ updateHtmlContent: function (side) {
1155
+ this.htmlLoaded = this.htmlLoaded || {};
1156
+ if (!this.htmlLoaded[side]) {
1157
+ var c = this.htmlContent[side];
1158
+ if (c.jquery) {
1159
+ c = c[0];
1160
+ }
1161
+
1162
+ this.htmlLoaded[side] = true;
1163
+ var container = this.html[side];
1164
+ if (container) container.appendChild(c);
1165
+
1166
+ this.main.trigger('showpagehtml', { page: this });
1167
+ }
1168
+ this.startHTML(side);
1169
+ },
1170
+
1171
+ show: function () {
1172
+ if (this.hidden) {
1173
+ this.wrapper.style.display = 'block';
1174
+ this.setShadowOpacity(0);
1175
+ this.showHtml();
1176
+ }
1177
+ this.hidden = false;
1178
+ },
1179
+
1180
+ setShadowOpacity: function (val) {
1181
+ if (this.shadowOpacity != val && !this.hidden) {
1182
+ this.wrapper.style.setProperty('--page3-shadow-opacity', val);
1183
+ this.shadowOpacity = val;
1184
+ }
1185
+ },
1186
+
1187
+ hide: function () {
1188
+ if (!this.hidden) {
1189
+ this.wrapper.style.display = 'none';
1190
+ this.setShadowOpacity(0);
1191
+ }
1192
+
1193
+ this.hidden = true;
1194
+ },
1195
+
1196
+ _setVisibility: function (div, visible) {
1197
+ if (div && div.dataset.visible != visible) {
1198
+ div.dataset.visible = visible;
1199
+ div.style.opacity = visible ? '1' : '0';
1200
+ div.style.pointerEvents = visible ? 'auto' : 'none';
1201
+ }
1202
+ },
1203
+
1204
+ _setAngle: function (angle) {
1205
+ angle = -angle;
1206
+
1207
+ if (angle != this.angle) {
1208
+ this.setShadowOpacity((1 - Math.abs(angle + 90) / 90) * 0.2);
1209
+ this.wrapper.style.setProperty('--page3-rotate-y', String(angle + 'deg'));
1210
+ this._setVisibility(this.front, angle > -90);
1211
+ this._setVisibility(this.back, angle < -90);
1212
+ this.angle = angle;
1213
+ var i;
1214
+ var max = 0;
1215
+ for (i = 0; i < this.book.pagesArr.length; i++) {
1216
+ if (i != this.index && this.book.pagesArr[i].zIndex > max) {
1217
+ max = this.book.pagesArr[i].zIndex;
1218
+ }
1219
+ }
1220
+ this._setZIndex(max + 1);
1221
+ }
1222
+ },
1223
+
1224
+ _setZIndex: function (val) {
1225
+ if (this.zIndex != val) {
1226
+ this.wrapper.style['z-index'] = val;
1227
+ }
1228
+ this.zIndex = val;
1229
+ },
1230
+ };
flipbook.css ADDED
@@ -0,0 +1,2515 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ .flipbook-overlay {
2
+ position: fixed;
3
+ top: 0;
4
+ bottom: 0;
5
+ left: 0;
6
+ right: 0;
7
+ background: rgba(0, 0, 0, 0.71);
8
+ z-index: 2147483646 !important;
9
+ opacity: 0;
10
+ transition: opacity 0.3s ease-out;
11
+ }
12
+
13
+ .flipbook-wrapper {
14
+ position: absolute;
15
+ width: 100%;
16
+ height: 100%;
17
+ -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
18
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
19
+ text-shadow: none;
20
+ -webkit-border-radius: 4px;
21
+ border-radius: 4px;
22
+ background: #ffffff;
23
+ }
24
+
25
+ .flipbook-wrapper-transparent {
26
+ width: 100%;
27
+ height: 100%;
28
+ background: none;
29
+ }
30
+
31
+ .flipbook-main-wrapper {
32
+ position: absolute;
33
+ top: 0;
34
+ left: 0;
35
+ right: 0;
36
+ bottom: 0;
37
+ overflow: hidden;
38
+ direction: ltr !important;
39
+ scrollbar-color: rgba(130, 130, 130, 0.5) transparent;
40
+ scrollbar-width: thin;
41
+ }
42
+
43
+ .flipbook-bookLayer {
44
+ position: absolute;
45
+ top: 0;
46
+ left: 0;
47
+ right: 0;
48
+ bottom: 0;
49
+ overflow: hidden;
50
+
51
+ cursor: -webkit-grab;
52
+ cursor: grab;
53
+ }
54
+
55
+ .flipbook-zoomLayer-inside {
56
+ display: block;
57
+ position: relative;
58
+ background-size: contain;
59
+ text-align: center;
60
+ }
61
+
62
+ .flipbook-zoomLayer-inside .flipbook-carousel-page {
63
+ float: left;
64
+ }
65
+
66
+ .flipbook-book {
67
+ display: block;
68
+ position: relative;
69
+ }
70
+
71
+ .flipbook-page {
72
+ position: absolute;
73
+ width: 100%;
74
+ height: 100%;
75
+ transform: translateZ(0px);
76
+ will-change: transform;
77
+ transform-style: preserve-3d;
78
+ }
79
+
80
+ .flipbook-page3 {
81
+ position: absolute;
82
+ background: #eee;
83
+ will-change: transform;
84
+ transform: rotateY(var(--page3-rotate-y, 0));
85
+ transform-origin: 0 50%;
86
+ -webkit-transform-origin: 0 50%;
87
+ }
88
+
89
+ .flipbook-page3-html {
90
+ position: absolute;
91
+ height: 1000px;
92
+ transform-origin: 0 0;
93
+ top: 0;
94
+ left: 0;
95
+ }
96
+
97
+ .flipbook-page3-inner {
98
+ overflow: hidden;
99
+ width: 100%;
100
+ height: 100%;
101
+ position: absolute;
102
+ will-change: opacity;
103
+ }
104
+
105
+ .flipbook-page3-inner-back {
106
+ transform: scaleX(-1);
107
+ }
108
+
109
+ .flipbook-page3-bg {
110
+ width: 100%;
111
+ height: 100%;
112
+ position: absolute;
113
+ }
114
+
115
+ .flipbook-page3-bg img {
116
+ height: 100% !important;
117
+ }
118
+
119
+ .flipbook-page3 img {
120
+ top: 0;
121
+ bottom: 0;
122
+ right: 0;
123
+ left: 0;
124
+ height: 100%;
125
+ margin: auto;
126
+ position: absolute;
127
+ transform-origin: 0 0;
128
+ -webkit-transform-origin: 0 0;
129
+ float: left;
130
+ user-select: none;
131
+ pointer-events: none;
132
+ max-width: unset;
133
+ width: unset;
134
+ }
135
+
136
+ .flipbook-page3 canvas {
137
+ width: 100%;
138
+ height: 100%;
139
+ }
140
+
141
+ .flipbook-page3::before {
142
+ content: '';
143
+ position: fixed;
144
+ top: 0;
145
+ right: 0;
146
+ bottom: 0;
147
+ left: 0;
148
+ background: rgba(0, 0, 0, 1);
149
+ opacity: var(--page3-shadow-opacity, 0);
150
+ will-change: opacity;
151
+ transform: translateZ(0);
152
+ z-index: 1;
153
+ pointer-events: none;
154
+ }
155
+
156
+ .flipbook-page3-front {
157
+ transform-origin: 0 50%;
158
+ -webkit-transform-origin: 0 50%;
159
+ }
160
+
161
+ .flipbook-page3-back {
162
+ transform-origin: 0% 50%;
163
+ -webkit-transform-origin: 0% 50%;
164
+ }
165
+
166
+ .flipbook-page3-back .flipbook-page3-inner {
167
+ transform: rotateY(180deg);
168
+ }
169
+
170
+ .flipbook-book3 {
171
+ display: block;
172
+ position: relative;
173
+ }
174
+
175
+ .flipbook-center-container3 {
176
+ position: relative;
177
+ will-change: transform;
178
+ border: none;
179
+ }
180
+
181
+ .flipbook-page-htmlContent {
182
+ transform-origin: 0 0;
183
+ z-index: 50;
184
+ position: absolute;
185
+ }
186
+
187
+ .flipbook-page-html video,
188
+ .flipbook-page-html iframe {
189
+ max-width: initial;
190
+ }
191
+
192
+ .flipbook-book canvas {
193
+ position: absolute;
194
+ left: 0;
195
+ top: 0;
196
+ z-index: 50;
197
+ width: 100%;
198
+ height: 100%;
199
+ backface-visibility: hidden;
200
+ -webkit-backface-visibility: hidden;
201
+ transform-style: preserve-3d;
202
+ -webkit-transform-style: preserve-3d;
203
+ }
204
+
205
+ .flipbook-page img {
206
+ width: 100%;
207
+ height: 100%;
208
+ backface-visibility: hidden;
209
+ -webkit-backface-visibility: hidden;
210
+ transform-style: preserve-3d;
211
+ -webkit-transform-style: preserve-3d;
212
+ }
213
+
214
+ .flipbook-left-arrow {
215
+ display: block !important;
216
+ position: absolute !important;
217
+ top: 50% !important;
218
+ left: 0;
219
+ font-style: normal;
220
+ font-weight: normal;
221
+ -webkit-font-smoothing: antialiased;
222
+ text-align: center;
223
+ cursor: pointer;
224
+ }
225
+
226
+ .flipbook-right-arrow {
227
+ display: block !important;
228
+ position: absolute !important;
229
+ top: 50% !important;
230
+ right: 0;
231
+ font-style: normal;
232
+ font-weight: normal;
233
+ -webkit-font-smoothing: antialiased;
234
+ text-align: center;
235
+ cursor: pointer;
236
+ }
237
+
238
+ .flipbook-first-arrow {
239
+ display: block !important;
240
+ position: absolute !important;
241
+ top: 50%;
242
+ left: 0;
243
+ font-style: normal;
244
+ font-weight: normal;
245
+ -webkit-font-smoothing: antialiased;
246
+ text-align: center;
247
+ cursor: pointer;
248
+ }
249
+
250
+ .flipbook-last-arrow {
251
+ display: block !important;
252
+ position: absolute !important;
253
+ top: 50%;
254
+ right: 0;
255
+ font-style: normal;
256
+ font-weight: normal;
257
+ -webkit-font-smoothing: antialiased;
258
+ text-align: center;
259
+ cursor: pointer;
260
+ }
261
+
262
+ .flipbook-currentPageHolder {
263
+ position: relative;
264
+ z-index: 3;
265
+ pointer-events: auto;
266
+ display: inline-block;
267
+ user-select: none;
268
+ display: flex;
269
+ align-items: center;
270
+ box-sizing: content-box;
271
+ width: max-content;
272
+ }
273
+
274
+ .flipbook-currentPageHolder form {
275
+ display: flex;
276
+ top: 0;
277
+ margin: 0;
278
+ }
279
+
280
+ .flipbook-currentPageNumber {
281
+ border-radius: 15px !important;
282
+ padding: 5px !important;
283
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif !important;
284
+ font-size: 14px;
285
+ line-height: initial;
286
+ }
287
+
288
+ .flipbook-currentPageInput {
289
+ line-height: 14px !important;
290
+ background: none !important;
291
+ border: none !important;
292
+ font-size: 14px !important;
293
+ max-width: initial !important;
294
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif !important;
295
+ text-align: right !important;
296
+ height: 100% !important;
297
+ padding: 0 !important;
298
+ border: 2px solid rgba(128, 128, 128, 0.5);
299
+ }
300
+
301
+ .flipbook-currentPageInput.digits-3 {
302
+ min-width: calc(3em) !important;
303
+ }
304
+
305
+ .flipbook-currentPageInput.digits-2 {
306
+ min-width: calc(2em) !important;
307
+ }
308
+
309
+ .flipbook-currentPageInput.digits-1 {
310
+ min-width: calc(1em) !important;
311
+ }
312
+
313
+ .flipbook-currentPageInput:focus {
314
+ outline: 2px solid #88888885;
315
+ }
316
+
317
+ .flipbook-color-transparent {
318
+ color: transparent !important;
319
+ }
320
+
321
+ .flipbook-browser-fullscreen {
322
+ position: fixed !important;
323
+ top: 0 !important;
324
+ left: 0 !important;
325
+ width: 100% !important;
326
+ height: 100% !important;
327
+ z-index: 999999 !important;
328
+ margin: 0 !important;
329
+ padding: 0 !important;
330
+ }
331
+
332
+ .flipbook-menuBottom {
333
+ position: absolute;
334
+ bottom: 0;
335
+ margin: 0;
336
+ padding: 0;
337
+ z-index: 2;
338
+ pointer-events: none;
339
+ display: flex;
340
+ overflow: visible;
341
+ }
342
+
343
+ .flipbook-menu-btn-wrapper {
344
+ display: inline-block;
345
+ position: relative;
346
+ overflow: visible;
347
+ }
348
+
349
+ .flipbook-tools .flipbook-menu-btn-wrapper {
350
+ pointer-events: auto;
351
+ display: flex;
352
+ align-items: center;
353
+ position: relative;
354
+ overflow: visible;
355
+ cursor: pointer;
356
+ padding-right: 15px;
357
+ min-width: 130px;
358
+ }
359
+
360
+ .flipbook-share .flipbook-menu-btn-wrapper {
361
+ pointer-events: auto;
362
+ display: inline-block;
363
+ align-items: center;
364
+ position: relative;
365
+ overflow: visible;
366
+ cursor: pointer;
367
+ padding: 15px;
368
+ }
369
+
370
+ .flipbook-menuBottom .flipbook-has-tooltip::before {
371
+ bottom: calc(100% + 5px);
372
+ }
373
+
374
+ .flipbook-menuTop .flipbook-has-tooltip::before {
375
+ top: calc(100% + 5px);
376
+ }
377
+
378
+ .flipbook-page-item-has-tooltip:hover {
379
+ z-index: 1;
380
+ }
381
+
382
+ .flipbook-page-item-has-tooltip:hover::before {
383
+ visibility: visible;
384
+ opacity: 1;
385
+ }
386
+
387
+ .flipbook-tooltip-left::before {
388
+ left: -20px;
389
+ transform: translateX(-100%) translateY(-50%);
390
+ top: 50%;
391
+ }
392
+
393
+ .flipbook-tooltip-right::before {
394
+ left: calc(100% + 20px);
395
+ transform: translateY(-50%);
396
+ top: 50%;
397
+ }
398
+
399
+ .flipbook-tooltip-top::before {
400
+ left: 50%;
401
+ transform: translateX(-50%);
402
+ bottom: calc(100% + 20px);
403
+ }
404
+
405
+ .flipbook-tooltip-bottom::before {
406
+ left: 50%;
407
+ transform: translateX(-50%);
408
+ top: calc(100% + 20px);
409
+ }
410
+
411
+ .flipbook-tooltip-topLeft::before {
412
+ left: -20px;
413
+ transform: translateX(-100%);
414
+ bottom: calc(100% + 20px);
415
+ }
416
+
417
+ .flipbook-tooltip-topRight::before {
418
+ right: -20px;
419
+ bottom: calc(100% + 20px);
420
+ }
421
+
422
+ .flipbook-tooltip-bottomLeft::before {
423
+ left: -20px;
424
+ transform: translateX(-100%);
425
+ top: calc(100% + 20px);
426
+ }
427
+
428
+ .flipbook-tooltip-bottomRight::before {
429
+ right: -20px;
430
+ top: calc(100% + 20px);
431
+ }
432
+
433
+ .flipbook-page-item-has-tooltip::before {
434
+ content: attr(data-tooltip);
435
+ position: absolute;
436
+ visibility: hidden;
437
+ opacity: 0;
438
+ background-color: rgba(255, 255, 255, 0.9);
439
+ color: black;
440
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
441
+ text-align: center;
442
+ border-radius: 4px;
443
+ padding: 10px 20px;
444
+ font-size: 32px;
445
+ font-weight: normal;
446
+ letter-spacing: normal;
447
+ line-height: 1.4;
448
+ text-transform: none;
449
+ width: max-content;
450
+ max-width: 600px;
451
+ transition:
452
+ opacity 0.3s ease,
453
+ visibility 0.3s ease;
454
+ }
455
+
456
+ .flipbook-has-tooltip::before {
457
+ content: attr(data-tooltip);
458
+ position: absolute;
459
+ left: 50%;
460
+ transform: translateX(-50%);
461
+ visibility: hidden;
462
+ opacity: 0;
463
+ background-color: rgba(0, 0, 0, 0.8);
464
+ color: white;
465
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
466
+ font-size: 14px;
467
+ text-align: center;
468
+ border-radius: 4px;
469
+ padding: 5px 10px;
470
+ font-size: 14px;
471
+ font-weight: normal;
472
+ letter-spacing: normal;
473
+ line-height: 1.4;
474
+ text-transform: none;
475
+ width: max-content;
476
+ white-space: nowrap;
477
+ transition:
478
+ opacity 0.3s ease,
479
+ visibility 0.3s ease;
480
+ }
481
+
482
+ .flipbook-menu-right .flipbook-has-tooltip:last-child::before {
483
+ left: 100%;
484
+ transform: translateX(-100%);
485
+ }
486
+
487
+ .flipbook-menu-left .flipbook-has-tooltip:first-child::before {
488
+ left: 0%;
489
+ transform: translateX(0%);
490
+ }
491
+
492
+ .flipbook-has-tooltip:hover::before {
493
+ visibility: visible;
494
+ opacity: 1;
495
+ }
496
+
497
+ .flipbook-has-tooltip.disabled:hover::before {
498
+ visibility: hidden;
499
+ opacity: 0;
500
+ }
501
+
502
+ .flipbook-menu-fixed {
503
+ left: 0;
504
+ right: 0;
505
+ }
506
+
507
+ .flipbook-menu-fixed .flipbook-menu {
508
+ align-items: center;
509
+ }
510
+
511
+ @media only screen and (max-width: 768px) {
512
+ .flipbook-menu-fixed .flipbook-menu {
513
+ justify-content: space-around;
514
+ width: -webkit-fill-available;
515
+ }
516
+ }
517
+
518
+ .flipbook-menu-center {
519
+ justify-content: center;
520
+ align-items: center;
521
+ }
522
+
523
+ .flipbook-menu-right {
524
+ justify-content: flex-end;
525
+ align-self: center;
526
+ flex: 1;
527
+ display: flex;
528
+ /* min-width: -webkit-min-content; */
529
+ /* Workaround to Chrome bug */
530
+ }
531
+
532
+ .flipbook-menu-left {
533
+ justify-content: flex-start;
534
+ align-self: center;
535
+ flex: 1;
536
+ display: flex;
537
+ /* min-width: -webkit-min-content; */
538
+ /* Workaround to Chrome bug */
539
+ }
540
+
541
+ .flipbook-menu-floating {
542
+ margin-top: 5px !important;
543
+ margin-bottom: 5px !important;
544
+ left: 50%;
545
+ transform: translate(-50%, 0);
546
+ min-width: fit-content;
547
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
548
+ border-radius: 2px;
549
+ }
550
+
551
+ .flipbook-menuTop {
552
+ position: absolute;
553
+ top: 0;
554
+ margin: 0;
555
+ padding: 0;
556
+ z-index: 2;
557
+ pointer-events: none;
558
+ display: flex;
559
+ justify-content: space-between;
560
+ overflow: visible;
561
+ }
562
+
563
+ .flipbook-menu {
564
+ position: relative;
565
+ text-align: center;
566
+ display: flex;
567
+ }
568
+
569
+ .flipbook-menu svg,
570
+ .flipbook-nav svg {
571
+ box-sizing: content-box;
572
+ }
573
+
574
+ .flipbook-page-caption-btn {
575
+ padding: 12px;
576
+ background-color: rgba(255, 255, 255, 0.9);
577
+ fill: black;
578
+ display: flex;
579
+ justify-content: center;
580
+ border-radius: 6px;
581
+ bottom: 50px;
582
+ right: 50px;
583
+ position: absolute;
584
+ cursor: pointer;
585
+ box-sizing: content-box;
586
+ transform: scale(2);
587
+ }
588
+
589
+ .htmlContent > .flipbook-page-caption-btn:hover + .flipbook-page-caption {
590
+ opacity: 1;
591
+ }
592
+
593
+ .flipbook-page-caption {
594
+ opacity: 0;
595
+ position: absolute;
596
+ bottom: 120px;
597
+ max-width: calc(100% - 288px);
598
+ width: max-content;
599
+ padding: 24px;
600
+ border-radius: 12px;
601
+ right: 120px;
602
+ background-color: rgba(255, 255, 255, 0.9);
603
+ color: black;
604
+ font-size: 24px;
605
+ transition: opacity 0.3s;
606
+ }
607
+
608
+ .flipbook-menu-btn {
609
+ user-select: none;
610
+ display: inline-flex;
611
+ justify-content: center;
612
+ cursor: pointer;
613
+ background: none;
614
+ transition: all 0.1s ease-out;
615
+ pointer-events: auto;
616
+ box-sizing: content-box;
617
+ }
618
+
619
+ .flipbook-submenu .flipbook-menu-btn {
620
+ justify-content: left;
621
+ }
622
+ .flipbook-submenu .flipbook-menu-btn svg {
623
+ margin-right: 10px;
624
+ }
625
+
626
+ .flipbook-nav .disabled,
627
+ .flipbook-menu .disabled {
628
+ opacity: 0.2;
629
+ cursor: inherit;
630
+ /* pointer-events: none; */
631
+ }
632
+
633
+ .flipbook-icon-reverse {
634
+ transform: scaleX(-1);
635
+ transform-origin: center;
636
+ }
637
+
638
+ .flipbook-menu .flipbook-findbar {
639
+ pointer-events: auto;
640
+ margin-top: 10px;
641
+ }
642
+
643
+ .flipbook-menu .flipbook-findbar input {
644
+ width: 140px;
645
+ margin-left: 0;
646
+ }
647
+
648
+ .flipbook-thumbHolder {
649
+ bottom: 0;
650
+ position: absolute;
651
+ top: 0;
652
+ z-index: 9;
653
+ min-width: 170px;
654
+ display: flex;
655
+ flex-direction: column;
656
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif !important;
657
+ }
658
+
659
+ .flipbook-thumbsWrapper {
660
+ bottom: 0;
661
+ left: 0;
662
+ top: 90px;
663
+ overflow: auto;
664
+ width: 100%;
665
+ height: 100%;
666
+ }
667
+
668
+ .flipbook-thumbsScroller {
669
+ margin: 0;
670
+ position: relative;
671
+ text-align: center;
672
+ display: grid;
673
+ justify-content: center;
674
+ }
675
+
676
+ .flipbook-thumbs-grid .flipbook-thumbsWrapper {
677
+ width: calc(100% - 100px);
678
+ max-width: 1600px;
679
+ margin: auto;
680
+ padding-top: 20px;
681
+ padding-bottom: 50px;
682
+ height: max-content;
683
+ }
684
+
685
+ .flipbook-thumbs-grid .flipbook-thumbsScroller {
686
+ display: block;
687
+ }
688
+ .flipbook-thumbs-grid {
689
+ background-color: rgba(0, 0, 0, 0.5) !important;
690
+ backdrop-filter: blur(20px);
691
+ width: 100%;
692
+ color: white;
693
+ }
694
+
695
+ .flipbook-thumbs-grid .flipbook-menu-title,
696
+ .flipbook-thumbs-grid .flipbook-btn-close svg {
697
+ color: white !important;
698
+ fill: white !important;
699
+ }
700
+
701
+ .flipbook-thumbs-grid .flipbook-menu-header {
702
+ display: none;
703
+ }
704
+
705
+ .flipbook-thumbs-grid-close {
706
+ display: none;
707
+ }
708
+
709
+ .flipbook-thumbs-grid .flipbook-thumbs-grid-close {
710
+ display: flex;
711
+ justify-content: end;
712
+ top: 10px;
713
+ right: 40px;
714
+ z-index: 1;
715
+ }
716
+
717
+ .flipbook-thumbs-grid .flipbook-thumbs-grid-close svg {
718
+ font-size: 30px;
719
+ fill: #fff !important;
720
+ text-shadow: drop-shadow(rgb(0, 0, 0) 0px 0px 1px);
721
+ padding: 10px;
722
+ }
723
+
724
+ .flipbook-thumb {
725
+ margin: 15px 10px 10px;
726
+ cursor: pointer;
727
+ position: relative;
728
+ display: inline-block;
729
+ background: rgba(255, 255, 255, 0.5);
730
+ border: 1px solid rgb(0 0 0 / 25%);
731
+ }
732
+
733
+ .flipbook-thumb:hover,
734
+ .flipbook-thumb-active {
735
+ border: 1px solid rgb(0 0 0 / 50%);
736
+ box-shadow: 0 0 0px 2px rgb(0 0 0 / 25%);
737
+ transition: 0.2s all;
738
+ opacity: 0.7;
739
+ }
740
+
741
+ .flipbook-thumb:hover .flipbook-thumb-num {
742
+ background: rgba(0, 0, 0, 0.8);
743
+ transition: 0.2s all;
744
+ }
745
+
746
+ .flipbook-search {
747
+ padding: 16px;
748
+ position: relative;
749
+ }
750
+
751
+ .flipbook-search-clear {
752
+ position: absolute;
753
+ top: 7px;
754
+ right: 7px;
755
+ }
756
+
757
+ .flipbook-search-match {
758
+ padding: 8px 16px;
759
+ font-size: 14px;
760
+ line-height: 20px;
761
+ cursor: pointer;
762
+ width: 218px;
763
+ }
764
+
765
+ .flipbook-search-match:hover {
766
+ text-decoration: underline;
767
+ }
768
+
769
+ .flipbook-search-match-title {
770
+ height: 20px;
771
+ }
772
+
773
+ .flipbook-search-match-text {
774
+ text-align: left;
775
+ }
776
+
777
+ .flipbook-thumb-num {
778
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
779
+ font-size: 14px;
780
+ line-height: 14px;
781
+ user-select: none;
782
+ font-weight: 600;
783
+ position: relative;
784
+ position: absolute;
785
+ bottom: 11px;
786
+ bottom: 2px;
787
+ right: 2px;
788
+ border-radius: 2px;
789
+ background: rgba(0, 0, 0, 0.6);
790
+ color: white !important;
791
+ padding: 4px 6px;
792
+ display: inline-block;
793
+ }
794
+
795
+ .flipbook-thumb img {
796
+ display: inline-block;
797
+ }
798
+
799
+ .flipbook-toc {
800
+ margin: 0;
801
+ padding: 0;
802
+ position: absolute;
803
+ top: 50px;
804
+ bottom: 0;
805
+ overflow: auto;
806
+ width: calc(100% - 20px);
807
+ padding: 0 10px;
808
+ box-sizing: content-box;
809
+ }
810
+
811
+ .flipbook-toc ul {
812
+ list-style: none;
813
+ padding-left: 0;
814
+ margin: 0;
815
+ }
816
+ .flipbook-toc .title-container {
817
+ display: flex;
818
+ align-items: center;
819
+ flex: 1;
820
+ }
821
+
822
+ .flipbook-toc ul ul {
823
+ padding-left: 20px; /* Indent only nested lists */
824
+ }
825
+
826
+ .flipbook-toc li {
827
+ margin: 5px 0;
828
+ }
829
+
830
+ .flipbook-toc .toc-item {
831
+ display: flex;
832
+ align-items: center;
833
+ justify-content: space-between;
834
+ padding: 5px 0;
835
+ cursor: pointer;
836
+ transition: background-color 0.2s;
837
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
838
+ }
839
+
840
+ .flipbook-toc .toc-item:hover {
841
+ background-color: rgba(128, 128, 128, 0.2);
842
+ }
843
+
844
+ .flipbook-toc .expand-icon,
845
+ .flipbook-toc .spacer {
846
+ display: inline-flex;
847
+ align-items: center;
848
+ justify-content: center;
849
+ width: 1em; /* Fixed width */
850
+ height: 1em; /* Fixed height to match icon size */
851
+ margin-right: 8px;
852
+ flex-shrink: 0;
853
+ }
854
+
855
+ .flipbook-toc .expand-icon svg {
856
+ transition: transform 0.2s ease-in-out;
857
+ }
858
+
859
+ .flipbook-toc .expand-icon.expanded svg {
860
+ transform: rotate(90deg);
861
+ }
862
+
863
+ .flipbook-toc .spacer {
864
+ visibility: hidden;
865
+ }
866
+
867
+ .flipbook-toc .title-container span.title {
868
+ font-size: 14px;
869
+ /* color: #333; */
870
+ }
871
+
872
+ .flipbook-toc .page-number {
873
+ font-size: 12px;
874
+ margin-left: 10px;
875
+ white-space: nowrap;
876
+ margin-right: 5px;
877
+ }
878
+
879
+ .flipbook-tocHolder {
880
+ position: absolute;
881
+ top: 0;
882
+ width: 250px;
883
+ bottom: 0;
884
+ z-index: 9;
885
+ }
886
+
887
+ .flipbook-tocItem {
888
+ display: block;
889
+ }
890
+
891
+ .flipbook-tocItem {
892
+ display: flex;
893
+ justify-content: space-between;
894
+ padding: 8px 15px; /* Adjusted padding */
895
+ margin: 5px 0; /* Optional for spacing between items */
896
+ align-items: center; /* Ensure vertical alignment of content */
897
+
898
+ cursor: pointer;
899
+ font-size: 14px;
900
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
901
+ width: 100%;
902
+ }
903
+
904
+ .flipbook-tocItem .flipbook-icon {
905
+ margin-right: 10px; /* Add space between icon and title */
906
+ display: inline-block;
907
+ }
908
+
909
+ .flipbook-tocItem .title {
910
+ flex-grow: 1; /* Allow the title to take up remaining space */
911
+ text-align: left; /* Ensure title aligns left */
912
+ margin-left: 10px; /* Add some space between icon and title */
913
+ }
914
+
915
+ .flipbook-tocItem .flipbook-toc-number {
916
+ text-align: right;
917
+ width: 25px; /* Ensure the width remains fixed */
918
+ flex-shrink: 0; /* Prevent the page number from shrinking */
919
+ }
920
+
921
+ .flipbook-tocItem .title:hover {
922
+ text-decoration: underline;
923
+ }
924
+
925
+ .flipbook-tocItem .right {
926
+ float: right;
927
+ }
928
+
929
+ .flipbook-tocItem > span {
930
+ vertical-align: top;
931
+ }
932
+
933
+ .flipbook-tocItem > span > span {
934
+ vertical-align: middle;
935
+ }
936
+
937
+ .flipbook-findbar {
938
+ position: relative;
939
+ }
940
+
941
+ .flipbook-findbar input {
942
+ width: 210px;
943
+ padding: 5px;
944
+ font-size: 14px;
945
+ line-height: initial;
946
+ border: 1px solid rgba(128, 128, 128, 0.7);
947
+ }
948
+
949
+ .flipbook-findbar input:focus {
950
+ outline: 1px solid rgba(128, 128, 128, 0.7);
951
+ }
952
+
953
+ .flipbook-find-info {
954
+ padding-left: 10px;
955
+ max-width: 200px;
956
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif !important;
957
+ font-size: 14px;
958
+ pointer-events: none;
959
+ }
960
+
961
+ .invisible {
962
+ opacity: 0;
963
+ pointer-events: none;
964
+ display: none;
965
+ }
966
+
967
+ /* .hidden {
968
+ display: none !important;
969
+ } */
970
+
971
+ .flipbook-hidden {
972
+ display: none !important;
973
+ }
974
+
975
+ .flipbook-overlay-visible {
976
+ opacity: 1;
977
+ }
978
+
979
+ .transition {
980
+ -webkit-transition: all 0.3s ease-out;
981
+ -moz-transition: all 0.3s ease-out;
982
+ -o-transition: all 0.3s ease-out;
983
+ transition: all 0.3s ease-out;
984
+ }
985
+
986
+ .flipbook-share-email {
987
+ background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='at' class='svg-inline--fa fa-at fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='currentColor' d='M256 8C118.941 8 8 118.919 8 256c0 137.059 110.919 248 248 248 48.154 0 95.342-14.14 135.408-40.223 12.005-7.815 14.625-24.288 5.552-35.372l-10.177-12.433c-7.671-9.371-21.179-11.667-31.373-5.129C325.92 429.757 291.314 440 256 440c-101.458 0-184-82.542-184-184S154.542 72 256 72c100.139 0 184 57.619 184 160 0 38.786-21.093 79.742-58.17 83.693-17.349-.454-16.91-12.857-13.476-30.024l23.433-121.11C394.653 149.75 383.308 136 368.225 136h-44.981a13.518 13.518 0 0 0-13.432 11.993l-.01.092c-14.697-17.901-40.448-21.775-59.971-21.775-74.58 0-137.831 62.234-137.831 151.46 0 65.303 36.785 105.87 96 105.87 26.984 0 57.369-15.637 74.991-38.333 9.522 34.104 40.613 34.103 70.71 34.103C462.609 379.41 504 307.798 504 232 504 95.653 394.023 8 256 8zm-21.68 304.43c-22.249 0-36.07-15.623-36.07-40.771 0-44.993 30.779-72.729 58.63-72.729 22.292 0 35.601 15.241 35.601 40.77 0 45.061-33.875 72.73-58.161 72.73z'%3E%3C/path%3E%3C/svg%3E");
988
+ }
989
+
990
+ .flipbook-icon {
991
+ font-style: normal;
992
+ font-weight: normal;
993
+ height: 100%;
994
+ line-height: 1;
995
+ -webkit-font-smoothing: antialiased;
996
+ bottom: 0;
997
+ text-align: center;
998
+ display: flex;
999
+ box-sizing: content-box !important;
1000
+ justify-self: left;
1001
+ }
1002
+
1003
+ .flipbook-icon path {
1004
+ box-sizing: content-box !important;
1005
+ }
1006
+
1007
+ .flipbook-btn-close {
1008
+ height: 40px;
1009
+ width: 40px;
1010
+ position: absolute;
1011
+ top: 0;
1012
+ right: 0;
1013
+ cursor: pointer;
1014
+ display: flex;
1015
+ align-items: center;
1016
+ justify-content: center;
1017
+ }
1018
+
1019
+ .flipbook-btn-close .flipbook-icon {
1020
+ width: 16px;
1021
+ }
1022
+
1023
+ .flipbook-font {
1024
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
1025
+ font-size: 14px;
1026
+ }
1027
+
1028
+ .flipbook-btn {
1029
+ text-transform: uppercase;
1030
+ font-weight: bold;
1031
+ user-select: none;
1032
+ cursor: pointer;
1033
+ width: 200px;
1034
+ line-height: 32px;
1035
+ text-align: center;
1036
+ margin: 5px auto;
1037
+ border: none;
1038
+ background: #f9f9f9;
1039
+ background: none;
1040
+ border-radius: 3px;
1041
+ -webkit-transition: none;
1042
+ -o-transition: none;
1043
+ transition: none;
1044
+ font-size: 12px;
1045
+ }
1046
+
1047
+ .flipbook-bg-gradient {
1048
+ background: #313538dd;
1049
+ }
1050
+
1051
+ .flipbook-color-gradient {
1052
+ color: #eee;
1053
+ fill: #eee;
1054
+ }
1055
+
1056
+ .flipbook-color-gradient:hover {
1057
+ color: #eee;
1058
+ fill: #eee;
1059
+ }
1060
+
1061
+ .flipbook-bg-dark {
1062
+ background: rgb(49, 53, 56);
1063
+ }
1064
+
1065
+ .flipbook-color-dark {
1066
+ color: rgba(255, 255, 255, 0.75);
1067
+ fill: rgba(255, 255, 255, 0.75);
1068
+ }
1069
+
1070
+ .flipbook-color-dark:hover {
1071
+ color: #fff;
1072
+ fill: #fff;
1073
+ }
1074
+
1075
+ .flipbook-bg-light {
1076
+ /* background: rgb(255, 255, 255); */
1077
+ }
1078
+
1079
+ .flipbook-color-light {
1080
+ color: rgba(50, 50, 50, 0.75);
1081
+ fill: rgba(50, 50, 50, 0.75);
1082
+ }
1083
+
1084
+ .flipbook-color-light:hover {
1085
+ color: rgb(50, 50, 50);
1086
+ fill: rgb(50, 50, 50);
1087
+ }
1088
+
1089
+ .flipbook-bg-twilight {
1090
+ background: #141414;
1091
+ }
1092
+
1093
+ .flipbook-color-twilight {
1094
+ color: #feffd3;
1095
+ fill: #feffd3;
1096
+ }
1097
+
1098
+ .flipbook-color-twilight:hover {
1099
+ color: #feffd3;
1100
+ fill: #feffd3;
1101
+ }
1102
+
1103
+ .flipbook-bg-darkgrey {
1104
+ background: #212121;
1105
+ }
1106
+
1107
+ .flipbook-color-darkgrey {
1108
+ color: #9e9e9e;
1109
+ fill: #9e9e9e;
1110
+ }
1111
+
1112
+ .flipbook-color-darkgrey:hover {
1113
+ color: #bdbdbd;
1114
+ fill: #bdbdbd;
1115
+ }
1116
+
1117
+ .flipbook-bg-lightgrey {
1118
+ background: #e0e0e0;
1119
+ }
1120
+
1121
+ .flipbook-color-lightgrey {
1122
+ color: #757575;
1123
+ fill: #757575;
1124
+ }
1125
+
1126
+ .flipbook-color-lightgrey:hover {
1127
+ color: #616161;
1128
+ fill: #616161;
1129
+ }
1130
+
1131
+ .flipbook-sub-menu {
1132
+ position: absolute;
1133
+ top: 0;
1134
+ left: 0;
1135
+ width: 100%;
1136
+ height: 100%;
1137
+ background: rgba(0, 0, 0, 0.5);
1138
+ z-index: 999;
1139
+ }
1140
+
1141
+ .flipbook-sub-menu-center {
1142
+ display: flex;
1143
+ align-items: center;
1144
+ justify-content: center;
1145
+ width: 100%;
1146
+ height: 100%;
1147
+ }
1148
+
1149
+ .flipbook-menu-header {
1150
+ position: relative;
1151
+ padding: 10px;
1152
+ font-size: 16px;
1153
+ text-align: center;
1154
+ }
1155
+
1156
+ .flipbook-menu-title {
1157
+ pointer-events: none;
1158
+ user-select: none;
1159
+ }
1160
+
1161
+ .flipbook-sub-menu-content {
1162
+ display: inline-block;
1163
+ margin-top: -20px;
1164
+ min-width: 250px;
1165
+ padding-bottom: 10px;
1166
+ }
1167
+
1168
+ .flipbook-carousel-slide {
1169
+ -webkit-box-sizing: border-box;
1170
+ -o-box-sizing: border-box;
1171
+ box-sizing: border-box;
1172
+ text-align: center;
1173
+ position: absolute;
1174
+ overflow: hidden;
1175
+ }
1176
+
1177
+ .flipbook-carousel-slide .slide-wrapper {
1178
+ position: absolute;
1179
+ top: 0;
1180
+ left: 0;
1181
+ right: 0;
1182
+ bottom: 0;
1183
+ }
1184
+
1185
+ .flipbook-carousel-page {
1186
+ display: inline-block;
1187
+ background: #f1f1f1;
1188
+ position: relative;
1189
+ -o-transform-origin: 0 0;
1190
+ }
1191
+
1192
+ .flipbook-scroll-page {
1193
+ display: block;
1194
+ background: #f1f1f1;
1195
+ position: relative;
1196
+ }
1197
+
1198
+ .flipbook-carousel-page-inner,
1199
+ .flipbook-scroll-page-inner {
1200
+ -webkit-transform-origin: 0 0;
1201
+ -o-transform-origin: 0 0;
1202
+ transform-origin: 0 0;
1203
+ margin: 0;
1204
+ padding: 0;
1205
+ position: absolute;
1206
+ height: 100%;
1207
+ width: 100%;
1208
+ overflow: hidden;
1209
+ }
1210
+
1211
+ .flipbook-carousel-page-inner canvas,
1212
+ .flipbook-scroll-page-inner {
1213
+ width: 100%;
1214
+ height: 100%;
1215
+ }
1216
+
1217
+ .flipbook-carousel-page img,
1218
+ .flipbook-scroll-page img {
1219
+ top: 0;
1220
+ bottom: 0;
1221
+ right: 0;
1222
+ left: 0;
1223
+ margin: auto;
1224
+ position: absolute;
1225
+ pointer-events: none;
1226
+ user-select: none;
1227
+ max-width: 200%;
1228
+ }
1229
+
1230
+ .flipbook-carousel-page .page-carousel-img,
1231
+ .flipbook-scroll-page .page-scroll-img {
1232
+ height: 100%;
1233
+ }
1234
+
1235
+ /* Hide scrollbar for Chrome, Safari and Opera */
1236
+ .flipbook-overflow-hidden::-webkit-scrollbar {
1237
+ display: none;
1238
+ }
1239
+
1240
+ /* Hide scrollbar for IE, Edge and Firefox */
1241
+
1242
+ .flipbook-overflow-hidden {
1243
+ -ms-overflow-style: none;
1244
+ /* IE and Edge */
1245
+ scrollbar-width: none;
1246
+ /* Firefox */
1247
+ overflow: hidden;
1248
+ }
1249
+
1250
+ /*share*/
1251
+
1252
+ .flipbook-share .social.bottom,
1253
+ .flipbook-share .social.top {
1254
+ -webkit-transform-origin: 0 0;
1255
+ -o-transform-origin: 0 0;
1256
+ }
1257
+
1258
+ .flipbook-share {
1259
+ -webkit-touch-callout: none;
1260
+ -webkit-user-select: none;
1261
+ -moz-user-select: none;
1262
+ -ms-user-select: none;
1263
+ user-select: none;
1264
+ }
1265
+
1266
+ .flipbook-share [class*='entypo-']:before {
1267
+ font-family: entypo, sans-serif;
1268
+ }
1269
+
1270
+ .flipbook-share label {
1271
+ font-size: 16px;
1272
+ cursor: pointer;
1273
+ margin: 0;
1274
+ padding: 5px 10px;
1275
+ border-radius: 5px;
1276
+ background: #a29baa;
1277
+ color: #333;
1278
+ transition: all 0.3s ease;
1279
+ }
1280
+
1281
+ .flipbook-share label:hover {
1282
+ opacity: 0.8;
1283
+ }
1284
+
1285
+ .flipbook-share label span {
1286
+ text-transform: uppercase;
1287
+ font-size: 0.9em;
1288
+ font-family: Lato, sans-serif;
1289
+ font-weight: 700;
1290
+ -webkit-font-smoothing: antialiased;
1291
+ padding-left: 6px;
1292
+ }
1293
+
1294
+ .flipbook-share ul {
1295
+ position: relative;
1296
+ left: 0;
1297
+ right: 0;
1298
+ height: 46px;
1299
+ color: #fff;
1300
+ margin: auto;
1301
+ padding: 0;
1302
+ list-style: none;
1303
+ }
1304
+
1305
+ .flipbook-share ul li {
1306
+ font-size: 16px;
1307
+ cursor: pointer;
1308
+ width: 40px;
1309
+ margin: 0;
1310
+ padding: 9px 0;
1311
+ text-align: center;
1312
+ float: left;
1313
+ height: 22px;
1314
+ position: relative;
1315
+ z-index: 2;
1316
+ -webkit-box-sizing: content-box;
1317
+ box-sizing: content-box;
1318
+ transition: all 0.3s ease;
1319
+ display: flex;
1320
+ align-items: center;
1321
+ justify-content: center;
1322
+ }
1323
+
1324
+ .flipbook-page-preloader {
1325
+ width: auto !important;
1326
+ height: auto !important;
1327
+ }
1328
+
1329
+ .flipbook-page-preloader-image {
1330
+ width: 100%;
1331
+ height: 100%;
1332
+ position: absolute;
1333
+ top: 0;
1334
+ left: 0;
1335
+ }
1336
+
1337
+ /** preloader*/
1338
+
1339
+ .cssload-container {
1340
+ width: 100%;
1341
+ height: 100%;
1342
+ top: 0;
1343
+ left: 0;
1344
+ text-align: center;
1345
+ position: absolute;
1346
+ z-index: 2147483647 !important;
1347
+ pointer-events: none;
1348
+ }
1349
+
1350
+ .cssload-speeding-wheel {
1351
+ width: 24px;
1352
+ height: 24px;
1353
+ /* margin: 0 auto; */
1354
+ border: 3px solid rgba(0, 0, 0, 0.4);
1355
+ border-radius: 50%;
1356
+ border-left-color: rgba(255, 255, 255, 0.2);
1357
+ border-right-color: rgba(255, 255, 255, 0.2);
1358
+ animation: cssload-spin 575ms infinite linear;
1359
+ -o-animation: cssload-spin 575ms infinite linear;
1360
+ -ms-animation: cssload-spin 575ms infinite linear;
1361
+ -webkit-animation: cssload-spin 575ms infinite linear;
1362
+ -moz-animation: cssload-spin 575ms infinite linear;
1363
+ top: 45%;
1364
+ position: absolute;
1365
+ left: 50%;
1366
+ margin-left: -15px;
1367
+ margin-top: -15px;
1368
+ z-index: 3;
1369
+ }
1370
+
1371
+ @keyframes cssload-spin {
1372
+ 100% {
1373
+ transform: rotate(360deg);
1374
+ }
1375
+ }
1376
+
1377
+ @-o-keyframes cssload-spin {
1378
+ 100% {
1379
+ -o-transform: rotate(360deg);
1380
+ transform: rotate(360deg);
1381
+ }
1382
+ }
1383
+
1384
+ @-ms-keyframes cssload-spin {
1385
+ 100% {
1386
+ -ms-transform: rotate(360deg);
1387
+ transform: rotate(360deg);
1388
+ }
1389
+ }
1390
+
1391
+ @-webkit-keyframes cssload-spin {
1392
+ 100% {
1393
+ -webkit-transform: rotate(360deg);
1394
+ transform: rotate(360deg);
1395
+ }
1396
+ }
1397
+
1398
+ @-moz-keyframes cssload-spin {
1399
+ 100% {
1400
+ -moz-transform: rotate(360deg);
1401
+ transform: rotate(360deg);
1402
+ }
1403
+ }
1404
+
1405
+ /**new preloader end*/
1406
+
1407
+ .flipbook-loading-text {
1408
+ position: absolute;
1409
+ top: 45%;
1410
+ margin-top: 20px;
1411
+ width: 100%;
1412
+ font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif !important;
1413
+ font-size: 14px;
1414
+ color: #aaa !important;
1415
+ }
1416
+
1417
+ .flipbook-loading-bg {
1418
+ width: 40px;
1419
+ height: 40px;
1420
+ border-radius: 4px;
1421
+ top: 45%;
1422
+ left: 50%;
1423
+ position: absolute;
1424
+ pointer-events: none;
1425
+ background: rgba(0, 0, 0, 0.2);
1426
+ margin: -20px;
1427
+ display: none;
1428
+ }
1429
+
1430
+ .flipbook-fillPreloader {
1431
+ position: fixed;
1432
+ width: 100%;
1433
+ height: 100%;
1434
+ display: table-cell;
1435
+ text-align: center;
1436
+ vertical-align: middle;
1437
+ pointer-events: none;
1438
+ }
1439
+
1440
+ .flipbook-fillPreloader img {
1441
+ position: absolute;
1442
+ margin: auto;
1443
+ top: 0;
1444
+ left: 0;
1445
+ right: 0;
1446
+ bottom: 0;
1447
+
1448
+ -webkit-transition: all 0.11s ease-out;
1449
+ -moz-transition: all 0.1s ease-out;
1450
+ transition: all 0.1s ease-out;
1451
+ }
1452
+
1453
+ .thumb-btn-close {
1454
+ right: 0;
1455
+ margin: 3px;
1456
+ border-radius: 2px;
1457
+ position: absolute;
1458
+ cursor: pointer;
1459
+ padding: 4px 6px;
1460
+ background: rgba(0, 0, 0, 0.6);
1461
+ }
1462
+
1463
+ .thumb-btn-close:hover {
1464
+ background: rgba(0, 0, 0, 0.8);
1465
+ }
1466
+
1467
+ .flipbook-noselect {
1468
+ -webkit-touch-callout: none;
1469
+ -webkit-user-select: none;
1470
+ -khtml-user-select: none;
1471
+ -moz-user-select: none;
1472
+ -ms-user-select: none;
1473
+ user-select: none;
1474
+ }
1475
+
1476
+ .flipbook-btn-active {
1477
+ background: rgba(128, 128, 128, 0.5);
1478
+ }
1479
+
1480
+ .flipbook-move {
1481
+ cursor: move;
1482
+ /* fallback if move cursor is unsupported */
1483
+ cursor: -webkit-grab;
1484
+ cursor: grab;
1485
+ }
1486
+
1487
+ .flipbook-page-item {
1488
+ bottom: auto;
1489
+ right: auto;
1490
+ position: absolute;
1491
+ -webkit-transition: all 0.2s ease-out;
1492
+ -moz-transition: all 0.2s ease-out;
1493
+ -o-transition: all 0.2s ease-out;
1494
+ transition: all 0.2s ease-out;
1495
+ z-index: 0;
1496
+ }
1497
+
1498
+ .flipbook-page-item iframe {
1499
+ width: 100%;
1500
+ height: 100%;
1501
+ }
1502
+
1503
+ .textLayer mark {
1504
+ background: #ff0;
1505
+ color: transparent !important;
1506
+ padding: 0;
1507
+ }
1508
+
1509
+ .textLayer .mark-blue {
1510
+ background: blue;
1511
+ }
1512
+
1513
+ .textLayer .mark-red {
1514
+ background: red;
1515
+ }
1516
+
1517
+ .textLayer .mark-green {
1518
+ background: green;
1519
+ }
1520
+
1521
+ /*
1522
+ .flipbook-textLayer {
1523
+ position: absolute;
1524
+ left: 0;
1525
+ top: 0;
1526
+ right: 0;
1527
+ bottom: 0;
1528
+ overflow: hidden;
1529
+ opacity: var(--flipbook-link-opacity);
1530
+ line-height: 1;
1531
+ color: #000;
1532
+ pointer-events: none;
1533
+ }
1534
+
1535
+ .flipbook-textLayer br {
1536
+ user-select: none;
1537
+ }
1538
+
1539
+ .flipbook-page-htmlContent * {
1540
+ max-width: initial;
1541
+ }
1542
+
1543
+ .flipbook-page-htmlContent .pageClickArea {
1544
+ position: absolute;
1545
+ width: 5%;
1546
+ height: 100%;
1547
+ top: 0;
1548
+ cursor: pointer;
1549
+ draggable: none;
1550
+ }
1551
+
1552
+ .pageClickAreaLeft {
1553
+ left: 0;
1554
+ }
1555
+
1556
+ .pageClickAreaRight {
1557
+ right: 0;
1558
+ }
1559
+
1560
+ .textLayer mark {
1561
+ background: #ff0;
1562
+ color: transparent;
1563
+ }
1564
+
1565
+ .textLayer .mark-blue {
1566
+ background: blue;
1567
+ }
1568
+
1569
+ .textLayer .mark-red {
1570
+ background: red;
1571
+ }
1572
+
1573
+ .textLayer .mark-green {
1574
+ background: green;
1575
+ }
1576
+
1577
+ .textLayer > span {
1578
+ color: transparent !important;
1579
+ position: absolute;
1580
+ white-space: pre;
1581
+ cursor: text;
1582
+ -webkit-transform-origin: 0 0;
1583
+ -moz-transform-origin: 0% 0%;
1584
+ -o-transform-origin: 0% 0%;
1585
+ -ms-transform-origin: 0% 0%;
1586
+ transform-origin: 0 0;
1587
+ }
1588
+
1589
+ .textLayer > span::selection {
1590
+ color: transparent !important;
1591
+ }
1592
+
1593
+ .textLayer > div {
1594
+ color: transparent !important;
1595
+ position: absolute;
1596
+ white-space: pre;
1597
+ cursor: text;
1598
+ -webkit-transform-origin: 0 0;
1599
+ -moz-transform-origin: 0% 0%;
1600
+ -o-transform-origin: 0% 0%;
1601
+ -ms-transform-origin: 0% 0%;
1602
+ transform-origin: 0 0;
1603
+ }
1604
+
1605
+ .textLayer .highlight {
1606
+ margin: -1px;
1607
+ padding: 1px;
1608
+ background-color: rgb(180, 0, 170);
1609
+ border-radius: 4px;
1610
+ }
1611
+
1612
+ .textLayer .highlight.begin {
1613
+ border-radius: 4px 0 0 4px;
1614
+ }
1615
+
1616
+ .textLayer .highlight.end {
1617
+ border-radius: 0 4px 4px 0;
1618
+ }
1619
+
1620
+ .textLayer .highlight.middle {
1621
+ border-radius: 0;
1622
+ }
1623
+
1624
+ .textLayer .highlight.selected {
1625
+ background-color: rgb(0, 100, 0);
1626
+ }
1627
+
1628
+ .textLayer ::selection {
1629
+ background: rgb(0, 0, 255);
1630
+ }
1631
+
1632
+ .textLayer ::-moz-selection {
1633
+ background: rgb(0, 0, 255);
1634
+ }
1635
+
1636
+ .textLayer .endOfContent {
1637
+ background: initial;
1638
+ display: block;
1639
+ position: absolute;
1640
+ left: 0;
1641
+ top: 100%;
1642
+ right: 0;
1643
+ bottom: 0;
1644
+ z-index: -1;
1645
+ cursor: default;
1646
+ -webkit-user-select: none;
1647
+ -ms-user-select: none;
1648
+ -moz-user-select: none;
1649
+ }
1650
+
1651
+ .textLayer .endOfContent.active {
1652
+ top: 0;
1653
+ }
1654
+
1655
+ .flipbook-disable-text-selection {
1656
+ -webkit-touch-callout: none;
1657
+ -webkit-user-select: none;
1658
+ -khtml-user-select: none;
1659
+ -moz-user-select: none;
1660
+ -ms-user-select: none;
1661
+ user-select: none;
1662
+ }
1663
+
1664
+ .annotationLayer section {
1665
+ position: absolute;
1666
+ padding: 0;
1667
+ margin: 0;
1668
+ background: none;
1669
+ } */
1670
+
1671
+ .flipbook-page-html .pageClickArea {
1672
+ position: absolute;
1673
+ width: 50px;
1674
+ height: 50px;
1675
+ bottom: 0;
1676
+ cursor: pointer;
1677
+ z-index: 20;
1678
+ }
1679
+
1680
+ .pageClickAreaLeft {
1681
+ left: 0;
1682
+ }
1683
+
1684
+ .pageClickAreaRight {
1685
+ /* right: 0; */
1686
+ }
1687
+
1688
+ .annotationLayer .linkAnnotation > a,
1689
+ .annotationLayer .buttonWidgetAnnotation.pushButton > a,
1690
+ .flipbook-page-item-link {
1691
+ position: absolute;
1692
+ font-size: 1em;
1693
+ top: 0;
1694
+ left: 0;
1695
+ width: 100%;
1696
+ height: 100%;
1697
+ background: var(--flipbook-link-color);
1698
+ animation-duration: 2000ms;
1699
+ animation-delay: 500ms;
1700
+ animation-name: flashLinks;
1701
+ opacity: var(--flipbook-link-opacity);
1702
+ }
1703
+
1704
+ .flipbook-page-auto-link {
1705
+ background: var(--flipbook-link-color);
1706
+ color: transparent !important;
1707
+ animation-duration: 2000ms;
1708
+ animation-delay: 500ms;
1709
+ animation-name: flashLinks;
1710
+ pointer-events: auto;
1711
+ }
1712
+
1713
+ .flipbook-page-auto-link-hover {
1714
+ background: var(--flipbook-link-color-hover) !important;
1715
+ color: transparent !important;
1716
+ }
1717
+
1718
+ @keyframes flashLinks {
1719
+ 0% {
1720
+ background: var(--flipbook-link-color);
1721
+ }
1722
+
1723
+ 20% {
1724
+ background: var(--flipbook-link-color-hover);
1725
+ }
1726
+
1727
+ 100% {
1728
+ background: var(--flipbook-link-color);
1729
+ }
1730
+ }
1731
+
1732
+ .flipbook-tooltip {
1733
+ position: absolute;
1734
+ background: rgba(0, 0, 0, 0.8);
1735
+ top: 300px;
1736
+ left: 300px;
1737
+ color: white;
1738
+ padding: 6px 12px;
1739
+ font-size: 13px;
1740
+ line-height: 13px;
1741
+ font-weight: normal;
1742
+ white-space: nowrap;
1743
+ text-align: center;
1744
+ -webkit-transition: opacity 0.2s ease-in;
1745
+ transition: opacity 0.2s ease-in;
1746
+ z-index: 10000;
1747
+ }
1748
+
1749
+ .flipbook-submenu {
1750
+ position: absolute;
1751
+ right: 0;
1752
+ width: max-content;
1753
+ text-wrap: nowrap;
1754
+ }
1755
+
1756
+ .flipbook-menuTop .flipbook-submenu {
1757
+ top: calc(100% + 5px);
1758
+ }
1759
+
1760
+ .flipbook-menuBottom .flipbook-submenu {
1761
+ bottom: calc(100% + 5px);
1762
+ }
1763
+
1764
+ .flipbook-menuTop * {
1765
+ box-sizing: content-box !important;
1766
+ }
1767
+
1768
+ .flipbook-menuBottom * {
1769
+ box-sizing: content-box !important;
1770
+ }
1771
+
1772
+ .flipbook-add-note-rect {
1773
+ position: absolute;
1774
+ pointer-events: none;
1775
+ }
1776
+
1777
+ .add-note-btn {
1778
+ pointer-events: auto;
1779
+ }
1780
+
1781
+ .flipbook-add-note-rect .add-note-btn {
1782
+ background: rgba(0, 0, 0, 0.8);
1783
+ border-radius: 0.25em;
1784
+ color: white;
1785
+ padding: 0.3em 1em;
1786
+ text-shadow: 0 1px 0 #000;
1787
+ font-weight: normal;
1788
+ white-space: nowrap;
1789
+ text-align: center;
1790
+ z-index: 10000;
1791
+ left: 50%;
1792
+ transform: translateX(-50%) translateY(-120%);
1793
+ pointer-events: auto;
1794
+ cursor: pointer;
1795
+ position: absolute;
1796
+ opacity: 0;
1797
+ }
1798
+
1799
+ .flipbook-add-note-rect.hover .add-note-btn {
1800
+ opacity: 1;
1801
+ pointer-events: auto;
1802
+ }
1803
+
1804
+ .flipbook-note-display {
1805
+ width: 230px;
1806
+ height: 125px;
1807
+ position: absolute;
1808
+ background-color: #fafafa;
1809
+ -webkit-box-shadow: 0 2px 10px 0 rgb(27 47 73 / 30%);
1810
+ box-shadow: 0 2px 10px 0 rgb(27 47 73 / 30%);
1811
+ border-radius: 5px;
1812
+ pointer-events: auto;
1813
+ top: 0;
1814
+ left: 50%;
1815
+ transform: translateX(-50%);
1816
+ }
1817
+
1818
+ .flipbook-note-display .note-content {
1819
+ height: 76px;
1820
+ position: absolute;
1821
+ width: 210px;
1822
+ margin: 11px 15px 5px 15px;
1823
+ overflow: hidden;
1824
+ }
1825
+
1826
+ .flipbook-note-display .note-article {
1827
+ font-family: inherit;
1828
+ resize: none;
1829
+ font-size: 14px;
1830
+ width: 200px;
1831
+ height: 76px;
1832
+ position: absolute;
1833
+ left: 0;
1834
+ top: 0;
1835
+ border-width: 1px;
1836
+ border-style: solid;
1837
+ padding: 0;
1838
+ color: rgb(89, 97, 104);
1839
+ border-color: transparent;
1840
+ background-color: transparent;
1841
+ outline: none !important;
1842
+ }
1843
+
1844
+ .flipbook-note-display .note-article:focus {
1845
+ box-shadow: none;
1846
+ }
1847
+
1848
+ .flipbook-note-display .note-delete-button .svg-icon {
1849
+ width: 22px;
1850
+ height: 22px;
1851
+ fill: #a6aaad;
1852
+ }
1853
+
1854
+ .flipbook-note-display .note-button {
1855
+ float: right;
1856
+ font-size: 22px;
1857
+ line-height: 22px;
1858
+ height: 22px;
1859
+ color: #8d8d8d;
1860
+ cursor: pointer;
1861
+ text-align: center;
1862
+ margin: 5px 11px;
1863
+ }
1864
+
1865
+ .flipbook-note-display .note-footer {
1866
+ height: 37px;
1867
+ width: 100%;
1868
+ margin: 0;
1869
+ bottom: 0;
1870
+ position: absolute;
1871
+ }
1872
+
1873
+ .flipbook-page-note {
1874
+ pointer-events: auto;
1875
+ cursor: pointer;
1876
+ }
1877
+
1878
+ .annotationLayer .linkAnnotation > a:hover,
1879
+ .annotationLayer .buttonWidgetAnnotation.pushButton > a:hover,
1880
+ .flipbook-page-item-link:hover {
1881
+ background: var(--flipbook-link-color-hover) !important;
1882
+ color: transparent !important;
1883
+ }
1884
+
1885
+ .flipbook-page-auto-link:hover {
1886
+ background: var(--flipbook-link-color-hover) !important;
1887
+ color: transparent !important;
1888
+ }
1889
+
1890
+ .flipbook-note-display {
1891
+ opacity: 1;
1892
+ }
1893
+
1894
+ .flipbook-spotlight-overlay {
1895
+ position: absolute;
1896
+ top: 0;
1897
+ left: 0;
1898
+ width: 100%;
1899
+ height: 100%;
1900
+ background-color: rgb(0, 0, 0, 0.88);
1901
+ display: flex;
1902
+ justify-content: center;
1903
+ align-items: center;
1904
+ flex-direction: column;
1905
+ z-index: 10002;
1906
+ }
1907
+
1908
+ .flipbook-spotlight-overlay img {
1909
+ max-width: 80%;
1910
+ max-height: 80%;
1911
+ box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
1912
+ }
1913
+
1914
+ .flipbook-spotlight-close-button {
1915
+ position: absolute;
1916
+ top: 10px;
1917
+ right: 10px;
1918
+ background: rgba(0, 0, 0, 0.8);
1919
+ border-radius: 2px;
1920
+ border: none;
1921
+ cursor: pointer;
1922
+ padding: 0;
1923
+ width: 24px;
1924
+ height: 24px;
1925
+ z-index: 1;
1926
+ }
1927
+
1928
+ .flipbook-spotlight-close-button:hover {
1929
+ opacity: 0.7;
1930
+ }
1931
+
1932
+ .flipbook-spotlight-caption-container {
1933
+ color: white;
1934
+ text-align: center;
1935
+ font-size: 16px;
1936
+ line-height: 1.6;
1937
+ padding: 15px;
1938
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
1939
+ margin-top: 10px;
1940
+ }
1941
+
1942
+ .flipbook-spotlight-title {
1943
+ font-weight: bold;
1944
+ font-size: 18px;
1945
+ margin-bottom: 5px;
1946
+ }
1947
+
1948
+ .flipbook-spotlight-description {
1949
+ font-size: 14px;
1950
+ font-weight: normal;
1951
+ }
1952
+
1953
+ .flipbook-page-html {
1954
+ position: absolute;
1955
+ top: 0;
1956
+ left: 0;
1957
+ bottom: 0;
1958
+ width: 100%;
1959
+ }
1960
+
1961
+ .flipbook-page-html .htmlContent {
1962
+ position: absolute;
1963
+ height: 100%;
1964
+ width: 100%;
1965
+ z-index: 4;
1966
+ pointer-events: none;
1967
+ }
1968
+
1969
+ .flipbook-page-html .htmlContent * {
1970
+ pointer-events: auto;
1971
+ }
1972
+
1973
+ .flipbook-page3-inner[data-visible='false'] .htmlContent * {
1974
+ pointer-events: none !important;
1975
+ }
1976
+
1977
+ .flipbook-page-html .textLayer {
1978
+ position: absolute;
1979
+ text-align: initial;
1980
+ inset: 0;
1981
+ overflow: hidden;
1982
+ opacity: 0.25;
1983
+ line-height: 1;
1984
+ -webkit-text-size-adjust: none;
1985
+ -moz-text-size-adjust: none;
1986
+ text-size-adjust: none;
1987
+ forced-color-adjust: none;
1988
+ transform-origin: 0 0;
1989
+ z-index: 2;
1990
+ font-weight: initial;
1991
+ }
1992
+
1993
+ .flipbook-page-html .textLayer :is(span, br) {
1994
+ color: transparent !important;
1995
+ position: absolute;
1996
+ white-space: pre;
1997
+ cursor: text;
1998
+ transform-origin: 0% 0%;
1999
+ }
2000
+
2001
+ /* Only necessary in Google Chrome, see issue 14205, and most unfortunately
2002
+ * the problem doesn't show up in "text" reference tests. */
2003
+ .flipbook-page-html .textLayer span.markedContent {
2004
+ top: 0;
2005
+ height: 0;
2006
+ }
2007
+
2008
+ .flipbook-page-html .textLayer .highlight {
2009
+ margin: -1px;
2010
+ padding: 1px;
2011
+ background-color: var(--highlight-bg-color);
2012
+ border-radius: 4px;
2013
+ }
2014
+
2015
+ .flipbook-page-html .textLayer .highlight.appended {
2016
+ position: initial;
2017
+ }
2018
+
2019
+ .flipbook-page-html .textLayer .highlight.begin {
2020
+ border-radius: 4px 0 0 4px;
2021
+ }
2022
+
2023
+ .flipbook-page-html .textLayer .highlight.end {
2024
+ border-radius: 0 4px 4px 0;
2025
+ }
2026
+
2027
+ .flipbook-page-html .textLayer .highlight.middle {
2028
+ border-radius: 0;
2029
+ }
2030
+
2031
+ .flipbook-page-html .textLayer .highlight.selected {
2032
+ background-color: var(--highlight-selected-bg-color);
2033
+ }
2034
+
2035
+ .flipbook-page-html .textLayer ::-moz-selection {
2036
+ background: blue;
2037
+ background: AccentColor; /* stylelint-disable-line declaration-block-no-duplicate-properties */
2038
+ }
2039
+
2040
+ .flipbook-page-html .textLayer ::selection {
2041
+ background: blue;
2042
+ background: AccentColor; /* stylelint-disable-line declaration-block-no-duplicate-properties */
2043
+ }
2044
+
2045
+ /* Avoids https://github.com/mozilla/pdf.js/issues/13840 in Chrome */
2046
+ .flipbook-page-html .textLayer br::-moz-selection {
2047
+ background: transparent;
2048
+ }
2049
+ .flipbook-page-html .textLayer br::selection {
2050
+ background: transparent;
2051
+ }
2052
+
2053
+ .flipbook-page-html .textLayer .endOfContent {
2054
+ display: block;
2055
+ position: absolute;
2056
+ inset: 100% 0 0;
2057
+ z-index: -1;
2058
+ cursor: default;
2059
+ -webkit-user-select: none;
2060
+ -moz-user-select: none;
2061
+ user-select: none;
2062
+ }
2063
+
2064
+ .flipbook-page-html .textLayer .endOfContent.active {
2065
+ top: 0;
2066
+ }
2067
+
2068
+ :root {
2069
+ --annotation-unfocused-field-background: url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
2070
+ --input-focus-border-color: Highlight;
2071
+ --input-focus-outline: 1px solid Canvas;
2072
+ --input-unfocused-border-color: transparent;
2073
+ --input-disabled-border-color: transparent;
2074
+ --input-hover-border-color: black;
2075
+ --link-outline: none;
2076
+ }
2077
+
2078
+ @media screen and (forced-colors: active) {
2079
+ :root {
2080
+ --input-focus-border-color: CanvasText;
2081
+ --input-unfocused-border-color: ActiveText;
2082
+ --input-disabled-border-color: GrayText;
2083
+ --input-hover-border-color: Highlight;
2084
+ --link-outline: 1.5px solid LinkText;
2085
+ --hcm-highligh-filter: invert(100%);
2086
+ }
2087
+ .annotationLayer .textWidgetAnnotation :is(input, textarea):required,
2088
+ .annotationLayer .choiceWidgetAnnotation select:required,
2089
+ .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:required {
2090
+ outline: 1.5px solid selectedItem;
2091
+ }
2092
+
2093
+ .annotationLayer .linkAnnotation:hover {
2094
+ -webkit-backdrop-filter: var(--hcm-highligh-filter);
2095
+ backdrop-filter: var(--hcm-highligh-filter);
2096
+ }
2097
+
2098
+ .annotationLayer .linkAnnotation > a:hover {
2099
+ opacity: 0 !important;
2100
+ background: none !important;
2101
+ box-shadow: none;
2102
+ }
2103
+
2104
+ .annotationLayer .popupAnnotation .popup {
2105
+ outline: calc(1.5px * var(--scale-factor)) solid CanvasText !important;
2106
+ background-color: ButtonFace !important;
2107
+ color: ButtonText !important;
2108
+ }
2109
+
2110
+ .annotationLayer .highlightArea:hover::after {
2111
+ position: absolute;
2112
+ top: 0;
2113
+ left: 0;
2114
+ width: 100%;
2115
+ height: 100%;
2116
+ -webkit-backdrop-filter: var(--hcm-highligh-filter);
2117
+ backdrop-filter: var(--hcm-highligh-filter);
2118
+ content: '';
2119
+ pointer-events: none;
2120
+ }
2121
+
2122
+ .annotationLayer .popupAnnotation.focused .popup {
2123
+ outline: calc(3px * var(--scale-factor)) solid Highlight !important;
2124
+ }
2125
+ }
2126
+
2127
+ .annotationLayer {
2128
+ position: absolute;
2129
+ top: 0;
2130
+ left: 0;
2131
+ pointer-events: none;
2132
+ transform-origin: 0 0;
2133
+ z-index: 3;
2134
+ }
2135
+
2136
+ .annotationLayer[data-main-rotation='90'] .norotate {
2137
+ transform: rotate(270deg) translateX(-100%);
2138
+ }
2139
+ .annotationLayer[data-main-rotation='180'] .norotate {
2140
+ transform: rotate(180deg) translate(-100%, -100%);
2141
+ }
2142
+ .annotationLayer[data-main-rotation='270'] .norotate {
2143
+ transform: rotate(90deg) translateY(-100%);
2144
+ }
2145
+
2146
+ .annotationLayer canvas {
2147
+ position: absolute;
2148
+ width: 100%;
2149
+ height: 100%;
2150
+ pointer-events: none;
2151
+ }
2152
+
2153
+ .annotationLayer section {
2154
+ position: absolute;
2155
+ text-align: initial;
2156
+ pointer-events: auto;
2157
+ box-sizing: border-box;
2158
+ transform-origin: 0 0;
2159
+ }
2160
+
2161
+ .annotationLayer .linkAnnotation {
2162
+ outline: var(--link-outline);
2163
+ }
2164
+
2165
+ .annotationLayer :is(.linkAnnotation, .buttonWidgetAnnotation.pushButton) > a {
2166
+ position: absolute;
2167
+ font-size: 1em;
2168
+ top: 0;
2169
+ left: 0;
2170
+ width: 100%;
2171
+ height: 100%;
2172
+ }
2173
+
2174
+ .annotationLayer :is(.linkAnnotation, .buttonWidgetAnnotation.pushButton):not(.hasBorder) > a:hover {
2175
+ /* opacity: 0.2;
2176
+ background-color: rgba(255, 255, 0, 1);
2177
+ box-shadow: 0 2px 10px rgba(255, 255, 0, 1); */
2178
+ }
2179
+
2180
+ .annotationLayer .linkAnnotation.hasBorder:hover {
2181
+ background-color: rgba(255, 255, 0, 0.2);
2182
+ }
2183
+
2184
+ .annotationLayer .hasBorder {
2185
+ background-size: 100% 100%;
2186
+ }
2187
+
2188
+ .annotationLayer .textAnnotation img {
2189
+ position: absolute;
2190
+ cursor: pointer;
2191
+ width: 100%;
2192
+ height: 100%;
2193
+ top: 0;
2194
+ left: 0;
2195
+ }
2196
+
2197
+ .annotationLayer .textWidgetAnnotation :is(input, textarea),
2198
+ .annotationLayer .choiceWidgetAnnotation select,
2199
+ .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input {
2200
+ background-image: var(--annotation-unfocused-field-background);
2201
+ border: 2px solid var(--input-unfocused-border-color);
2202
+ box-sizing: border-box;
2203
+ font: calc(9px * var(--scale-factor)) sans-serif;
2204
+ height: 100%;
2205
+ margin: 0;
2206
+ vertical-align: top;
2207
+ width: 100%;
2208
+ }
2209
+
2210
+ .annotationLayer .textWidgetAnnotation :is(input, textarea):required,
2211
+ .annotationLayer .choiceWidgetAnnotation select:required,
2212
+ .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:required {
2213
+ outline: 1.5px solid red;
2214
+ }
2215
+
2216
+ .annotationLayer .choiceWidgetAnnotation select option {
2217
+ padding: 0;
2218
+ }
2219
+
2220
+ .annotationLayer .buttonWidgetAnnotation.radioButton input {
2221
+ border-radius: 50%;
2222
+ }
2223
+
2224
+ .annotationLayer .textWidgetAnnotation textarea {
2225
+ resize: none;
2226
+ }
2227
+
2228
+ .annotationLayer .textWidgetAnnotation :is(input, textarea)[disabled],
2229
+ .annotationLayer .choiceWidgetAnnotation select[disabled],
2230
+ .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input[disabled] {
2231
+ background: none;
2232
+ border: 2px solid var(--input-disabled-border-color);
2233
+ cursor: not-allowed;
2234
+ }
2235
+
2236
+ .annotationLayer .textWidgetAnnotation :is(input, textarea):hover,
2237
+ .annotationLayer .choiceWidgetAnnotation select:hover,
2238
+ .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:hover {
2239
+ border: 2px solid var(--input-hover-border-color);
2240
+ }
2241
+ .annotationLayer .textWidgetAnnotation :is(input, textarea):hover,
2242
+ .annotationLayer .choiceWidgetAnnotation select:hover,
2243
+ .annotationLayer .buttonWidgetAnnotation.checkBox input:hover {
2244
+ border-radius: 2px;
2245
+ }
2246
+
2247
+ .annotationLayer .textWidgetAnnotation :is(input, textarea):focus,
2248
+ .annotationLayer .choiceWidgetAnnotation select:focus {
2249
+ background: none;
2250
+ border: 2px solid var(--input-focus-border-color);
2251
+ border-radius: 2px;
2252
+ outline: var(--input-focus-outline);
2253
+ }
2254
+
2255
+ .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) :focus {
2256
+ background-image: none;
2257
+ background-color: transparent;
2258
+ }
2259
+
2260
+ .annotationLayer .buttonWidgetAnnotation.checkBox :focus {
2261
+ border: 2px solid var(--input-focus-border-color);
2262
+ border-radius: 2px;
2263
+ outline: var(--input-focus-outline);
2264
+ }
2265
+
2266
+ .annotationLayer .buttonWidgetAnnotation.radioButton :focus {
2267
+ border: 2px solid var(--input-focus-border-color);
2268
+ outline: var(--input-focus-outline);
2269
+ }
2270
+
2271
+ .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,
2272
+ .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after,
2273
+ .annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before {
2274
+ background-color: CanvasText;
2275
+ content: '';
2276
+ display: block;
2277
+ position: absolute;
2278
+ }
2279
+
2280
+ .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,
2281
+ .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after {
2282
+ height: 80%;
2283
+ left: 45%;
2284
+ width: 1px;
2285
+ }
2286
+
2287
+ .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before {
2288
+ transform: rotate(45deg);
2289
+ }
2290
+
2291
+ .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after {
2292
+ transform: rotate(-45deg);
2293
+ }
2294
+
2295
+ .annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before {
2296
+ border-radius: 50%;
2297
+ height: 50%;
2298
+ left: 30%;
2299
+ top: 20%;
2300
+ width: 50%;
2301
+ }
2302
+
2303
+ .annotationLayer .textWidgetAnnotation input.comb {
2304
+ font-family: monospace;
2305
+ padding-left: 2px;
2306
+ padding-right: 0;
2307
+ }
2308
+
2309
+ .annotationLayer .textWidgetAnnotation input.comb:focus {
2310
+ /*
2311
+ * Letter spacing is placed on the right side of each character. Hence, the
2312
+ * letter spacing of the last character may be placed outside the visible
2313
+ * area, causing horizontal scrolling. We avoid this by extending the width
2314
+ * when the element has focus and revert this when it loses focus.
2315
+ */
2316
+ width: 103%;
2317
+ }
2318
+
2319
+ .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input {
2320
+ -webkit-appearance: none;
2321
+ -moz-appearance: none;
2322
+ appearance: none;
2323
+ }
2324
+
2325
+ .annotationLayer .fileAttachmentAnnotation .popupTriggerArea {
2326
+ height: 100%;
2327
+ width: 100%;
2328
+ }
2329
+
2330
+ .annotationLayer .popupAnnotation {
2331
+ position: absolute;
2332
+ font-size: calc(9px * var(--scale-factor));
2333
+ pointer-events: none;
2334
+ width: -moz-max-content;
2335
+ width: max-content;
2336
+ max-width: 45%;
2337
+ height: auto;
2338
+ }
2339
+
2340
+ .annotationLayer .popup {
2341
+ background-color: rgba(255, 255, 153, 1);
2342
+ box-shadow: 0 calc(2px * var(--scale-factor)) calc(5px * var(--scale-factor)) rgba(136, 136, 136, 1);
2343
+ border-radius: calc(2px * var(--scale-factor));
2344
+ outline: 1.5px solid rgb(255, 255, 74);
2345
+ padding: calc(6px * var(--scale-factor));
2346
+ cursor: pointer;
2347
+ font: message-box;
2348
+ white-space: normal;
2349
+ word-wrap: break-word;
2350
+ pointer-events: auto;
2351
+ }
2352
+
2353
+ .annotationLayer .popupAnnotation.focused .popup {
2354
+ outline-width: 3px;
2355
+ }
2356
+
2357
+ .annotationLayer .popup * {
2358
+ font-size: calc(9px * var(--scale-factor));
2359
+ }
2360
+
2361
+ .annotationLayer .popup > .header {
2362
+ display: inline-block;
2363
+ }
2364
+
2365
+ .annotationLayer .popup > .header h1 {
2366
+ display: inline;
2367
+ }
2368
+
2369
+ .annotationLayer .popup > .header .popupDate {
2370
+ display: inline-block;
2371
+ margin-left: calc(5px * var(--scale-factor));
2372
+ width: -moz-fit-content;
2373
+ width: fit-content;
2374
+ }
2375
+
2376
+ .annotationLayer .popupContent {
2377
+ border-top: 1px solid rgba(51, 51, 51, 1);
2378
+ margin-top: calc(2px * var(--scale-factor));
2379
+ padding-top: calc(2px * var(--scale-factor));
2380
+ }
2381
+
2382
+ .annotationLayer .richText > * {
2383
+ white-space: pre-wrap;
2384
+ font-size: calc(9px * var(--scale-factor));
2385
+ }
2386
+
2387
+ .annotationLayer .popupTriggerArea {
2388
+ cursor: pointer;
2389
+ }
2390
+
2391
+ .annotationLayer section svg {
2392
+ position: absolute;
2393
+ width: 100%;
2394
+ height: 100%;
2395
+ top: 0;
2396
+ left: 0;
2397
+ }
2398
+
2399
+ .annotationLayer .annotationTextContent {
2400
+ position: absolute;
2401
+ width: 100%;
2402
+ height: 100%;
2403
+ opacity: 0;
2404
+ color: transparent !important;
2405
+ -webkit-user-select: none;
2406
+ -moz-user-select: none;
2407
+ user-select: none;
2408
+ pointer-events: none;
2409
+ }
2410
+
2411
+ .annotationLayer .annotationTextContent span {
2412
+ width: 100%;
2413
+ display: inline-block;
2414
+ }
2415
+
2416
+ .annotationLayer svg.quadrilateralsContainer {
2417
+ contain: strict;
2418
+ width: 0;
2419
+ height: 0;
2420
+ position: absolute;
2421
+ top: 0;
2422
+ left: 0;
2423
+ z-index: -1;
2424
+ }
2425
+
2426
+ /* print.js https://github.com/crabbly/Print.js/releases/tag/v1.5.0 */
2427
+ .printModal {
2428
+ font-family: sans-serif;
2429
+ display: flex;
2430
+ text-align: center;
2431
+ font-weight: 300;
2432
+ font-size: 30px;
2433
+ left: 0;
2434
+ top: 0;
2435
+ position: absolute;
2436
+ color: #045fb4;
2437
+ width: 100%;
2438
+ height: 100%;
2439
+ background-color: hsla(0, 0%, 100%, 0.9);
2440
+ }
2441
+
2442
+ .printClose {
2443
+ position: absolute;
2444
+ right: 10px;
2445
+ top: 10px;
2446
+ }
2447
+
2448
+ .printClose:before {
2449
+ content: '\00D7';
2450
+ font-family:
2451
+ Helvetica Neue,
2452
+ sans-serif;
2453
+ font-weight: 100;
2454
+ line-height: 1px;
2455
+ padding-top: 0.5em;
2456
+ display: block;
2457
+ font-size: 2em;
2458
+ text-indent: 1px;
2459
+ overflow: hidden;
2460
+ height: 1.25em;
2461
+ width: 1.25em;
2462
+ text-align: center;
2463
+ cursor: pointer;
2464
+ }
2465
+
2466
+ .printSpinner {
2467
+ margin-top: 3px;
2468
+ margin-left: -40px;
2469
+ position: absolute;
2470
+ display: inline-block;
2471
+ width: 25px;
2472
+ height: 25px;
2473
+ border: 2px solid #045fb4;
2474
+ border-radius: 50%;
2475
+ animation: spin 0.75s linear infinite;
2476
+ }
2477
+
2478
+ .printSpinner:after,
2479
+ .printSpinner:before {
2480
+ left: -2px;
2481
+ top: -2px;
2482
+ display: none;
2483
+ position: absolute;
2484
+ content: '';
2485
+ width: inherit;
2486
+ height: inherit;
2487
+ border: inherit;
2488
+ border-radius: inherit;
2489
+ }
2490
+
2491
+ .printSpinner,
2492
+ .printSpinner:after,
2493
+ .printSpinner:before {
2494
+ display: inline-block;
2495
+ border-color: #045fb4 transparent transparent;
2496
+ animation-duration: 1.2s;
2497
+ }
2498
+
2499
+ .printSpinner:before {
2500
+ transform: rotate(120deg);
2501
+ }
2502
+
2503
+ .printSpinner:after {
2504
+ transform: rotate(240deg);
2505
+ }
2506
+
2507
+ @keyframes spin {
2508
+ 0% {
2509
+ transform: rotate(0deg);
2510
+ }
2511
+
2512
+ to {
2513
+ transform: rotate(1turn);
2514
+ }
2515
+ }
flipbook.js ADDED
The diff for this file is too large to render. See raw diff
 
flipbook.scroll.js ADDED
@@ -0,0 +1,539 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /*
2
+ * Real3D FlipBook [https://real3dflipbook.com]
3
+ * @author creativeinteractivemedia [https://codecanyon.net/user/creativeinteractivemedia/portfolio]
4
+ * @version 4.10
5
+ * @date 2025-05-15
6
+ */
7
+ 'use strict';
8
+ var FLIPBOOK = FLIPBOOK || {};
9
+
10
+ FLIPBOOK.BookScroll = function (el, wrapper, main, options) {
11
+ this.options = options;
12
+ this.main = main;
13
+ this.singlePage = options.singlePageMode;
14
+ if (this.singlePage) {
15
+ this.view = 1;
16
+ }
17
+ this.view = 1;
18
+
19
+ this.pageWidth = options.pageWidth;
20
+ this.pageHeight = options.pageHeight;
21
+ this.rightIndex = 0;
22
+
23
+ this.pageGap = 16;
24
+
25
+ this.slides = [];
26
+ this.pagesArr = [];
27
+ this.leftPage = 0;
28
+ this.rightPage = 0;
29
+ this.rotation = 0;
30
+
31
+ this.verticalScroller = el;
32
+
33
+ this.verticalScroller.style.width = this.pageWidth + 'px';
34
+
35
+ options.pageGap = this.pageGap;
36
+
37
+ for (let i = 0; i < options.numPages; i++) {
38
+ const page = new FLIPBOOK.PageScroll(this, wrapper, main, options, i);
39
+ this.verticalScroller.appendChild(page.wrapper);
40
+ page.initObserver();
41
+ this.pagesArr.push(page);
42
+ }
43
+
44
+ //make new div that has width equal to page width, height equal to page height * number of pages
45
+
46
+ this.prevPageEnabled = false;
47
+
48
+ this.setRightIndex(0);
49
+ this.currentSlide = 0;
50
+ this.flipping = false;
51
+
52
+ this.wrapper = wrapper;
53
+
54
+ this.verticalScroller.classList.remove('book');
55
+ this.verticalScroller.style.paddingTop = this.pageGap / 2 + 'px';
56
+ this.verticalScroller.style.paddingBottom = this.pageGap / 2 + 'px';
57
+ this.iscroll = new IScroll(this.wrapper, {
58
+ freeScroll: true,
59
+ mouseWheel: true,
60
+ scrollbars: true,
61
+ interactiveScrollbars: true,
62
+ zoom: true,
63
+ scrollX: true,
64
+ scrollY: true,
65
+ keepInCenterV: true,
66
+ keepInCenterH: true,
67
+ preventDefault: false,
68
+ zoomMin: 0.01,
69
+ zoomMax: 10,
70
+ mouseWheelTimeout: 100,
71
+ disablePointer: false,
72
+ disableTouch: false,
73
+ disableMouse: false,
74
+ momentum: true,
75
+ });
76
+
77
+ this.main.on('disableIScroll', () => {
78
+ this.disableIscroll();
79
+ });
80
+ this.main.on('enableIScroll', () => {
81
+ this.enableIscroll();
82
+ });
83
+
84
+ var self = this;
85
+
86
+ this.iscroll.on('scrollStart', function () {
87
+ self.scrolling = true;
88
+ });
89
+
90
+ this.iscroll.on('zoomEnd', function () {
91
+ self.updateRightIndex();
92
+ });
93
+
94
+ this.iscroll.on('scrollEnd', function () {
95
+ self.updateRightIndex();
96
+ self.scrolling = false;
97
+ self.pagesArr.forEach((page) => {
98
+ if (page.visibility > 0) {
99
+ page.load();
100
+ }
101
+ });
102
+ });
103
+
104
+ this.zoomDisabled = false;
105
+
106
+ main.on('pageLoaded', function (_) {});
107
+ };
108
+
109
+ FLIPBOOK.BookScroll.prototype = Object.create(FLIPBOOK.Book.prototype);
110
+
111
+ FLIPBOOK.BookScroll.prototype.constructor = FLIPBOOK.BookScroll;
112
+
113
+ FLIPBOOK.BookScroll.prototype.enableIscroll = function () {
114
+ if (this.iscrollDisabled) {
115
+ this.iscroll.enable();
116
+ this.iscrollDisabled = false;
117
+ }
118
+ };
119
+
120
+ FLIPBOOK.BookScroll.prototype.disableIscroll = function () {
121
+ if (!this.iscrollDisabled) {
122
+ this.iscroll.disable();
123
+ this.iscroll.initiated = false;
124
+ this.iscrollDisabled = true;
125
+ }
126
+ };
127
+
128
+ FLIPBOOK.BookScroll.prototype.goToPage = function (value, instant) {
129
+ if (!this.enabled) {
130
+ return;
131
+ }
132
+
133
+ if (value > this.options.pages.length) {
134
+ value = this.options.pages.length;
135
+ }
136
+
137
+ if (this.singlePage || value % 2 != 0) {
138
+ value--;
139
+ }
140
+
141
+ if (value == this.rightIndex) {
142
+ return;
143
+ }
144
+
145
+ this.enableIscroll();
146
+
147
+ if (isNaN(value) || value < 0) {
148
+ value = 0;
149
+ }
150
+
151
+ let y = -value * (this.pageHeight + this.pageGap) * this.iscroll.scale;
152
+
153
+ let maxY = -(this.iscroll.scrollerHeight - this.main.wrapperH);
154
+
155
+ y = Math.max(y, maxY);
156
+
157
+ var duration = instant ? 0 : 600;
158
+
159
+ this.iscroll.scrollTo(0, y, duration);
160
+
161
+ this.setRightIndex(value);
162
+ this.main.turnPageComplete();
163
+ };
164
+
165
+ FLIPBOOK.BookScroll.prototype.setRightIndex = function (value) {
166
+ if (value != this.rightIndex) {
167
+ this.rightIndex = value;
168
+ this.main.turnPageComplete();
169
+ }
170
+ };
171
+
172
+ FLIPBOOK.BookScroll.prototype.nextPage = function (instant) {
173
+ this.goToPage(this.rightIndex + 2, instant);
174
+ };
175
+
176
+ FLIPBOOK.BookScroll.prototype.prevPage = function (instant) {
177
+ this.goToPage(this.rightIndex, instant);
178
+ };
179
+
180
+ FLIPBOOK.BookScroll.prototype.enablePrev = function (val) {
181
+ this.prevEnabled = val;
182
+ };
183
+
184
+ FLIPBOOK.BookScroll.prototype.enableNext = function (val) {
185
+ this.nextEnabled = val;
186
+ };
187
+
188
+ FLIPBOOK.BookScroll.prototype.isFocusedRight = function () {
189
+ return this.rightIndex % 2 == 0;
190
+ };
191
+
192
+ FLIPBOOK.BookScroll.prototype.isFocusedLeft = function () {
193
+ return this.rightIndex % 2 == 1;
194
+ };
195
+
196
+ FLIPBOOK.BookScroll.prototype.updateVisiblePages = function () {};
197
+
198
+ FLIPBOOK.BookScroll.prototype.disable = function () {
199
+ this.enabled = false;
200
+ };
201
+
202
+ FLIPBOOK.BookScroll.prototype.enable = function () {
203
+ this.enabled = true;
204
+ this.onResize();
205
+ };
206
+
207
+ FLIPBOOK.BookScroll.prototype.resize = function () {};
208
+
209
+ FLIPBOOK.BookScroll.prototype.onResize = function () {
210
+ var w = this.main.wrapperW;
211
+ var h = this.main.wrapperH;
212
+
213
+ if (w == 0 || h == 0 || (this.w === w && this.h === h)) {
214
+ return;
215
+ }
216
+
217
+ this.w = w;
218
+ this.h = h;
219
+
220
+ if (this.zoom) {
221
+ this.iscroll.refresh();
222
+ this.fit();
223
+ this.iscroll.scrollTo(0, this.iscroll.y, 0);
224
+ }
225
+ this.updateRightIndex();
226
+ };
227
+
228
+ FLIPBOOK.BookScroll.prototype.updateRightIndex = function () {
229
+ let maxVisibility = 0;
230
+ let currentIndex = 0;
231
+ this.pagesArr.forEach((page) => {
232
+ if (page.visibility > maxVisibility) {
233
+ maxVisibility = page.visibility;
234
+ currentIndex = page.index;
235
+ }
236
+ });
237
+ this.setRightIndex(currentIndex);
238
+ };
239
+
240
+ FLIPBOOK.BookScroll.prototype.zoomIn = function (value, time, e) {
241
+ if (e && e.type === 'mousewheel') {
242
+ return;
243
+ }
244
+ this.zoomTo(value);
245
+ };
246
+
247
+ FLIPBOOK.BookScroll.prototype.fitToHeight = function () {
248
+ this.iscroll.zoom((this.zoom * this.main.wrapperH) / this.pageHeight, 0, 0, 0);
249
+ };
250
+
251
+ FLIPBOOK.BookScroll.prototype.fitToWidth = function () {
252
+ this.iscroll.zoom((this.zoom * this.main.wrapperW) / this.pageWidth, 0, 0, 0);
253
+ };
254
+
255
+ FLIPBOOK.BookScroll.prototype.fit = function () {
256
+ if (this.options.fitToWidth) {
257
+ this.fitToWidth();
258
+ } else if (this.main.wrapperW / this.main.wrapperH < this.pageWidth / this.pageHeight) {
259
+ this.fitToWidth();
260
+ } else {
261
+ this.fitToHeight();
262
+ }
263
+ };
264
+
265
+ FLIPBOOK.BookScroll.prototype.zoomTo = function (zoom, time, x, y) {
266
+ if (!this.enabled || this.zoomDisabled) {
267
+ return;
268
+ }
269
+ var m = this.main;
270
+ var w = m.wrapperW;
271
+ var h = m.wrapperH;
272
+
273
+ if (w == 0 || h == 0) {
274
+ return;
275
+ }
276
+
277
+ this.zoom = zoom;
278
+ this.fit();
279
+
280
+ if (zoom > 1) {
281
+ this.disableFlip();
282
+ }
283
+
284
+ this.onZoom(zoom);
285
+ };
286
+
287
+ FLIPBOOK.BookScroll.prototype.zoomOut = function (value) {
288
+ this.zoomTo(value);
289
+ };
290
+
291
+ FLIPBOOK.BookScroll.prototype.onZoom = function (zoom) {
292
+ this.options.main.onZoom(zoom);
293
+ };
294
+
295
+ FLIPBOOK.BookScroll.prototype.enable = function () {
296
+ this.enabled = true;
297
+ };
298
+
299
+ FLIPBOOK.BookScroll.prototype.disable = function () {
300
+ this.enabled = false;
301
+ };
302
+
303
+ FLIPBOOK.BookScroll.prototype.onSwipe = function (event, phase, direction) {
304
+ if (phase == 'start') {
305
+ return;
306
+ }
307
+ if (phase == 'end' || phase == 'cancel') {
308
+ return;
309
+ }
310
+ if (direction == 'up' || direction == 'down') {
311
+ return;
312
+ }
313
+ };
314
+
315
+ FLIPBOOK.BookScroll.prototype.disableFlip = function () {};
316
+
317
+ FLIPBOOK.BookScroll.prototype.enableFlip = function () {};
318
+
319
+ FLIPBOOK.BookScroll.prototype.enablePan = function () {};
320
+
321
+ FLIPBOOK.BookScroll.prototype.disablePan = function () {};
322
+
323
+ FLIPBOOK.BookScroll.prototype.canFlipNext = function () {
324
+ return this.rightIndex + 1 < this.options.numPages;
325
+ };
326
+
327
+ FLIPBOOK.PageScroll = function (book, bookWrapper, main, options, index, texture, html) {
328
+ this.rotation = 0;
329
+ this.bookWrapper = bookWrapper;
330
+ this.index = index;
331
+ this.options = options;
332
+ this.texture = texture;
333
+ this.html = html;
334
+ this.index = index;
335
+ this.wrapper = document.createElement('div');
336
+ this.wrapper.className = 'flipbook-scroll-page';
337
+ this.wrapper.style.marginBottom = this.options.pageGap + 'px';
338
+ this.main = main;
339
+ this.book = book;
340
+
341
+ this.inner = document.createElement('div');
342
+ this.inner.className = 'flipbook-scroll-page-inner';
343
+ this.wrapper.appendChild(this.inner);
344
+
345
+ this.bg = document.createElement('div');
346
+ this.bg.className = 'flipbook-scroll-page-bg';
347
+ this.inner.appendChild(this.bg);
348
+
349
+ this.html = document.createElement('div');
350
+ this.html.className = 'flipbook-page3-html';
351
+ this.wrapper.appendChild(this.html);
352
+ this.html.style.width = (1000 * this.options.pageWidth) / this.options.pageHeight + 'px';
353
+ this.html.style.transform = 'scale(' + this.options.pageHeight / 1000 + ') translateZ(0)';
354
+
355
+ if (this.options.doublePage) {
356
+ if (this.index % 2 == 0 && this.index > 0) {
357
+ this.html.style.left = '-100%';
358
+ } else {
359
+ this.html.style.left = '0';
360
+ }
361
+ }
362
+
363
+ this.preloader = document.createElement('img');
364
+
365
+ if (options.pagePreloader) {
366
+ this.preloader.src = options.pagePreloader;
367
+ this.preloader.className = 'flipbook-page-preloader-image';
368
+ } else {
369
+ this.preloader.src = options.assets.spinner;
370
+ this.preloader.className = 'flipbook-page-preloader';
371
+ }
372
+
373
+ this.inner.appendChild(this.preloader);
374
+
375
+ this.setSize(this.pw, this.ph);
376
+ };
377
+
378
+ FLIPBOOK.PageScroll.prototype = {
379
+ initObserver: function () {
380
+ const observer = new IntersectionObserver(
381
+ (entries) => {
382
+ const entry = entries[0];
383
+ const visibility = entry.intersectionRatio;
384
+
385
+ if (visibility > 0) {
386
+ this.show(visibility);
387
+ } else {
388
+ this.hide();
389
+ }
390
+ },
391
+ { root: this.bookWrapper, threshold: [0, 0.1, 0.5] }
392
+ );
393
+ observer.observe(this.wrapper);
394
+ },
395
+
396
+ show: function (visibility) {
397
+ this.visibility = visibility;
398
+ if (!this.book.scrolling) {
399
+ this.load();
400
+ }
401
+ if (!this.isVisible) {
402
+ this.bg.style.display = 'block';
403
+ this.html.style.display = 'block';
404
+ this.isVisible = true;
405
+ }
406
+ },
407
+
408
+ load: function (callback, thumb) {
409
+ if (this.loaded) {
410
+ return;
411
+ }
412
+ if (this.visibility == 0) {
413
+ return;
414
+ }
415
+ this.loaded = true;
416
+ var size = this.options.pageTextureSize;
417
+
418
+ if (this.size >= size) {
419
+ if (!thumb) {
420
+ this.loadHTML();
421
+ }
422
+ if (callback) {
423
+ callback.call(this);
424
+ }
425
+ return;
426
+ }
427
+
428
+ this.size = size;
429
+
430
+ var self = this;
431
+
432
+ var index = this.options.rightToLeft ? this.options.numPages - this.index - 1 : this.index;
433
+
434
+ this.options.main.loadPage(index, size, function (page) {
435
+ page = page || {};
436
+
437
+ if (page && page.image) {
438
+ var img = page.image[size] || page.image;
439
+ img.classList.add('page-scroll-img');
440
+
441
+ if (
442
+ self.index % 2 == 0 &&
443
+ (self.options.pages[index].side == 'left' || self.options.pages[index].side == 'right')
444
+ ) {
445
+ if (!img.clone) {
446
+ img.clone = new Image();
447
+ img.clone.src = img.src;
448
+ }
449
+ img = img.clone;
450
+ }
451
+
452
+ self.bg.appendChild(img);
453
+
454
+ if (self.options.doublePage && self.index > 0 && self.index % 2 == 0) {
455
+ img.style.left = '-100%';
456
+ }
457
+
458
+ if (self.options.doublePage) {
459
+ if (self.index == 0 || (self.index == self.options.pages.length - 1 && self.options.backCover)) {
460
+ img.style.width = '100%';
461
+ } else {
462
+ img.style.width = '200%';
463
+ }
464
+ } else {
465
+ img.style.width = '100%';
466
+ }
467
+
468
+ self.inner.removeChild(self.preloader);
469
+ }
470
+
471
+ if (!thumb) {
472
+ self.loadHTML();
473
+ }
474
+
475
+ if (callback) {
476
+ callback.call(self);
477
+ }
478
+ });
479
+ },
480
+
481
+ hide: function () {
482
+ this.visibility = 0;
483
+ if (this.isVisible) {
484
+ this.bg.style.display = 'none';
485
+ this.html.style.display = 'none';
486
+ this.isVisible = false;
487
+ this.pauseHTML();
488
+ }
489
+ },
490
+
491
+ pauseHTML: function () {
492
+ var mediaElements = this.html.querySelectorAll('video, audio');
493
+ mediaElements.forEach(function (media) {
494
+ media.pause();
495
+ });
496
+ },
497
+
498
+ loadHTML: function () {
499
+ var self = this;
500
+
501
+ var index = this.options.rightToLeft ? this.options.numPages - this.index - 1 : this.index;
502
+
503
+ if (this.htmlContent) {
504
+ this.updateHtmlContent();
505
+ } else {
506
+ this.options.main.loadPageHTML(index, function (html) {
507
+ self.htmlContent = html;
508
+ self.updateHtmlContent();
509
+ });
510
+ }
511
+ },
512
+
513
+ setSize: function () {
514
+ this.wrapper.style.width = this.options.pageWidth + 'px';
515
+ this.wrapper.style.height = this.options.pageHeight + 'px';
516
+ this.updateHtmlContent();
517
+ },
518
+
519
+ updateHtmlContent: function () {
520
+ var c = this.htmlContent;
521
+
522
+ if (c && !this.htmlContentVisible) {
523
+ if (c.jquery) {
524
+ c = c[0];
525
+ }
526
+ this.htmlContentVisible = true;
527
+
528
+ this.html.replaceChildren();
529
+ this.html.appendChild(c);
530
+ this.startHTML();
531
+ this.main.trigger('showpagehtml', { page: this });
532
+ }
533
+ this.startHTML();
534
+ },
535
+
536
+ startHTML: function () {
537
+ this.book.startPageItems(this.wrapper);
538
+ },
539
+ };
flipbook.swipe.js ADDED
@@ -0,0 +1,1294 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /*
2
+ * Real3D FlipBook [https://real3dflipbook.com]
3
+ * @author creativeinteractivemedia [https://codecanyon.net/user/creativeinteractivemedia/portfolio]
4
+ * @version 4.10
5
+ * @date 2025-05-15
6
+ */
7
+ 'use strict';
8
+ var FLIPBOOK = FLIPBOOK || {};
9
+
10
+ FLIPBOOK.BookSwipe = function (el, wrapper, main, options) {
11
+ this.options = options;
12
+ this.main = main;
13
+ this.singlePage = options.singlePageMode;
14
+ if (this.singlePage) {
15
+ this.view = 1;
16
+ }
17
+ this.pageWidth = this.options.pageWidth;
18
+ this.pageHeight = this.options.pageHeight;
19
+ this.slides = [];
20
+ this.pagesArr = [];
21
+ this.leftPage = 0;
22
+ this.rightPage = 0;
23
+ this.rotation = 0;
24
+
25
+ this.prevPageEnabled = false;
26
+
27
+ this.setRightIndex(options.rightToLeft ? options.pages.length : 0);
28
+ this.currentSlide = 0;
29
+ this.flipping = false;
30
+
31
+ this.wrapper = wrapper;
32
+
33
+ this.scroller = el;
34
+ this.scroller.classList.remove('book');
35
+ this.scroller.classList.add('flipbook-carousel-scroller');
36
+
37
+ this.iscroll = new IScroll(this.wrapper, {
38
+ snap: true,
39
+ snapSpeed: 200 * this.options.pageFlipDuration,
40
+ freeScroll: true,
41
+ scrollX: true,
42
+ scrollY: false,
43
+ preventDefault: false,
44
+ eventPassthrough: 'vertical',
45
+ });
46
+
47
+ var self = this;
48
+
49
+ this.zoomDisabled = false;
50
+
51
+ this.iscroll.on('scrollStart', function () {
52
+ self.zoomDisabled = true;
53
+ });
54
+
55
+ this.iscroll.on('scrollEnd', function () {
56
+ self.zoomDisabled = false;
57
+ });
58
+
59
+ for (var i = 0; i < 3; i++) {
60
+ var slide = document.createElement('div');
61
+ slide.className = 'flipbook-carousel-slide';
62
+
63
+ var slideInner = document.createElement('div');
64
+ slideInner.className = 'slide-inner';
65
+
66
+ slide.appendChild(slideInner);
67
+ this.scroller.appendChild(slide);
68
+
69
+ this.slides.push(slide);
70
+ }
71
+
72
+ this.slides[0].iscroll = new IScroll(this.slides[0], {
73
+ zoom: true,
74
+ scrollX: true,
75
+ scrollY: true,
76
+ freeScroll: true,
77
+ keepInCenterV: true,
78
+ keepInCenterH: true,
79
+ preventDefault: false,
80
+ });
81
+
82
+ this.slides[2].iscroll = new IScroll(this.slides[2], {
83
+ zoom: true,
84
+ scrollX: true,
85
+ scrollY: true,
86
+ freeScroll: true,
87
+ keepInCenterV: true,
88
+ keepInCenterH: true,
89
+ preventDefault: false,
90
+ });
91
+
92
+ this.slides[1].iscroll = new IScroll(this.slides[1], {
93
+ zoom: true,
94
+ scrollX: true,
95
+ scrollY: true,
96
+ freeScroll: true,
97
+ keepInCenterV: true,
98
+ keepInCenterH: true,
99
+ preventDefault: false,
100
+ });
101
+
102
+ // eslint-disable-next-line no-redeclare
103
+ for (var i = 0; i < 3; i++) {
104
+ this.slides[i].iscroll.on('zoomEnd', function () {
105
+ var scale = options.main.zoom;
106
+ this.options.eventPassthrough = scale > 1 ? '' : 'vertical';
107
+ this.options.freeScroll = scale > 1;
108
+ this.refresh();
109
+ });
110
+ }
111
+
112
+ this.resizeInnerSlides();
113
+
114
+ var page;
115
+
116
+ options.pages.forEach((page, index) => {
117
+ if (!page.empty) {
118
+ const newPage = new FLIPBOOK.PageSwipe(this, index, page.src, page.htmlContent);
119
+ this.pagesArr.push(newPage);
120
+ if (options.loadAllPages) {
121
+ newPage.load();
122
+ }
123
+ }
124
+ });
125
+
126
+ if (!options.cover) {
127
+ page = new FLIPBOOK.PageSwipe(this, options.numPages);
128
+ this.pagesArr.push(page);
129
+ }
130
+
131
+ this.iscroll.on('scrollStart', function () {
132
+ if (this.distX < 0) {
133
+ self.loadNextSpread();
134
+ } else {
135
+ self.loadPrevSpread();
136
+ }
137
+ });
138
+
139
+ this.iscroll.on('scrollEnd', function () {
140
+ var sliderPage = this.currentPage.pageX;
141
+
142
+ if (self.currentSlide == sliderPage) {
143
+ return;
144
+ }
145
+
146
+ if (self.singlePage) {
147
+ if (sliderPage > self.currentSlide) {
148
+ self.setRightIndex(self.rightIndex + 1);
149
+ } else if (sliderPage < self.currentSlide) {
150
+ self.setRightIndex(self.rightIndex - 1);
151
+ }
152
+ } else {
153
+ if (sliderPage > self.currentSlide) {
154
+ self.setRightIndex(self.rightIndex + 2);
155
+ } else if (sliderPage < self.currentSlide) {
156
+ self.setRightIndex(self.rightIndex - 2);
157
+ }
158
+ }
159
+
160
+ self.currentSlide = sliderPage;
161
+
162
+ self.updateVisiblePages();
163
+
164
+ self.flipping = false;
165
+ });
166
+
167
+ this.flipEnabled = true;
168
+ this.nextEnabled = true;
169
+ this.prevEnabled = true;
170
+
171
+ main.on('enableIScroll', () => {
172
+ this.enableIscroll();
173
+ });
174
+
175
+ main.on('disableIScroll', () => {
176
+ this.disableIscroll();
177
+ });
178
+
179
+ main.on('pageLoaded', function (_) {});
180
+ };
181
+
182
+ FLIPBOOK.BookSwipe.prototype = Object.create(FLIPBOOK.Book.prototype);
183
+
184
+ FLIPBOOK.BookSwipe.prototype.constructor = FLIPBOOK.BookSwipe;
185
+
186
+ FLIPBOOK.BookSwipe.prototype.enableIscroll = function () {
187
+ if (this.iscrollDisabled) {
188
+ if (this.zoom > 1) {
189
+ if (this.slides[0].iscroll) {
190
+ this.slides[0].iscroll.enable();
191
+ }
192
+ if (this.slides[1].iscroll) {
193
+ this.slides[1].iscroll.enable();
194
+ }
195
+ if (this.slides[2].iscroll) {
196
+ this.slides[2].iscroll.enable();
197
+ }
198
+ } else {
199
+ this.iscroll.enable();
200
+ }
201
+
202
+ this.iscrollDisabled = false;
203
+ }
204
+ };
205
+
206
+ FLIPBOOK.BookSwipe.prototype.disableIscroll = function () {
207
+ if (!this.iscrollDisabled) {
208
+ if (this.zoom > 1) {
209
+ if (this.slides[0].iscroll) {
210
+ this.slides[0].iscroll.disable();
211
+ this.slides[0].iscroll.initiated = false;
212
+ }
213
+ if (this.slides[1].iscroll) {
214
+ this.slides[1].iscroll.disable();
215
+ this.slides[1].iscroll.initiated = false;
216
+ }
217
+ if (this.slides[2].iscroll) {
218
+ this.slides[2].iscroll.disable();
219
+ this.slides[2].iscroll.initiated = false;
220
+ }
221
+ } else {
222
+ this.iscroll.disable();
223
+ this.iscroll.initiated = false;
224
+ }
225
+
226
+ this.iscrollDisabled = true;
227
+ }
228
+ };
229
+
230
+ FLIPBOOK.BookSwipe.prototype.goToPage = function (value, instant) {
231
+ if (!this.enabled) {
232
+ return;
233
+ }
234
+
235
+ if (!this.flipEnabled) {
236
+ return;
237
+ }
238
+
239
+ if (value > this.options.pages.length) {
240
+ value = this.options.pages.length;
241
+ }
242
+
243
+ if (this.singlePage || value % 2 != 0) {
244
+ value--;
245
+ }
246
+
247
+ if (isNaN(value) || value < 0) {
248
+ value = 0;
249
+ }
250
+
251
+ if (instant) {
252
+ this.setRightIndex(value);
253
+ this.updateVisiblePages();
254
+ return;
255
+ }
256
+
257
+ if (this.singlePage) {
258
+ if (value > this.rightIndex) {
259
+ this.setSlidePages(this.currentSlide + 1, [value]);
260
+ this.setRightIndex(value - 1);
261
+ this.nextPage(instant);
262
+ } else if (value < this.rightIndex) {
263
+ this.setSlidePages(this.currentSlide - 1, [value]);
264
+ this.setRightIndex(value + 1);
265
+ this.prevPage(instant);
266
+ }
267
+ } else {
268
+ if (this.options.rightToLeft && !this.options.backCover && value < 2) {
269
+ value = 2;
270
+ }
271
+
272
+ if (value > this.rightIndex) {
273
+ if (value >= this.pagesArr.length) {
274
+ this.setSlidePages(2, [value - 1, value]);
275
+ this.setRightIndex(value - 2);
276
+ this.goToSlide(2, instant);
277
+ } else {
278
+ this.setSlidePages(this.currentSlide + 1, [value - 1, value]);
279
+ this.setRightIndex(value - 2);
280
+ this.nextPage(instant);
281
+ }
282
+ } else if (value < this.rightIndex) {
283
+ if (value == 0) {
284
+ this.setRightIndex(value + 2);
285
+ this.setSlidePages(0, [value]);
286
+ this.goToSlide(0, instant);
287
+ } else {
288
+ this.setRightIndex(value + 2);
289
+ this.setSlidePages(this.currentSlide - 1, [value - 1, value]);
290
+ this.prevPage(instant);
291
+ }
292
+ }
293
+ }
294
+ };
295
+
296
+ FLIPBOOK.BookSwipe.prototype.setRightIndex = function (value) {
297
+ this.rightIndex = value;
298
+ };
299
+
300
+ FLIPBOOK.BookSwipe.prototype.nextPage = function (instant) {
301
+ if (this.currentSlide == 2) {
302
+ return;
303
+ }
304
+
305
+ this.flipping = true;
306
+
307
+ this.goToSlide(this.currentSlide + 1, instant);
308
+
309
+ this.loadNextSpread();
310
+ };
311
+
312
+ FLIPBOOK.BookSwipe.prototype.prevPage = function (instant) {
313
+ if (this.currentSlide == 0) {
314
+ return;
315
+ }
316
+
317
+ this.flipping = true;
318
+
319
+ this.goToSlide(this.currentSlide - 1, instant);
320
+
321
+ this.loadPrevSpread();
322
+ };
323
+
324
+ FLIPBOOK.BookSwipe.prototype.enablePrev = function (val) {
325
+ this.prevEnabled = val;
326
+ };
327
+
328
+ FLIPBOOK.BookSwipe.prototype.enableNext = function (val) {
329
+ this.nextEnabled = val;
330
+ };
331
+
332
+ FLIPBOOK.BookSwipe.prototype.setSlidePages = function (slide, pages) {
333
+ var self = this;
334
+ var arr = [];
335
+ for (var i = 0; i < pages.length; i++) {
336
+ if (pages[i]) {
337
+ arr.push(pages[i].index);
338
+ }
339
+ }
340
+
341
+ if (this.slides[slide].pages && this.slides[slide].pages.length > 0) {
342
+ if (arr.join('') === this.slides[slide].pages.join('')) {
343
+ return;
344
+ }
345
+ }
346
+
347
+ this.clearSlidePages(slide);
348
+
349
+ var slideInner = this.slides[slide].firstChild;
350
+
351
+ pages.forEach((page) => {
352
+ let pageIndex;
353
+
354
+ if (typeof page === 'number') {
355
+ pageIndex = page;
356
+ } else {
357
+ pageIndex = page.index;
358
+ }
359
+
360
+ if (self.pagesArr[pageIndex]) {
361
+ slideInner.appendChild(self.pagesArr[pageIndex].wrapper);
362
+ self.slides[slide].pages.push(pageIndex);
363
+ }
364
+ });
365
+
366
+ this.resizeInnerSlides();
367
+
368
+ if (this.slides[slide].iscroll) {
369
+ this.slides[slide].iscroll.refresh();
370
+ }
371
+ };
372
+
373
+ FLIPBOOK.BookSwipe.prototype.clearSlidePages = function (slide) {
374
+ this.slides[slide].firstChild.innerHTML = '';
375
+ this.slides[slide].pages = [];
376
+ };
377
+
378
+ FLIPBOOK.BookSwipe.prototype.loadNextSpread = function () {
379
+ var index = this.rightIndex;
380
+
381
+ if (this.options.rightToLeft && !this.options.backCover) {
382
+ index--;
383
+ }
384
+
385
+ var next = this.pagesArr[index + 1];
386
+ if (next) {
387
+ next.load();
388
+ }
389
+ if (!this.singlePage) {
390
+ var afterNext = this.pagesArr[index + 2];
391
+ if (afterNext) {
392
+ afterNext.load();
393
+ }
394
+ }
395
+ };
396
+
397
+ FLIPBOOK.BookSwipe.prototype.loadPrevSpread = function () {
398
+ var index = this.rightIndex;
399
+ var prev;
400
+
401
+ if (this.options.rightToLeft && !this.options.backCover) {
402
+ index--;
403
+ }
404
+
405
+ if (this.singlePage) {
406
+ prev = this.pagesArr[index - 1];
407
+ if (prev) {
408
+ prev.load();
409
+ }
410
+ } else {
411
+ prev = this.pagesArr[index - 2];
412
+ if (prev) {
413
+ prev.load();
414
+ }
415
+ var beforePrev = this.pagesArr[index - 3];
416
+ if (beforePrev) {
417
+ beforePrev.load();
418
+ }
419
+ }
420
+ };
421
+
422
+ FLIPBOOK.BookSwipe.prototype.loadVisiblePages = function () {
423
+ var main = this.options.main;
424
+ var index = this.rightIndex;
425
+
426
+ if (this.options.rightToLeft && !this.options.backCover && !this.singlePage) {
427
+ index--;
428
+ }
429
+
430
+ var right = this.pagesArr[index];
431
+ var left = this.pagesArr[index - 1];
432
+ var next = this.pagesArr[index + 1];
433
+ var afterNext = this.pagesArr[index + 2];
434
+ var prev = this.pagesArr[index - 2];
435
+ var beforePrev = this.pagesArr[index - 3];
436
+
437
+ if (this.singlePage) {
438
+ if (right) {
439
+ right.load(function () {
440
+ main.setLoadingProgress(1);
441
+ if (left) {
442
+ left.load(null, true);
443
+ }
444
+ if (next) {
445
+ next.load(null, true);
446
+ }
447
+ });
448
+ } else if (left) {
449
+ left.load();
450
+ }
451
+ } else {
452
+ if (left) {
453
+ left.load(function () {
454
+ if (right) {
455
+ right.load(function () {
456
+ main.setLoadingProgress(1);
457
+ if (prev) {
458
+ prev.load(null, true);
459
+ }
460
+ if (beforePrev) {
461
+ beforePrev.load(null, true);
462
+ }
463
+ if (next) {
464
+ next.load(null, true);
465
+ }
466
+ if (afterNext) {
467
+ afterNext.load(null, true);
468
+ }
469
+ });
470
+ } else {
471
+ main.setLoadingProgress(1);
472
+ if (prev) {
473
+ prev.load(null, true);
474
+ }
475
+
476
+ if (beforePrev) {
477
+ beforePrev.load(null, true);
478
+ }
479
+ }
480
+ });
481
+ } else {
482
+ if (right) {
483
+ right.load(function () {
484
+ main.setLoadingProgress(1);
485
+ if (next) {
486
+ next.load(null, true);
487
+ }
488
+ if (afterNext) {
489
+ afterNext.load(null, true);
490
+ }
491
+ });
492
+ }
493
+ }
494
+ }
495
+ };
496
+
497
+ FLIPBOOK.BookSwipe.prototype.updateVisiblePages = function () {
498
+ if (this.visiblePagesRightIndex === this.rightIndex) {
499
+ return;
500
+ }
501
+
502
+ this.visiblePagesRightIndex = this.rightIndex;
503
+
504
+ var index = this.rightIndex;
505
+
506
+ if (this.options.rightToLeft && !this.options.backCover && !this.singlePage) {
507
+ index--;
508
+ }
509
+
510
+ var right = this.pagesArr[index];
511
+ var left = this.pagesArr[index - 1];
512
+ var next = this.pagesArr[index + 1];
513
+ var afterNext = this.pagesArr[index + 2];
514
+ var prev = this.pagesArr[index - 2];
515
+ var beforePrev = this.pagesArr[index - 3];
516
+
517
+ if (next) {
518
+ next.hideHTML();
519
+ }
520
+ if (afterNext) {
521
+ afterNext.hideHTML();
522
+ }
523
+ if (prev) {
524
+ prev.hideHTML();
525
+ }
526
+ if (beforePrev) {
527
+ beforePrev.hideHTML();
528
+ }
529
+
530
+ if (this.singlePage) {
531
+ if (right) {
532
+ right.startHTML();
533
+ }
534
+
535
+ if (!left) {
536
+ //cover
537
+ this.setSlidePages(0, [right]);
538
+
539
+ if (next) {
540
+ this.setSlidePages(1, [next]);
541
+ } else {
542
+ this.clearSlidePages(1);
543
+ }
544
+ this.goToSlide(0, true);
545
+
546
+ this.clearSlidePages(2);
547
+ } else {
548
+ if (next) {
549
+ this.setSlidePages(1, [right]);
550
+ if (left) {
551
+ this.setSlidePages(0, [left]);
552
+ }
553
+ this.setSlidePages(2, [next]);
554
+ this.goToSlide(1, true);
555
+ } else {
556
+ if (right) {
557
+ this.setSlidePages(2, [right]);
558
+ }
559
+ if (left) {
560
+ this.setSlidePages(1, [left]);
561
+ }
562
+ this.goToSlide(2, true);
563
+
564
+ this.clearSlidePages(0);
565
+ }
566
+ }
567
+
568
+ if (left) {
569
+ left.hideHTML();
570
+ }
571
+ } else {
572
+ if (!left) {
573
+ if (right) {
574
+ right.startHTML();
575
+ }
576
+ //cover
577
+ this.setSlidePages(0, [right]);
578
+
579
+ if (afterNext) {
580
+ this.setSlidePages(1, [next, afterNext]);
581
+ } else {
582
+ this.setSlidePages(1, [next]);
583
+ }
584
+
585
+ this.goToSlide(0, true);
586
+
587
+ this.clearSlidePages(2);
588
+ } else {
589
+ left.startHTML();
590
+
591
+ if (right) {
592
+ right.startHTML();
593
+
594
+ //L R
595
+
596
+ if (!next) {
597
+ this.setSlidePages(2, [left, right]);
598
+
599
+ if (beforePrev) {
600
+ this.setSlidePages(1, [beforePrev, prev]);
601
+ } else {
602
+ this.setSlidePages(1, [prev]);
603
+ }
604
+
605
+ this.goToSlide(2, true);
606
+
607
+ this.clearSlidePages(0);
608
+ } else {
609
+ if (prev && !(this.rightIndex == 2 && !this.options.cover)) {
610
+ this.setSlidePages(1, [left, right]);
611
+
612
+ if (beforePrev) {
613
+ this.setSlidePages(0, [beforePrev, prev]);
614
+ } else {
615
+ this.setSlidePages(0, [prev]);
616
+ }
617
+
618
+ if (afterNext) {
619
+ this.setSlidePages(2, [next, afterNext]);
620
+ } else {
621
+ this.setSlidePages(2, [next]);
622
+ }
623
+
624
+ this.goToSlide(1, true);
625
+ } else {
626
+ this.setSlidePages(0, [left, right]);
627
+
628
+ if (afterNext) {
629
+ this.setSlidePages(1, [next, afterNext]);
630
+ } else {
631
+ this.setSlidePages(1, [next]);
632
+ }
633
+
634
+ this.clearSlidePages(2);
635
+ }
636
+ }
637
+ } else {
638
+ this.setSlidePages(2, [left]);
639
+
640
+ if (beforePrev) {
641
+ this.setSlidePages(1, [beforePrev, prev]);
642
+ } else {
643
+ this.setSlidePages(1, [prev]);
644
+ }
645
+
646
+ this.goToSlide(2, true);
647
+ this.clearSlidePages(0);
648
+ }
649
+ }
650
+ }
651
+
652
+ this.loadVisiblePages();
653
+
654
+ this.flippedleft = (this.rightIndex + (this.rightIndex % 2)) / 2;
655
+ this.flippedright = this.options.pages.length / 2 - this.flippedleft;
656
+
657
+ this.options.main.turnPageComplete();
658
+ };
659
+
660
+ FLIPBOOK.BookSwipe.prototype.loadPage = function (index) {
661
+ if (this.pagesArr[index]) {
662
+ this.pagesArr[index].load();
663
+ }
664
+ };
665
+
666
+ FLIPBOOK.BookSwipe.prototype.disable = function () {
667
+ this.enabled = false;
668
+ };
669
+
670
+ FLIPBOOK.BookSwipe.prototype.enable = function () {
671
+ this.enabled = true;
672
+ this.onResize();
673
+ };
674
+
675
+ FLIPBOOK.BookSwipe.prototype.resize = function () {};
676
+
677
+ FLIPBOOK.BookSwipe.prototype.updateSinglePage = function (singlePage) {
678
+ this.singlePageView = singlePage;
679
+ this.onResize(true);
680
+ };
681
+
682
+ FLIPBOOK.BookSwipe.prototype.onResize = function (force) {
683
+ var w = this.main.wrapperW;
684
+ var h = this.main.wrapperH;
685
+
686
+ if (w == 0 || h == 0) {
687
+ return;
688
+ }
689
+
690
+ if (!force && this.w === w && this.h === h) {
691
+ return;
692
+ }
693
+
694
+ this.w = w;
695
+ this.h = h;
696
+
697
+ var pw = this.pageWidth;
698
+ var ph = this.pageHeight;
699
+
700
+ var portrait = (2 * this.options.zoomMin * pw) / ph > w / h;
701
+ var doublePage =
702
+ !this.options.singlePageMode &&
703
+ (!this.options.responsiveView ||
704
+ w > this.options.responsiveViewTreshold ||
705
+ !portrait ||
706
+ w / h >= this.options.responsiveViewRatio);
707
+
708
+ if (typeof this.singlePageView != 'undefined') {
709
+ doublePage = !this.singlePageView;
710
+ }
711
+
712
+ var bw = doublePage ? 2 * pw : pw;
713
+ var bh = ph;
714
+ this.bw = bw;
715
+ this.bh = bh;
716
+
717
+ var scale;
718
+ if (h / w > bh / bw) {
719
+ //fit to width
720
+ scale = ((bh / bw) * w) / this.options.pageHeight;
721
+ } else {
722
+ scale = h / this.options.pageHeight;
723
+ }
724
+
725
+ var spaceBetweenSlides = 0;
726
+
727
+ for (var i = 0; i < this.slides.length; i++) {
728
+ this.slides[i].style.width = w + spaceBetweenSlides + 'px';
729
+ this.slides[i].style.height = h + 'px';
730
+ this.slides[i].style.left = i * w + i * spaceBetweenSlides + 'px';
731
+
732
+ if (this.slides[i].iscroll) {
733
+ this.slides[i].iscroll.options.zoomMin = this.options.zoomMin * scale;
734
+ this.slides[i].iscroll.options.zoomMax = this.options.zoomMax * scale;
735
+ this.slides[i].iscroll.refresh();
736
+ }
737
+ }
738
+
739
+ this.scroller.style.width = this.slides.length * (w + spaceBetweenSlides) + 'px';
740
+ this.iscroll.refresh();
741
+
742
+ if ((!doublePage || this.options.singlePageMode) && !this.singlePage) {
743
+ if (this.rightIndex % 2 == 0 && this.rightIndex > 0) {
744
+ this.setRightIndex(this.rightIndex - 1);
745
+ }
746
+
747
+ this.singlePage = true;
748
+ this.view = 1;
749
+
750
+ this.resizeInnerSlides();
751
+ } else if (doublePage && !this.options.singlePageMode && this.singlePage) {
752
+ if (this.rightIndex % 2 != 0) {
753
+ this.setRightIndex(this.rightIndex + 1);
754
+ }
755
+
756
+ this.singlePage = false;
757
+ this.view = 2;
758
+
759
+ this.resizeInnerSlides();
760
+ }
761
+
762
+ this.zoomTo(this.zoom);
763
+
764
+ // this.updateVisiblePages();
765
+ };
766
+
767
+ FLIPBOOK.BookSwipe.prototype.isFocusedRight = function () {
768
+ return this.rightIndex % 2 == 0;
769
+ };
770
+
771
+ FLIPBOOK.BookSwipe.prototype.isFocusedLeft = function () {
772
+ return this.rightIndex % 2 == 1;
773
+ };
774
+
775
+ FLIPBOOK.BookSwipe.prototype.resizeInnerSlides = function () {
776
+ var pw = (this.options.pageHeight * this.pageWidth) / this.pageHeight;
777
+
778
+ if (this.rotation == 90 || this.rotation == 270) {
779
+ pw = (this.options.pageHeight * this.pageHeight) / this.pageWidth;
780
+ }
781
+
782
+ var sw = this.singlePage ? pw : 2 * pw;
783
+
784
+ for (var i = 0; i < 3; i++) {
785
+ sw = this.slides[i].pages && this.slides[i].pages.length == 1 ? pw : 2 * pw;
786
+ this.slides[i].firstChild.style.width = `${sw}px`;
787
+ }
788
+ };
789
+
790
+ FLIPBOOK.BookSwipe.prototype.goToSlide = function (slideIndex, instant) {
791
+ if (this.iscroll.currentPage.pageX == slideIndex) {
792
+ return;
793
+ }
794
+
795
+ this.onResize();
796
+
797
+ var time = instant ? 0 : 600 * this.options.pageFlipDuration;
798
+ var slide = this.slides[slideIndex];
799
+
800
+ if (slide.pages && slide.pages[0]) {
801
+ this.pagesArr[slide.pages[0]].updateHtmlContent();
802
+ }
803
+
804
+ if (this.iscroll.pages.length > 0) {
805
+ this.iscroll.goToPage(slideIndex, 0, time);
806
+ }
807
+
808
+ if (instant) {
809
+ this.currentSlide = slideIndex;
810
+ }
811
+
812
+ this.zoomTo(this.options.zoomMin);
813
+ };
814
+
815
+ FLIPBOOK.BookSwipe.prototype.zoomIn = function (value, time, e) {
816
+ if (e && e.type === 'mousewheel') {
817
+ return;
818
+ }
819
+ this.zoomTo(value);
820
+ };
821
+
822
+ FLIPBOOK.BookSwipe.prototype.zoomTo = function (zoom, time, x, y) {
823
+ if (!this.enabled || this.zoomDisabled) {
824
+ return;
825
+ }
826
+
827
+ x = x || 0;
828
+ y = y || 0;
829
+
830
+ if (zoom > 1) {
831
+ this.disableFlip();
832
+ }
833
+
834
+ if (w == 0 || h == 0) {
835
+ return;
836
+ }
837
+
838
+ var m = this.main;
839
+ var w = m.wrapperW;
840
+ var h = m.wrapperH;
841
+ var bw = m.bookW;
842
+ var bh = m.bookH;
843
+ var pw = m.pageW;
844
+ var ph = m.pageH;
845
+ var r1 = w / h;
846
+ var r2 = pw / ph;
847
+
848
+ var s = Math.min(this.zoom, 1);
849
+
850
+ var zoomMin = Number(this.options.zoomMin);
851
+
852
+ var self = this;
853
+
854
+ function fitToHeight() {
855
+ self.ratio = h / bh;
856
+ fit();
857
+ }
858
+
859
+ function fitToWidth() {
860
+ self.ratio = self.view == 1 ? w / pw : w / bw;
861
+ fit();
862
+ }
863
+
864
+ function fit() {
865
+ for (var i = 0; i < 3; i++) {
866
+ if (self.slides[i].iscroll) {
867
+ self.slides[i].iscroll.options.zoomMin = self.ratio * self.options.zoomMin;
868
+ self.slides[i].iscroll.options.zoomMax = self.ratio * self.options.zoomMax;
869
+ self.slides[i].iscroll.zoom(self.ratio * zoom, x, y, 0);
870
+ }
871
+ }
872
+ }
873
+
874
+ if (
875
+ !this.options.singlePageMode &&
876
+ this.options.responsiveView &&
877
+ w <= this.options.responsiveViewTreshold &&
878
+ r1 < 2 * r2 &&
879
+ r1 < this.options.responsiveViewRatio
880
+ ) {
881
+ this.view = 1;
882
+
883
+ if (r2 > r1) {
884
+ this.sc = (zoomMin * r1) / (r2 * s);
885
+ } else {
886
+ this.sc = 1;
887
+ }
888
+
889
+ if (w / h > pw / ph) {
890
+ fitToHeight();
891
+ } else {
892
+ fitToWidth();
893
+ }
894
+ } else if (this.singlePage && r1 < 2 * r2) {
895
+ if (r2 > r1) {
896
+ this.sc = (zoomMin * r1) / (r2 * s);
897
+ } else {
898
+ this.sc = 1;
899
+ }
900
+
901
+ if (w / h > pw / ph) {
902
+ fitToHeight();
903
+ } else {
904
+ fitToWidth();
905
+ }
906
+ } else {
907
+ this.view = 2;
908
+
909
+ if (r1 < 2 * r2) {
910
+ this.sc = (zoomMin * r1) / (2 * r2 * s);
911
+ } else {
912
+ this.sc = 1;
913
+ }
914
+
915
+ if (w / h >= bw / bh) {
916
+ fitToHeight();
917
+ } else {
918
+ fitToWidth();
919
+ }
920
+ }
921
+
922
+ this.zoom = zoom;
923
+
924
+ this.onZoom(zoom);
925
+ };
926
+
927
+ FLIPBOOK.BookSwipe.prototype.zoomOut = function (value) {
928
+ this.zoomTo(value);
929
+ };
930
+
931
+ FLIPBOOK.BookSwipe.prototype.move = function (direction) {
932
+ if (this.zoom <= 1) {
933
+ return;
934
+ }
935
+
936
+ for (var i = 0; i < 3; i++) {
937
+ var iscroll = this.slides[i].iscroll;
938
+ var offset2 = 0;
939
+
940
+ if (iscroll) {
941
+ var posX = iscroll.x;
942
+ var posY = iscroll.y;
943
+ var offset = 20 * this.zoom;
944
+ switch (direction) {
945
+ case 'left':
946
+ posX += offset;
947
+ break;
948
+ case 'right':
949
+ posX -= offset;
950
+ break;
951
+ case 'up':
952
+ posY += offset;
953
+ break;
954
+ case 'down':
955
+ posY -= offset;
956
+ break;
957
+ }
958
+
959
+ if (posX > 0) {
960
+ posX = offset2;
961
+ }
962
+ if (posX < iscroll.maxScrollX) {
963
+ posX = iscroll.maxScrollX - offset2;
964
+ }
965
+ if (posY > 0) {
966
+ posY = offset2;
967
+ }
968
+ if (posY < iscroll.maxScrollY) {
969
+ posY = iscroll.maxScrollY - offset2;
970
+ }
971
+
972
+ iscroll.scrollTo(posX, posY, 0);
973
+ }
974
+ }
975
+ };
976
+
977
+ FLIPBOOK.BookSwipe.prototype.onZoom = function (zoom) {
978
+ if (zoom > 1) {
979
+ this.disableFlip();
980
+ this.enablePan();
981
+ } else {
982
+ this.enableFlip();
983
+ this.disablePan();
984
+ }
985
+
986
+ this.options.main.onZoom(zoom);
987
+ };
988
+
989
+ FLIPBOOK.BookSwipe.prototype.rotateLeft = function () {
990
+ this.rotation = (this.rotation + 360 - 90) % 360;
991
+
992
+ for (var i = 0; i < this.pagesArr.length; i++) {
993
+ var page = this.pagesArr[i];
994
+ page.setRotation(this.rotation);
995
+ }
996
+
997
+ this.resizeInnerSlides();
998
+ this.onResize();
999
+ };
1000
+
1001
+ FLIPBOOK.BookSwipe.prototype.rotateRight = function () {
1002
+ this.rotation = (this.rotation + 360 + 90) % 360;
1003
+
1004
+ for (var i = 0; i < this.pagesArr.length; i++) {
1005
+ var page = this.pagesArr[i];
1006
+ page.setRotation(this.rotation);
1007
+ }
1008
+
1009
+ this.resizeInnerSlides();
1010
+ this.onResize();
1011
+ };
1012
+
1013
+ FLIPBOOK.BookSwipe.prototype.onSwipe = function (event, phase, distanceX, distanceY) {
1014
+ if (phase == 'start') {
1015
+ return;
1016
+ }
1017
+ };
1018
+
1019
+ FLIPBOOK.BookSwipe.prototype.onPageUnloaded = function (i) {
1020
+ var index = this.options.rightToLeft ? this.options.numPages - i - 1 : i;
1021
+
1022
+ this.pagesArr[index].unload();
1023
+ };
1024
+
1025
+ FLIPBOOK.BookSwipe.prototype.disableFlip = function () {
1026
+ this.flipEnabled = false;
1027
+ this.iscroll.disable();
1028
+ };
1029
+
1030
+ FLIPBOOK.BookSwipe.prototype.enableFlip = function () {
1031
+ if (this.options.numPages == 1) {
1032
+ this.disableFlip();
1033
+ return;
1034
+ }
1035
+
1036
+ this.flipEnabled = true;
1037
+ this.iscroll.enable();
1038
+ };
1039
+
1040
+ FLIPBOOK.BookSwipe.prototype.enablePan = function () {
1041
+ if (this.slides[0].iscroll) {
1042
+ this.slides[0].iscroll.enable();
1043
+ }
1044
+ if (this.slides[1].iscroll) {
1045
+ this.slides[1].iscroll.enable();
1046
+ }
1047
+ if (this.slides[2].iscroll) {
1048
+ this.slides[2].iscroll.enable();
1049
+ }
1050
+ };
1051
+
1052
+ FLIPBOOK.BookSwipe.prototype.disablePan = function () {
1053
+ if (this.slides[0].iscroll) {
1054
+ this.slides[0].iscroll.disable();
1055
+ }
1056
+ if (this.slides[1].iscroll) {
1057
+ this.slides[1].iscroll.disable();
1058
+ }
1059
+ if (this.slides[2].iscroll) {
1060
+ this.slides[2].iscroll.disable();
1061
+ }
1062
+ };
1063
+
1064
+ FLIPBOOK.PageSwipe = function (book, index, texture, html) {
1065
+ this.rotation = 0;
1066
+ this.index = index;
1067
+ this.options = book.options;
1068
+ this.texture = texture;
1069
+ this.html = html;
1070
+ this.index = index;
1071
+
1072
+ this.wrapper = document.createElement('div');
1073
+ this.wrapper.classList.add('flipbook-carousel-page');
1074
+ this.wrapper.dataset.page = index + 1;
1075
+ this.main = book.main;
1076
+ this.book = book;
1077
+
1078
+ this.inner = document.createElement('div');
1079
+ this.inner.classList.add('flipbook-carousel-page-inner');
1080
+ this.wrapper.appendChild(this.inner);
1081
+
1082
+ this.bg = document.createElement('div');
1083
+ this.bg.classList.add('flipbook-carousel-page-bg');
1084
+ this.inner.appendChild(this.bg);
1085
+
1086
+ this.htmlElement = document.createElement('div');
1087
+ this.htmlElement.classList.add('flipbook-page3-html');
1088
+ this.htmlElement.style.width = (1000 * this.options.pageWidth) / this.options.pageHeight + 'px';
1089
+ this.htmlElement.style.transform = 'scale(' + this.options.pageHeight / 1000 + ') translateZ(0)';
1090
+ this.inner.appendChild(this.htmlElement);
1091
+
1092
+ if (this.options.doublePage) {
1093
+ if (!this.options.rightToLeft && this.index % 2 === 0 && this.index > 0) {
1094
+ this.htmlElement.style.left = '-100%';
1095
+ } else if (this.options.rightToLeft && this.index % 2 === 1 && this.index > 0) {
1096
+ this.htmlElement.style.left = '-100%';
1097
+ } else {
1098
+ this.htmlElement.style.left = '0';
1099
+ }
1100
+ }
1101
+
1102
+ if (this.options.pagePreloader) {
1103
+ this.preloader = document.createElement('img');
1104
+ this.preloader.src = this.options.pagePreloader;
1105
+ this.preloader.classList.add('flipbook-page-preloader-image');
1106
+ this.inner.appendChild(this.preloader);
1107
+ } else {
1108
+ this.preloader = document.createElement('img');
1109
+ this.preloader.src = this.options.assets.spinner;
1110
+ this.preloader.classList.add('flipbook-page-preloader');
1111
+ this.inner.appendChild(this.preloader);
1112
+ }
1113
+
1114
+ this.setSize(this.pw, this.ph);
1115
+ };
1116
+
1117
+ FLIPBOOK.PageSwipe.prototype = {
1118
+ load: function (callback, thumb) {
1119
+ var size = this.options.pageTextureSize;
1120
+
1121
+ if (this.size >= size) {
1122
+ if (!thumb) {
1123
+ this.loadHTML();
1124
+ }
1125
+ if (callback) {
1126
+ callback.call(this);
1127
+ }
1128
+ return;
1129
+ }
1130
+
1131
+ this.size = size;
1132
+
1133
+ var self = this;
1134
+
1135
+ var index = this.options.rightToLeft ? this.options.numPages - this.index - 1 : this.index;
1136
+ var o = this.options;
1137
+ var p = o.pages[index];
1138
+
1139
+ this.options.main.loadPage(index, size, function (page) {
1140
+ page = page || {};
1141
+
1142
+ if (page && page.image) {
1143
+ var img = page.image[size] || page.image;
1144
+ img.classList.add('page-carousel-img');
1145
+
1146
+ if (self.index % 2 == 0 && ((p && p.side == 'left') || (p && p.side == 'right'))) {
1147
+ if (!img.clone) {
1148
+ img.clone = new Image();
1149
+ img.clone.src = img.src;
1150
+ }
1151
+ img = img.clone;
1152
+ }
1153
+
1154
+ self.bg.appendChild(img);
1155
+
1156
+ if (self.options.rightToLeft) {
1157
+ if (self.options.doublePage && self.index < self.options.numPages - 1 && self.index % 2 == 1) {
1158
+ img.style.left = '-100%';
1159
+ }
1160
+
1161
+ if (self.options.doublePage) {
1162
+ if (self.index == self.options.numPages - 1 || (self.index == 0 && self.options.backCover)) {
1163
+ img.style.width = '100%';
1164
+ } else {
1165
+ img.style.width = '200%';
1166
+ }
1167
+ } else {
1168
+ img.style.width = '100%';
1169
+ }
1170
+ } else {
1171
+ if (self.options.doublePage && self.index > 0 && self.index % 2 == 0) {
1172
+ img.style.left = '-100%';
1173
+ }
1174
+
1175
+ if (self.options.doublePage) {
1176
+ if (self.index == 0 || (self.index == self.options.numPages - 1 && self.options.backCover)) {
1177
+ img.style.width = '100%';
1178
+ } else {
1179
+ img.style.width = '200%';
1180
+ }
1181
+ } else {
1182
+ img.style.width = '100%';
1183
+ }
1184
+ }
1185
+
1186
+ self.preloader.remove();
1187
+ }
1188
+
1189
+ self.setRotation();
1190
+
1191
+ if (!thumb) {
1192
+ self.loadHTML();
1193
+ }
1194
+
1195
+ if (callback) {
1196
+ callback.call(self);
1197
+ }
1198
+ });
1199
+ },
1200
+
1201
+ loadHTML: function () {
1202
+ var self = this;
1203
+
1204
+ var index = !this.options.rightToLeft ? this.index : this.options.numPages - this.index - 1;
1205
+
1206
+ if (this.htmlContent) {
1207
+ this.updateHtmlContent();
1208
+ } else {
1209
+ this.options.main.loadPageHTML(index, function (html) {
1210
+ self.htmlContent = html;
1211
+ self.updateHtmlContent();
1212
+ });
1213
+ }
1214
+ },
1215
+
1216
+ hideHTML: function () {
1217
+ if (this.htmlContentVisible) {
1218
+ this.htmlElement.innerHTML = '';
1219
+ this.htmlContentVisible = false;
1220
+ this.main.trigger('hidepagehtml', { page: this });
1221
+ }
1222
+ },
1223
+
1224
+ startHTML: function () {
1225
+ this.book.startPageItems(this.wrapper);
1226
+ },
1227
+
1228
+ unload: function () {
1229
+ this.pageSize = 0;
1230
+ this.size = 0;
1231
+ this.inner.appendChild(this.preloader);
1232
+ },
1233
+
1234
+ dispose: function () {
1235
+ if (this.pageSize) {
1236
+ this.pageSize = null;
1237
+ this.bg.innerHTML = '';
1238
+ }
1239
+ },
1240
+
1241
+ setSize: function () {
1242
+ var w = this.options.pageWidth;
1243
+ var h = this.options.pageHeight;
1244
+
1245
+ if (this.rotation === 0 || this.rotation === 180) {
1246
+ this.wrapper.style.width = w + 'px';
1247
+ this.wrapper.style.height = h + 'px';
1248
+ this.pw = w;
1249
+ this.ph = h;
1250
+ } else {
1251
+ this.wrapper.style.width = h + 'px';
1252
+ this.wrapper.style.height = w + 'px';
1253
+ this.pw = h;
1254
+ this.ph = w;
1255
+ }
1256
+
1257
+ this.updateHtmlContent();
1258
+ },
1259
+
1260
+ setRotation: function (val) {
1261
+ this.setSize();
1262
+
1263
+ if (this.options.doublePage) {
1264
+ return;
1265
+ }
1266
+
1267
+ if (typeof val != 'undefined') {
1268
+ this.rotation = val;
1269
+ }
1270
+ if (this.img) {
1271
+ this.img.style.transform = 'rotate(' + this.rotation + 'deg) translateZ(0)';
1272
+ if (this.rotation === 90 || this.rotation === 270) {
1273
+ this.img.style.width = this.wrapper.clientHeight + 'px';
1274
+ this.img.style.height = this.wrapper.clientWidth + 'px';
1275
+ } else {
1276
+ this.img.style.width = this.wrapper.clientWidth + 'px';
1277
+ this.img.style.height = this.wrapper.clientHeight + 'px';
1278
+ }
1279
+ }
1280
+ },
1281
+
1282
+ updateHtmlContent: function () {
1283
+ var c = this.htmlContent;
1284
+
1285
+ if (c && !this.htmlContentVisible) {
1286
+ this.htmlContentVisible = true;
1287
+
1288
+ this.htmlElement.innerHTML = '';
1289
+ this.htmlElement.appendChild(this.htmlContent);
1290
+ this.main.trigger('showpagehtml', { page: this });
1291
+ }
1292
+ this.startHTML();
1293
+ },
1294
+ };
flipbook.webgl.js ADDED
The diff for this file is too large to render. See raw diff