vue-files-preview-inno
Version:
A tool for previewing files such as doc, excel, pdf, image, markdown, txt, audio, and video and so on.
339 lines (338 loc) • 17.8 kB
JavaScript
import P from "../../../../event-emitter/index.mjs";
import { extend as b, windowBounds as R, defer as W, isNumber as _ } from "../../utils/core.mjs";
import M from "../../utils/scrolltype.mjs";
import E from "../../mapping.mjs";
import A from "../../utils/queue.mjs";
import C from "../helpers/stage.mjs";
import I from "../helpers/views.mjs";
import { EVENTS as r } from "../../utils/constants.mjs";
class B {
constructor(t) {
this.name = "default", this.optsSettings = t.settings, this.View = t.view, this.request = t.request, this.renditionQueue = t.queue, this.q = new A(this), this.settings = b(this.settings || {}, {
infinite: !0,
hidden: !1,
width: void 0,
height: void 0,
axis: void 0,
writingMode: void 0,
flow: "scrolled",
ignoreClass: "",
fullsize: void 0,
allowScriptedContent: !1,
allowPopups: !1
}), b(this.settings, t.settings || {}), this.viewSettings = {
ignoreClass: this.settings.ignoreClass,
axis: this.settings.axis,
flow: this.settings.flow,
layout: this.layout,
method: this.settings.method,
// srcdoc, blobUrl, write
width: 0,
height: 0,
forceEvenPages: !0,
allowScriptedContent: this.settings.allowScriptedContent,
allowPopups: this.settings.allowPopups
}, this.rendered = !1;
}
render(t, i) {
let e = t.tagName;
typeof this.settings.fullsize > "u" && e && (e.toLowerCase() == "body" || e.toLowerCase() == "html") && (this.settings.fullsize = !0), this.settings.fullsize && (this.settings.overflow = "visible", this.overflow = this.settings.overflow), this.settings.size = i, this.settings.rtlScrollType = M(), this.stage = new C({
width: i.width,
height: i.height,
overflow: this.overflow,
hidden: this.settings.hidden,
axis: this.settings.axis,
fullsize: this.settings.fullsize,
direction: this.settings.direction
}), this.stage.attachTo(t), this.container = this.stage.getContainer(), this.views = new I(this.container), this._bounds = this.bounds(), this._stageSize = this.stage.size(), this.viewSettings.width = this._stageSize.width, this.viewSettings.height = this._stageSize.height, this.stage.onResize(this.onResized.bind(this)), this.stage.onOrientationChange(this.onOrientationChange.bind(this)), this.addEventListeners(), this.layout && this.updateLayout(), this.rendered = !0;
}
addEventListeners() {
var t;
window.addEventListener("unload", (function(i) {
this.destroy();
}).bind(this)), this.settings.fullsize ? t = window : t = this.container, this._onScroll = this.onScroll.bind(this), t.addEventListener("scroll", this._onScroll);
}
removeEventListeners() {
var t;
this.settings.fullsize ? t = window : t = this.container, t.removeEventListener("scroll", this._onScroll), this._onScroll = void 0;
}
destroy() {
clearTimeout(this.orientationTimeout), clearTimeout(this.resizeTimeout), clearTimeout(this.afterScrolled), this.clear(), this.removeEventListeners(), this.stage.destroy(), this.rendered = !1;
}
onOrientationChange(t) {
let { orientation: i } = window;
this.optsSettings.resizeOnOrientationChange && this.resize(), clearTimeout(this.orientationTimeout), this.orientationTimeout = setTimeout((function() {
this.orientationTimeout = void 0, this.optsSettings.resizeOnOrientationChange && this.resize(), this.emit(r.MANAGERS.ORIENTATION_CHANGE, i);
}).bind(this), 500);
}
onResized(t) {
this.resize();
}
resize(t, i, e) {
let s = this.stage.size(t, i);
if (this.winBounds = R(), this.orientationTimeout && this.winBounds.width === this.winBounds.height) {
this._stageSize = void 0;
return;
}
this._stageSize && this._stageSize.width === s.width && this._stageSize.height === s.height || (this._stageSize = s, this._bounds = this.bounds(), this.clear(), this.viewSettings.width = this._stageSize.width, this.viewSettings.height = this._stageSize.height, this.updateLayout(), this.emit(r.MANAGERS.RESIZED, {
width: this._stageSize.width,
height: this._stageSize.height
}, e));
}
createView(t, i) {
return new this.View(t, b(this.viewSettings, { forceRight: i }));
}
handleNextPrePaginated(t, i, e) {
let s;
if (this.layout.name === "pre-paginated" && this.layout.divisor > 1) {
if (t || i.index === 0)
return;
if (s = i.next(), s && !s.properties.includes("page-spread-left"))
return e.call(this, s);
}
}
display(t, i) {
var e = new W(), s = e.promise;
(i === t.href || _(i)) && (i = void 0);
var n = this.views.find(t);
if (n && t && this.layout.name !== "pre-paginated") {
let o = n.offset();
if (this.settings.direction === "ltr")
this.scrollTo(o.left, o.top, !0);
else {
let u = n.width();
this.scrollTo(o.left + u, o.top, !0);
}
if (i) {
let u = n.locationOf(i), l = n.width();
this.moveTo(u, l);
}
return e.resolve(), s;
}
this.clear();
let h = !1;
return this.layout.name === "pre-paginated" && this.layout.divisor === 2 && t.properties.includes("page-spread-right") && (h = !0), this.add(t, h).then((function(o) {
if (i) {
let u = o.locationOf(i), l = o.width();
this.moveTo(u, l);
}
}).bind(this), (o) => {
e.reject(o);
}).then((function() {
return this.handleNextPrePaginated(h, t, this.add);
}).bind(this)).then((function() {
this.views.show(), e.resolve();
}).bind(this)), s;
}
afterDisplayed(t) {
this.emit(r.MANAGERS.ADDED, t);
}
afterResized(t) {
this.emit(r.MANAGERS.RESIZE, t.section);
}
moveTo(t, i) {
var e = 0, s = 0;
this.isPaginated ? (e = Math.floor(t.left / this.layout.delta) * this.layout.delta, e + this.layout.delta > this.container.scrollWidth && (e = this.container.scrollWidth - this.layout.delta), s = Math.floor(t.top / this.layout.delta) * this.layout.delta, s + this.layout.delta > this.container.scrollHeight && (s = this.container.scrollHeight - this.layout.delta)) : s = t.top, this.settings.direction === "rtl" && (e = e + this.layout.delta, e = e - i), this.scrollTo(e, s, !0);
}
add(t, i) {
var e = this.createView(t, i);
return this.views.append(e), e.onDisplayed = this.afterDisplayed.bind(this), e.onResize = this.afterResized.bind(this), e.on(r.VIEWS.AXIS, (s) => {
this.updateAxis(s);
}), e.on(r.VIEWS.WRITING_MODE, (s) => {
this.updateWritingMode(s);
}), e.display(this.request);
}
append(t, i) {
var e = this.createView(t, i);
return this.views.append(e), e.onDisplayed = this.afterDisplayed.bind(this), e.onResize = this.afterResized.bind(this), e.on(r.VIEWS.AXIS, (s) => {
this.updateAxis(s);
}), e.on(r.VIEWS.WRITING_MODE, (s) => {
this.updateWritingMode(s);
}), e.display(this.request);
}
prepend(t, i) {
var e = this.createView(t, i);
return e.on(r.VIEWS.RESIZED, (s) => {
this.counter(s);
}), this.views.prepend(e), e.onDisplayed = this.afterDisplayed.bind(this), e.onResize = this.afterResized.bind(this), e.on(r.VIEWS.AXIS, (s) => {
this.updateAxis(s);
}), e.on(r.VIEWS.WRITING_MODE, (s) => {
this.updateWritingMode(s);
}), e.display(this.request);
}
counter(t) {
this.settings.axis === "vertical" ? this.scrollBy(0, t.heightDelta, !0) : this.scrollBy(t.widthDelta, 0, !0);
}
// resizeView(view) {
//
// if(this.settings.globalLayoutProperties.layout === "pre-paginated") {
// view.lock("both", this.bounds.width, this.bounds.height);
// } else {
// view.lock("width", this.bounds.width, this.bounds.height);
// }
//
// };
next() {
var t, i;
let e = this.settings.direction;
if (this.views.length && (this.isPaginated && this.settings.axis === "horizontal" && (!e || e === "ltr") ? (this.scrollLeft = this.container.scrollLeft, i = this.container.scrollLeft + this.container.offsetWidth + this.layout.delta, i <= this.container.scrollWidth ? this.scrollBy(this.layout.delta, 0, !0) : t = this.views.last().section.next()) : this.isPaginated && this.settings.axis === "horizontal" && e === "rtl" ? (this.scrollLeft = this.container.scrollLeft, this.settings.rtlScrollType === "default" ? (i = this.container.scrollLeft, i > 0 ? this.scrollBy(this.layout.delta, 0, !0) : t = this.views.last().section.next()) : (i = this.container.scrollLeft + this.layout.delta * -1, i > this.container.scrollWidth * -1 ? this.scrollBy(this.layout.delta, 0, !0) : t = this.views.last().section.next())) : this.isPaginated && this.settings.axis === "vertical" ? (this.scrollTop = this.container.scrollTop, this.container.scrollTop + this.container.offsetHeight < this.container.scrollHeight ? this.scrollBy(0, this.layout.height, !0) : t = this.views.last().section.next()) : t = this.views.last().section.next(), t)) {
this.clear(), this.updateLayout();
let s = !1;
return this.layout.name === "pre-paginated" && this.layout.divisor === 2 && t.properties.includes("page-spread-right") && (s = !0), this.append(t, s).then((function() {
return this.handleNextPrePaginated(s, t, this.append);
}).bind(this), (n) => n).then((function() {
!this.isPaginated && this.settings.axis === "horizontal" && this.settings.direction === "rtl" && this.settings.rtlScrollType === "default" && this.scrollTo(this.container.scrollWidth, 0, !0), this.views.show();
}).bind(this));
}
}
prev() {
var t, i;
let e = this.settings.direction;
if (this.views.length && (this.isPaginated && this.settings.axis === "horizontal" && (!e || e === "ltr") ? (this.scrollLeft = this.container.scrollLeft, i = this.container.scrollLeft, i > 0 ? this.scrollBy(-this.layout.delta, 0, !0) : t = this.views.first().section.prev()) : this.isPaginated && this.settings.axis === "horizontal" && e === "rtl" ? (this.scrollLeft = this.container.scrollLeft, this.settings.rtlScrollType === "default" ? (i = this.container.scrollLeft + this.container.offsetWidth, i < this.container.scrollWidth ? this.scrollBy(-this.layout.delta, 0, !0) : t = this.views.first().section.prev()) : (i = this.container.scrollLeft, i < 0 ? this.scrollBy(-this.layout.delta, 0, !0) : t = this.views.first().section.prev())) : this.isPaginated && this.settings.axis === "vertical" ? (this.scrollTop = this.container.scrollTop, this.container.scrollTop > 0 ? this.scrollBy(0, -this.layout.height, !0) : t = this.views.first().section.prev()) : t = this.views.first().section.prev(), t)) {
this.clear(), this.updateLayout();
let s = !1;
return this.layout.name === "pre-paginated" && this.layout.divisor === 2 && typeof t.prev() != "object" && (s = !0), this.prepend(t, s).then((function() {
var n;
if (this.layout.name === "pre-paginated" && this.layout.divisor > 1 && (n = t.prev(), n))
return this.prepend(n);
}).bind(this), (n) => n).then((function() {
this.isPaginated && this.settings.axis === "horizontal" && (this.settings.direction === "rtl" ? this.settings.rtlScrollType === "default" ? this.scrollTo(0, 0, !0) : this.scrollTo(this.container.scrollWidth * -1 + this.layout.delta, 0, !0) : this.scrollTo(this.container.scrollWidth - this.layout.delta, 0, !0)), this.views.show();
}).bind(this));
}
}
current() {
var t = this.visible();
return t.length ? t[t.length - 1] : null;
}
clear() {
this.views && (this.views.hide(), this.scrollTo(0, 0, !0), this.views.clear());
}
currentLocation() {
return this.updateLayout(), this.isPaginated && this.settings.axis === "horizontal" ? this.location = this.paginatedLocation() : this.location = this.scrolledLocation(), this.location;
}
scrolledLocation() {
let t = this.visible(), i = this.container.getBoundingClientRect(), e = i.height < window.innerHeight ? i.height : window.innerHeight, s = i.width < window.innerWidth ? i.width : window.innerWidth, n = this.settings.axis === "vertical";
this.settings.direction;
let h = 0, o = 0;
return this.settings.fullsize && (h = n ? window.scrollY : window.scrollX), t.map((l) => {
let { index: w, href: z } = l.section, c = l.position(), v = l.width(), y = l.height(), g, f, a, p;
n ? (g = h + i.top - c.top + o, f = g + e - o, p = this.layout.count(y, e).pages, a = e) : (g = h + i.left - c.left + o, f = g + s - o, p = this.layout.count(v, s).pages, a = s);
let d = Math.ceil(g / a), S = [], m = Math.ceil(f / a);
if (this.settings.direction === "rtl" && !n) {
let T = d;
d = p - m, m = p - T;
}
S = [];
for (var L = d; L <= m; L++) {
let T = L + 1;
S.push(T);
}
let x = this.mapping.page(l.contents, l.section.cfiBase, g, f);
return {
index: w,
href: z,
pages: S,
totalPages: p,
mapping: x
};
});
}
paginatedLocation() {
let t = this.visible(), i = this.container.getBoundingClientRect(), e = 0, s = 0;
return this.settings.fullsize && (e = window.scrollX), t.map((h) => {
let { index: o, href: u } = h.section, l, w = h.position(), z = h.width(), c, v, y;
this.settings.direction === "rtl" ? (l = i.right - e, y = Math.min(Math.abs(l - w.left), this.layout.width) - s, v = w.width - (w.right - l) - s, c = v - y) : (l = i.left + e, y = Math.min(w.right - l, this.layout.width) - s, c = l - w.left + s, v = c + y), s += y;
let g = this.mapping.page(h.contents, h.section.cfiBase, c, v), f = this.layout.count(z).pages, a = Math.floor(c / this.layout.pageWidth), p = [], d = Math.floor(v / this.layout.pageWidth);
if (a < 0 && (a = 0, d = d + 1), this.settings.direction === "rtl") {
let m = a;
a = f - d, d = f - m;
}
for (var S = a + 1; S <= d; S++) {
let m = S;
p.push(m);
}
return {
index: o,
href: u,
pages: p,
totalPages: f,
mapping: g
};
});
}
isVisible(t, i, e, s) {
var n = t.position(), h = s || this.bounds();
return this.settings.axis === "horizontal" && n.right > h.left - i && n.left < h.right + e ? !0 : this.settings.axis === "vertical" && n.bottom > h.top - i && n.top < h.bottom + e;
}
visible() {
for (var t = this.bounds(), i = this.views.displayed(), e = i.length, s = [], n, h, o = 0; o < e; o++)
h = i[o], n = this.isVisible(h, 0, 0, t), n === !0 && s.push(h);
return s;
}
scrollBy(t, i, e) {
let s = this.settings.direction === "rtl" ? -1 : 1;
e && (this.ignore = !0), this.settings.fullsize ? window.scrollBy(t * s, i * s) : (t && (this.container.scrollLeft += t * s), i && (this.container.scrollTop += i)), this.scrolled = !0;
}
scrollTo(t, i, e) {
e && (this.ignore = !0), this.settings.fullsize ? window.scrollTo(t, i) : (this.container.scrollLeft = t, this.container.scrollTop = i), this.scrolled = !0;
}
onScroll() {
let t, i;
this.settings.fullsize ? (t = window.scrollY, i = window.scrollX) : (t = this.container.scrollTop, i = this.container.scrollLeft), this.scrollTop = t, this.scrollLeft = i, this.ignore ? this.ignore = !1 : (this.emit(r.MANAGERS.SCROLL, {
top: t,
left: i
}), clearTimeout(this.afterScrolled), this.afterScrolled = setTimeout((function() {
this.emit(r.MANAGERS.SCROLLED, {
top: this.scrollTop,
left: this.scrollLeft
});
}).bind(this), 20));
}
bounds() {
var t;
return t = this.stage.bounds(), t;
}
applyLayout(t) {
this.layout = t, this.updateLayout(), this.views && this.views.length > 0 && this.layout.name === "pre-paginated" && this.display(this.views.first().section);
}
updateLayout() {
this.stage && (this._stageSize = this.stage.size(), this.isPaginated ? (this.layout.calculate(
this._stageSize.width,
this._stageSize.height,
this.settings.gap
), this.settings.offset = this.layout.delta / this.layout.divisor) : this.layout.calculate(this._stageSize.width, this._stageSize.height), this.viewSettings.width = this.layout.width, this.viewSettings.height = this.layout.height, this.setLayout(this.layout));
}
setLayout(t) {
this.viewSettings.layout = t, this.mapping = new E(t.props, this.settings.direction, this.settings.axis), this.views && this.views.forEach(function(i) {
i && i.setLayout(t);
});
}
updateWritingMode(t) {
this.writingMode = t;
}
updateAxis(t, i) {
!i && t === this.settings.axis || (this.settings.axis = t, this.stage && this.stage.axis(t), this.viewSettings.axis = t, this.mapping && (this.mapping = new E(this.layout.props, this.settings.direction, this.settings.axis)), this.layout && (t === "vertical" ? this.layout.spread("none") : this.layout.spread(this.layout.settings.spread)));
}
updateFlow(t, i = "auto") {
let e = t === "paginated" || t === "auto";
this.isPaginated = e, t === "scrolled-doc" || t === "scrolled-continuous" || t === "scrolled" ? this.updateAxis("vertical") : this.updateAxis("horizontal"), this.viewSettings.flow = t, this.settings.overflow ? this.overflow = this.settings.overflow : this.overflow = e ? "hidden" : i, this.stage && this.stage.overflow(this.overflow), this.updateLayout();
}
getContents() {
var t = [];
return this.views && this.views.forEach(function(i) {
const e = i && i.contents;
e && t.push(e);
}), t;
}
direction(t = "ltr") {
this.settings.direction = t, this.stage && this.stage.direction(t), this.viewSettings.direction = t, this.updateLayout();
}
isRendered() {
return this.rendered;
}
}
P(B.prototype);
export {
B as default
};
//# sourceMappingURL=index.mjs.map