@files-preview-app/preview-file 1.2.7 → 1.2.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/angular.cjs +124 -39
- package/dist/angular.cjs.map +1 -1
- package/dist/angular.js +124 -39
- package/dist/angular.js.map +1 -1
- package/dist/index.cjs +124 -39
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +124 -39
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +124 -39
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +124 -39
- package/dist/react.js.map +1 -1
- package/dist/vue.cjs +124 -39
- package/dist/vue.cjs.map +1 -1
- package/dist/vue.js +124 -39
- package/dist/vue.js.map +1 -1
- package/package.json +7 -7
package/dist/angular.js
CHANGED
|
@@ -481,7 +481,8 @@ function createElement(tag, attrs, ...children) {
|
|
|
481
481
|
}
|
|
482
482
|
var ICON_ZOOM_IN = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line><line x1="11" y1="8" x2="11" y2="14"></line><line x1="8" y1="11" x2="14" y2="11"></line></svg>`;
|
|
483
483
|
var ICON_ZOOM_OUT = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line><line x1="8" y1="11" x2="14" y2="11"></line></svg>`;
|
|
484
|
-
var ICON_FIT_PAGE = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><
|
|
484
|
+
var ICON_FIT_PAGE = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"></rect><line x1="8" y1="12" x2="16" y2="12"></line><polyline points="11 9 8 12 11 15"></polyline><polyline points="13 9 16 12 13 15"></polyline></svg>`;
|
|
485
|
+
var ICON_FIT_WIDTH = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="2" y1="12" x2="22" y2="12"></line><polyline points="5 9 2 12 5 15"></polyline><polyline points="19 9 22 12 19 15"></polyline><line x1="2" y1="5" x2="2" y2="19"></line><line x1="22" y1="5" x2="22" y2="19"></line></svg>`;
|
|
485
486
|
var ICON_ROTATE_CW = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"></polyline><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"></path></svg>`;
|
|
486
487
|
var ICON_ROTATE_CCW = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="1 4 1 10 7 10"></polyline><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"></path></svg>`;
|
|
487
488
|
var ICON_DOWNLOAD = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg>`;
|
|
@@ -501,6 +502,7 @@ var ICON_MAP = {
|
|
|
501
502
|
"zoom-in": ICON_ZOOM_IN,
|
|
502
503
|
"zoom-out": ICON_ZOOM_OUT,
|
|
503
504
|
"fit-page": ICON_FIT_PAGE,
|
|
505
|
+
"fit-width": ICON_FIT_WIDTH,
|
|
504
506
|
"fit-slide": ICON_FIT_PAGE,
|
|
505
507
|
"rotate-cw": ICON_ROTATE_CW,
|
|
506
508
|
"rotate-ccw": ICON_ROTATE_CCW,
|
|
@@ -1447,6 +1449,7 @@ var PdfPlugin = class {
|
|
|
1447
1449
|
let currentPage = 1;
|
|
1448
1450
|
let zoomScale = 1;
|
|
1449
1451
|
let rotation = 0;
|
|
1452
|
+
let fitMode = "width";
|
|
1450
1453
|
let currentRenderTask = null;
|
|
1451
1454
|
const renderPage = async (pageNum) => {
|
|
1452
1455
|
if (currentRenderTask) {
|
|
@@ -1466,11 +1469,16 @@ var PdfPlugin = class {
|
|
|
1466
1469
|
const containerWidth = container.clientWidth || 900;
|
|
1467
1470
|
const containerHeight = container.clientHeight || 700;
|
|
1468
1471
|
const unscaledVp = page.getViewport({ scale: 1, rotation });
|
|
1469
|
-
const availWidth = Math.max(
|
|
1470
|
-
const availHeight = Math.max(
|
|
1472
|
+
const availWidth = Math.max(280, containerWidth - 48);
|
|
1473
|
+
const availHeight = Math.max(280, containerHeight - 88);
|
|
1471
1474
|
const scaleW = availWidth / unscaledVp.width;
|
|
1472
1475
|
const scaleH = availHeight / unscaledVp.height;
|
|
1473
|
-
|
|
1476
|
+
let fitScale;
|
|
1477
|
+
if (fitMode === "page") {
|
|
1478
|
+
fitScale = Math.max(0.5, Math.min(scaleW, scaleH));
|
|
1479
|
+
} else {
|
|
1480
|
+
fitScale = Math.max(0.65, Math.min(1.15, scaleW));
|
|
1481
|
+
}
|
|
1474
1482
|
const effectiveScale = (fitScale > 0 ? fitScale : 1) * zoomScale;
|
|
1475
1483
|
const pixelRatio = window.devicePixelRatio || 1;
|
|
1476
1484
|
const viewport = page.getViewport({ scale: effectiveScale, rotation });
|
|
@@ -1539,6 +1547,7 @@ var PdfPlugin = class {
|
|
|
1539
1547
|
renderPage(currentPage);
|
|
1540
1548
|
},
|
|
1541
1549
|
fitToPage: () => {
|
|
1550
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
1542
1551
|
zoomScale = 1;
|
|
1543
1552
|
rotation = 0;
|
|
1544
1553
|
renderPage(currentPage);
|
|
@@ -2092,8 +2101,53 @@ var DocxPlugin = class {
|
|
|
2092
2101
|
}
|
|
2093
2102
|
}
|
|
2094
2103
|
}
|
|
2095
|
-
|
|
2096
|
-
const cards = wrapper.querySelectorAll(".fp-docx-page-card");
|
|
2104
|
+
let sections = Array.from(wrapper.querySelectorAll("section.docx"));
|
|
2105
|
+
const cards = Array.from(wrapper.querySelectorAll(".fp-docx-page-card"));
|
|
2106
|
+
if (sections.length === 1 && cards.length === 0) {
|
|
2107
|
+
const singleSec = sections[0];
|
|
2108
|
+
const pageH = 1056;
|
|
2109
|
+
const secH = singleSec.offsetHeight || singleSec.scrollHeight;
|
|
2110
|
+
if (secH > pageH * 1.25) {
|
|
2111
|
+
const children = Array.from(singleSec.children);
|
|
2112
|
+
if (children.length > 1) {
|
|
2113
|
+
const parent = singleSec.parentElement || wrapper;
|
|
2114
|
+
const newSections = [singleSec];
|
|
2115
|
+
singleSec.innerHTML = "";
|
|
2116
|
+
singleSec.style.minHeight = `${pageH}px`;
|
|
2117
|
+
singleSec.style.maxHeight = `${pageH}px`;
|
|
2118
|
+
singleSec.style.overflow = "hidden";
|
|
2119
|
+
singleSec.style.boxSizing = "border-box";
|
|
2120
|
+
let curSec = singleSec;
|
|
2121
|
+
let curH = 0;
|
|
2122
|
+
const maxH = pageH - 96;
|
|
2123
|
+
for (let i = 0; i < children.length; i++) {
|
|
2124
|
+
const child = children[i];
|
|
2125
|
+
curSec.appendChild(child);
|
|
2126
|
+
const chH = child.offsetHeight || 28;
|
|
2127
|
+
curH += chH;
|
|
2128
|
+
if (curH >= maxH && i < children.length - 1) {
|
|
2129
|
+
const nextSec = document.createElement("section");
|
|
2130
|
+
nextSec.className = singleSec.className;
|
|
2131
|
+
nextSec.style.cssText = singleSec.style.cssText;
|
|
2132
|
+
nextSec.style.width = singleSec.style.width || "816px";
|
|
2133
|
+
nextSec.style.minHeight = `${pageH}px`;
|
|
2134
|
+
nextSec.style.maxHeight = `${pageH}px`;
|
|
2135
|
+
nextSec.style.overflow = "hidden";
|
|
2136
|
+
nextSec.style.boxSizing = "border-box";
|
|
2137
|
+
nextSec.style.backgroundColor = "#ffffff";
|
|
2138
|
+
nextSec.style.boxShadow = "0 4px 24px rgba(0, 0, 0, 0.08)";
|
|
2139
|
+
nextSec.style.borderRadius = "4px";
|
|
2140
|
+
nextSec.style.marginBottom = "24px";
|
|
2141
|
+
parent.appendChild(nextSec);
|
|
2142
|
+
newSections.push(nextSec);
|
|
2143
|
+
curSec = nextSec;
|
|
2144
|
+
curH = 0;
|
|
2145
|
+
}
|
|
2146
|
+
}
|
|
2147
|
+
sections = newSections;
|
|
2148
|
+
}
|
|
2149
|
+
}
|
|
2150
|
+
}
|
|
2097
2151
|
const pageElements = sections.length > 0 ? sections : cards;
|
|
2098
2152
|
const totalPages = Math.max(1, pageElements.length);
|
|
2099
2153
|
let currentPage = 1;
|
|
@@ -2137,22 +2191,27 @@ var DocxPlugin = class {
|
|
|
2137
2191
|
}
|
|
2138
2192
|
scale = 1;
|
|
2139
2193
|
let rotation = 0;
|
|
2140
|
-
|
|
2194
|
+
let fitMode = "width";
|
|
2195
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
2141
2196
|
const activeEl = pageElements[currentPage - 1] || wrapper.firstElementChild || wrapper;
|
|
2142
2197
|
const elW = activeEl.offsetWidth || 816;
|
|
2143
|
-
const
|
|
2144
|
-
const availW = Math.max(
|
|
2145
|
-
const availH = Math.max(
|
|
2198
|
+
const singlePageH = Math.min(activeEl.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
2199
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
2200
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
2146
2201
|
const sW = availW / elW;
|
|
2147
|
-
const sH = availH /
|
|
2148
|
-
|
|
2202
|
+
const sH = availH / singlePageH;
|
|
2203
|
+
if (mode === "page") {
|
|
2204
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
2205
|
+
}
|
|
2206
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
2149
2207
|
};
|
|
2150
2208
|
const applyTransform = () => {
|
|
2151
2209
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
2152
2210
|
wrapper.style.transformOrigin = "top center";
|
|
2153
2211
|
};
|
|
2154
2212
|
setTimeout(() => {
|
|
2155
|
-
|
|
2213
|
+
fitMode = "width";
|
|
2214
|
+
scale = calculateFitScale("width");
|
|
2156
2215
|
applyTransform();
|
|
2157
2216
|
}, 60);
|
|
2158
2217
|
const cleanup = () => {
|
|
@@ -2186,7 +2245,8 @@ var DocxPlugin = class {
|
|
|
2186
2245
|
applyTransform();
|
|
2187
2246
|
},
|
|
2188
2247
|
fitToPage: () => {
|
|
2189
|
-
|
|
2248
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
2249
|
+
scale = calculateFitScale(fitMode);
|
|
2190
2250
|
rotation = 0;
|
|
2191
2251
|
applyTransform();
|
|
2192
2252
|
},
|
|
@@ -2630,11 +2690,9 @@ var ExcelPlugin = class {
|
|
|
2630
2690
|
const calculateFitScale = () => {
|
|
2631
2691
|
const table = contentArea.querySelector("table");
|
|
2632
2692
|
if (!table) return 1;
|
|
2633
|
-
const availW = Math.max(
|
|
2634
|
-
const availH = Math.max(200, container.clientHeight - 80);
|
|
2693
|
+
const availW = Math.max(280, container.clientWidth - 48);
|
|
2635
2694
|
const tW = table.offsetWidth || 800;
|
|
2636
|
-
|
|
2637
|
-
return Math.min(1, Math.min(availW / tW, availH / tH));
|
|
2695
|
+
return Math.max(0.65, Math.min(1, availW / tW));
|
|
2638
2696
|
};
|
|
2639
2697
|
try {
|
|
2640
2698
|
wb = XLSX.read(new Uint8Array(ctx.buffer), { type: "array", cellDates: true });
|
|
@@ -3231,7 +3289,7 @@ var CodePlugin = class {
|
|
|
3231
3289
|
fitToPage: () => {
|
|
3232
3290
|
fontSize = 13;
|
|
3233
3291
|
rotation = 0;
|
|
3234
|
-
zoomLevel = 1;
|
|
3292
|
+
zoomLevel = isTxt ? Math.max(0.65, Math.min(1.05, (container.clientWidth - 48) / 816)) : 1;
|
|
3235
3293
|
updateTransform();
|
|
3236
3294
|
},
|
|
3237
3295
|
rotateCW: () => {
|
|
@@ -4213,20 +4271,27 @@ var RtfPlugin = class {
|
|
|
4213
4271
|
let scale = 1;
|
|
4214
4272
|
let rotation = 0;
|
|
4215
4273
|
let pageElements = [];
|
|
4216
|
-
|
|
4274
|
+
let fitMode = "width";
|
|
4275
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
4217
4276
|
const activeEl = pageElements[currentPage - 1] || wrapper;
|
|
4218
4277
|
const elW = activeEl.offsetWidth || 850;
|
|
4219
|
-
const
|
|
4220
|
-
const availW = Math.max(
|
|
4221
|
-
const availH = Math.max(
|
|
4222
|
-
|
|
4278
|
+
const singlePageH = Math.min(activeEl.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
4279
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
4280
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
4281
|
+
const sW = availW / elW;
|
|
4282
|
+
const sH = availH / singlePageH;
|
|
4283
|
+
if (mode === "page") {
|
|
4284
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
4285
|
+
}
|
|
4286
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
4223
4287
|
};
|
|
4224
4288
|
const applyTransform = () => {
|
|
4225
4289
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
4226
4290
|
wrapper.style.transformOrigin = "top center";
|
|
4227
4291
|
};
|
|
4228
4292
|
setTimeout(() => {
|
|
4229
|
-
|
|
4293
|
+
fitMode = "width";
|
|
4294
|
+
scale = calculateFitScale("width");
|
|
4230
4295
|
applyTransform();
|
|
4231
4296
|
}, 60);
|
|
4232
4297
|
try {
|
|
@@ -4335,7 +4400,8 @@ var RtfPlugin = class {
|
|
|
4335
4400
|
applyTransform();
|
|
4336
4401
|
},
|
|
4337
4402
|
fitToPage: () => {
|
|
4338
|
-
|
|
4403
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
4404
|
+
scale = calculateFitScale(fitMode);
|
|
4339
4405
|
rotation = 0;
|
|
4340
4406
|
applyTransform();
|
|
4341
4407
|
},
|
|
@@ -4654,19 +4720,29 @@ var OpenDocumentPlugin = class {
|
|
|
4654
4720
|
ctx.container.appendChild(container);
|
|
4655
4721
|
let scale = 1;
|
|
4656
4722
|
let rotation = 0;
|
|
4657
|
-
|
|
4723
|
+
let fitMode = "width";
|
|
4724
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
4658
4725
|
const elW = wrapper.offsetWidth || 850;
|
|
4659
|
-
const
|
|
4660
|
-
const availW = Math.max(
|
|
4661
|
-
const availH = Math.max(
|
|
4662
|
-
|
|
4726
|
+
const singlePageH = Math.min(wrapper.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
4727
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
4728
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
4729
|
+
const sW = availW / elW;
|
|
4730
|
+
const sH = availH / (isPresentation ? 540 : singlePageH);
|
|
4731
|
+
if (isPresentation) {
|
|
4732
|
+
return Math.min(1, Math.min(sW, sH));
|
|
4733
|
+
}
|
|
4734
|
+
if (mode === "page") {
|
|
4735
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
4736
|
+
}
|
|
4737
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
4663
4738
|
};
|
|
4664
4739
|
const applyTransform = () => {
|
|
4665
4740
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
4666
4741
|
wrapper.style.transformOrigin = "top center";
|
|
4667
4742
|
};
|
|
4668
4743
|
setTimeout(() => {
|
|
4669
|
-
|
|
4744
|
+
fitMode = "width";
|
|
4745
|
+
scale = calculateFitScale("width");
|
|
4670
4746
|
applyTransform();
|
|
4671
4747
|
}, 60);
|
|
4672
4748
|
let currentPage = 1;
|
|
@@ -4827,7 +4903,8 @@ var OpenDocumentPlugin = class {
|
|
|
4827
4903
|
applyTransform();
|
|
4828
4904
|
},
|
|
4829
4905
|
fitToPage: () => {
|
|
4830
|
-
|
|
4906
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
4907
|
+
scale = calculateFitScale(fitMode);
|
|
4831
4908
|
rotation = 0;
|
|
4832
4909
|
applyTransform();
|
|
4833
4910
|
},
|
|
@@ -5304,15 +5381,22 @@ var DocPlugin = class {
|
|
|
5304
5381
|
if (totalPages > 1) {
|
|
5305
5382
|
showPage(1);
|
|
5306
5383
|
}
|
|
5307
|
-
|
|
5384
|
+
let fitMode = "width";
|
|
5385
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
5308
5386
|
const elW = 816;
|
|
5309
5387
|
const elH = 1056;
|
|
5310
|
-
const availW = Math.max(
|
|
5311
|
-
const availH = Math.max(
|
|
5312
|
-
|
|
5388
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
5389
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
5390
|
+
const sW = availW / elW;
|
|
5391
|
+
const sH = availH / elH;
|
|
5392
|
+
if (mode === "page") {
|
|
5393
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
5394
|
+
}
|
|
5395
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
5313
5396
|
};
|
|
5314
5397
|
setTimeout(() => {
|
|
5315
|
-
|
|
5398
|
+
fitMode = "width";
|
|
5399
|
+
scale = calculateFitScale("width");
|
|
5316
5400
|
applyTransform();
|
|
5317
5401
|
}, 60);
|
|
5318
5402
|
const cleanup = () => {
|
|
@@ -5340,7 +5424,8 @@ var DocPlugin = class {
|
|
|
5340
5424
|
applyTransform();
|
|
5341
5425
|
},
|
|
5342
5426
|
fitToPage: () => {
|
|
5343
|
-
|
|
5427
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
5428
|
+
scale = calculateFitScale(fitMode);
|
|
5344
5429
|
rotation = 0;
|
|
5345
5430
|
applyTransform();
|
|
5346
5431
|
},
|