@files-preview-app/preview-file 1.3.9 → 1.3.11
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 +90 -19
- package/dist/angular.cjs.map +1 -1
- package/dist/angular.js +90 -19
- package/dist/angular.js.map +1 -1
- package/dist/index.cjs +90 -19
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +90 -19
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +90 -19
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +90 -19
- package/dist/react.js.map +1 -1
- package/dist/vue.cjs +90 -19
- package/dist/vue.cjs.map +1 -1
- package/dist/vue.d.cts +2 -2
- package/dist/vue.d.ts +2 -2
- package/dist/vue.js +90 -19
- package/dist/vue.js.map +1 -1
- package/package.json +1 -1
package/dist/angular.js
CHANGED
|
@@ -2765,13 +2765,28 @@ var MediaPlugin = class {
|
|
|
2765
2765
|
video.src = url;
|
|
2766
2766
|
video.controls = true;
|
|
2767
2767
|
video.playsInline = true;
|
|
2768
|
-
video.style.maxWidth = "90%";
|
|
2769
|
-
video.style.maxHeight = "90%";
|
|
2770
2768
|
video.style.borderRadius = "8px";
|
|
2771
2769
|
video.style.boxShadow = "0 8px 30px rgba(0,0,0,0.3)";
|
|
2772
2770
|
video.style.backgroundColor = "#000000";
|
|
2771
|
+
video.style.objectFit = "contain";
|
|
2772
|
+
video.style.transition = "transform 0.2s ease";
|
|
2773
2773
|
element = video;
|
|
2774
2774
|
mediaElement = video;
|
|
2775
|
+
const onMeta = () => {
|
|
2776
|
+
if (video.videoWidth > 0 && video.videoHeight > 0) {
|
|
2777
|
+
naturalW = video.videoWidth;
|
|
2778
|
+
naturalH = video.videoHeight;
|
|
2779
|
+
}
|
|
2780
|
+
updateBaseDimensions();
|
|
2781
|
+
applyTransform();
|
|
2782
|
+
};
|
|
2783
|
+
if (video.readyState >= 1 && video.videoWidth > 0) {
|
|
2784
|
+
naturalW = video.videoWidth;
|
|
2785
|
+
naturalH = video.videoHeight;
|
|
2786
|
+
} else {
|
|
2787
|
+
video.addEventListener("loadedmetadata", onMeta, { once: true });
|
|
2788
|
+
video.addEventListener("canplay", onMeta, { once: true });
|
|
2789
|
+
}
|
|
2775
2790
|
} else if (isAudio) {
|
|
2776
2791
|
const audio = document.createElement("audio");
|
|
2777
2792
|
audio.src = url;
|
|
@@ -2812,11 +2827,19 @@ var MediaPlugin = class {
|
|
|
2812
2827
|
let fitMode = ctx?.options?.fitMode || "width";
|
|
2813
2828
|
let isUserZoomed = false;
|
|
2814
2829
|
const updateBaseDimensions = () => {
|
|
2815
|
-
if (!isImage) return;
|
|
2816
|
-
|
|
2817
|
-
|
|
2818
|
-
|
|
2819
|
-
|
|
2830
|
+
if (!isImage && !isVideo) return;
|
|
2831
|
+
if (isImage) {
|
|
2832
|
+
const img = element;
|
|
2833
|
+
if (img.naturalWidth > 0 && img.naturalHeight > 0) {
|
|
2834
|
+
naturalW = img.naturalWidth;
|
|
2835
|
+
naturalH = img.naturalHeight;
|
|
2836
|
+
}
|
|
2837
|
+
} else if (isVideo) {
|
|
2838
|
+
const vid = element;
|
|
2839
|
+
if (vid.videoWidth > 0 && vid.videoHeight > 0) {
|
|
2840
|
+
naturalW = vid.videoWidth;
|
|
2841
|
+
naturalH = vid.videoHeight;
|
|
2842
|
+
}
|
|
2820
2843
|
}
|
|
2821
2844
|
const availW = Math.max(100, ctx.container.clientWidth - 32);
|
|
2822
2845
|
const availH = Math.max(100, ctx.container.clientHeight - 32);
|
|
@@ -2830,7 +2853,7 @@ var MediaPlugin = class {
|
|
|
2830
2853
|
baseH = Math.max(1, Math.round(naturalH * fitRatio));
|
|
2831
2854
|
};
|
|
2832
2855
|
const applyTransform = () => {
|
|
2833
|
-
if (isImage) {
|
|
2856
|
+
if (isImage || isVideo) {
|
|
2834
2857
|
if (!isUserZoomed) {
|
|
2835
2858
|
updateBaseDimensions();
|
|
2836
2859
|
}
|
|
@@ -2841,10 +2864,10 @@ var MediaPlugin = class {
|
|
|
2841
2864
|
sizer.style.width = `${boxW}px`;
|
|
2842
2865
|
sizer.style.height = `${boxH}px`;
|
|
2843
2866
|
sizer.style.margin = boxH < availH ? "auto 0" : "0";
|
|
2844
|
-
const
|
|
2845
|
-
const
|
|
2846
|
-
element.style.width = `${
|
|
2847
|
-
element.style.height = `${
|
|
2867
|
+
const elW = isRotated90 ? boxH : boxW;
|
|
2868
|
+
const elH = isRotated90 ? boxW : boxH;
|
|
2869
|
+
element.style.width = `${elW}px`;
|
|
2870
|
+
element.style.height = `${elH}px`;
|
|
2848
2871
|
element.style.maxWidth = "none";
|
|
2849
2872
|
element.style.maxHeight = "none";
|
|
2850
2873
|
element.style.transform = rotation ? `rotate(${rotation}deg)` : "none";
|
|
@@ -2854,6 +2877,8 @@ var MediaPlugin = class {
|
|
|
2854
2877
|
element.style.transform = `scale(${currentZoom}) rotate(${rotation}deg)`;
|
|
2855
2878
|
}
|
|
2856
2879
|
};
|
|
2880
|
+
updateBaseDimensions();
|
|
2881
|
+
applyTransform();
|
|
2857
2882
|
if (isImage) {
|
|
2858
2883
|
const img = element;
|
|
2859
2884
|
if (img.complete && img.naturalWidth > 0) {
|
|
@@ -2898,7 +2923,7 @@ var MediaPlugin = class {
|
|
|
2898
2923
|
currentZoom = level;
|
|
2899
2924
|
applyTransform();
|
|
2900
2925
|
} : void 0,
|
|
2901
|
-
fitToPage: isImage ? () => {
|
|
2926
|
+
fitToPage: isImage || isVideo ? () => {
|
|
2902
2927
|
isUserZoomed = false;
|
|
2903
2928
|
fitMode = "page";
|
|
2904
2929
|
currentZoom = 1;
|
|
@@ -2908,7 +2933,7 @@ var MediaPlugin = class {
|
|
|
2908
2933
|
updateBaseDimensions();
|
|
2909
2934
|
applyTransform();
|
|
2910
2935
|
} : void 0,
|
|
2911
|
-
fitToWidth: isImage ? () => {
|
|
2936
|
+
fitToWidth: isImage || isVideo ? () => {
|
|
2912
2937
|
isUserZoomed = false;
|
|
2913
2938
|
fitMode = "width";
|
|
2914
2939
|
currentZoom = 1;
|
|
@@ -2918,7 +2943,7 @@ var MediaPlugin = class {
|
|
|
2918
2943
|
updateBaseDimensions();
|
|
2919
2944
|
applyTransform();
|
|
2920
2945
|
} : void 0,
|
|
2921
|
-
resetZoom: isImage ? () => {
|
|
2946
|
+
resetZoom: isImage || isVideo ? () => {
|
|
2922
2947
|
isUserZoomed = false;
|
|
2923
2948
|
fitMode = ctx?.options?.fitMode || "width";
|
|
2924
2949
|
currentZoom = 1;
|
|
@@ -4821,6 +4846,36 @@ var CodePlugin = class {
|
|
|
4821
4846
|
pre.style.transition = "transform 0.15s ease";
|
|
4822
4847
|
pre.style.flexShrink = "0";
|
|
4823
4848
|
} else {
|
|
4849
|
+
if (typeof document !== "undefined" && !document.getElementById("fp-code-syntax-styles")) {
|
|
4850
|
+
const style = document.createElement("style");
|
|
4851
|
+
style.id = "fp-code-syntax-styles";
|
|
4852
|
+
style.textContent = `
|
|
4853
|
+
.fp-code-scroll-wrapper .hljs-keyword { color: #569cd6; font-weight: normal; }
|
|
4854
|
+
.fp-code-scroll-wrapper .hljs-built_in { color: #4ec9b0; }
|
|
4855
|
+
.fp-code-scroll-wrapper .hljs-type { color: #4ec9b0; }
|
|
4856
|
+
.fp-code-scroll-wrapper .hljs-literal { color: #569cd6; }
|
|
4857
|
+
.fp-code-scroll-wrapper .hljs-number { color: #b5cea8; }
|
|
4858
|
+
.fp-code-scroll-wrapper .hljs-regexp { color: #d16969; }
|
|
4859
|
+
.fp-code-scroll-wrapper .hljs-string { color: #ce9178; }
|
|
4860
|
+
.fp-code-scroll-wrapper .hljs-subst { color: #d4d4d4; }
|
|
4861
|
+
.fp-code-scroll-wrapper .hljs-symbol { color: #569cd6; }
|
|
4862
|
+
.fp-code-scroll-wrapper .hljs-class { color: #4ec9b0; }
|
|
4863
|
+
.fp-code-scroll-wrapper .hljs-function { color: #dcdcaa; }
|
|
4864
|
+
.fp-code-scroll-wrapper .hljs-title { color: #dcdcaa; }
|
|
4865
|
+
.fp-code-scroll-wrapper .hljs-params { color: #9cdcfe; }
|
|
4866
|
+
.fp-code-scroll-wrapper .hljs-comment { color: #6a9955; font-style: italic; }
|
|
4867
|
+
.fp-code-scroll-wrapper .hljs-doctag { color: #608b4e; }
|
|
4868
|
+
.fp-code-scroll-wrapper .hljs-meta { color: #9cdcfe; }
|
|
4869
|
+
.fp-code-scroll-wrapper .hljs-section { color: #569cd6; }
|
|
4870
|
+
.fp-code-scroll-wrapper .hljs-tag { color: #569cd6; }
|
|
4871
|
+
.fp-code-scroll-wrapper .hljs-name { color: #569cd6; }
|
|
4872
|
+
.fp-code-scroll-wrapper .hljs-attr { color: #9cdcfe; }
|
|
4873
|
+
.fp-code-scroll-wrapper .hljs-attribute { color: #9cdcfe; }
|
|
4874
|
+
.fp-code-scroll-wrapper .hljs-variable { color: #9cdcfe; }
|
|
4875
|
+
.fp-code-scroll-wrapper .hljs-punctuation { color: #d4d4d4; }
|
|
4876
|
+
`;
|
|
4877
|
+
document.head.appendChild(style);
|
|
4878
|
+
}
|
|
4824
4879
|
ctx.container.style.backgroundColor = "#1e1e1e";
|
|
4825
4880
|
ctx.container.style.color = "#d4d4d4";
|
|
4826
4881
|
scrollWrapper.className = "fp-code-scroll-wrapper";
|
|
@@ -4830,9 +4885,13 @@ var CodePlugin = class {
|
|
|
4830
4885
|
scrollWrapper.style.height = "max-content";
|
|
4831
4886
|
scrollWrapper.style.display = "flex";
|
|
4832
4887
|
scrollWrapper.style.alignItems = "flex-start";
|
|
4833
|
-
scrollWrapper.style.padding = "16px";
|
|
4888
|
+
scrollWrapper.style.padding = "16px 16px 16px 0";
|
|
4834
4889
|
scrollWrapper.style.boxSizing = "border-box";
|
|
4835
|
-
const
|
|
4890
|
+
const rawLines = fullText.split(/\r?\n/);
|
|
4891
|
+
if (rawLines.length > 1 && rawLines[rawLines.length - 1] === "") {
|
|
4892
|
+
rawLines.pop();
|
|
4893
|
+
}
|
|
4894
|
+
const lineCount = Math.max(1, rawLines.length);
|
|
4836
4895
|
const gutterLines = [];
|
|
4837
4896
|
for (let i = 1; i <= lineCount; i++) {
|
|
4838
4897
|
gutterLines.push(String(i));
|
|
@@ -4840,16 +4899,23 @@ var CodePlugin = class {
|
|
|
4840
4899
|
lineGutter.className = "fp-code-gutter";
|
|
4841
4900
|
lineGutter.style.userSelect = "none";
|
|
4842
4901
|
lineGutter.style.textAlign = "right";
|
|
4843
|
-
lineGutter.style.
|
|
4844
|
-
lineGutter.style.
|
|
4902
|
+
lineGutter.style.padding = "0 16px";
|
|
4903
|
+
lineGutter.style.margin = "0 16px 0 0";
|
|
4845
4904
|
lineGutter.style.borderRight = "1px solid #333333";
|
|
4846
4905
|
lineGutter.style.color = "#858585";
|
|
4847
4906
|
lineGutter.style.fontFamily = "Consolas, Menlo, Monaco, 'Courier New', monospace";
|
|
4848
4907
|
lineGutter.style.fontSize = `${fontSize}px`;
|
|
4849
4908
|
lineGutter.style.lineHeight = "1.6";
|
|
4909
|
+
lineGutter.style.whiteSpace = "pre";
|
|
4850
4910
|
lineGutter.style.flexShrink = "0";
|
|
4911
|
+
lineGutter.style.position = "sticky";
|
|
4912
|
+
lineGutter.style.left = "0";
|
|
4913
|
+
lineGutter.style.backgroundColor = "#1e1e1e";
|
|
4914
|
+
lineGutter.style.zIndex = "2";
|
|
4915
|
+
lineGutter.style.boxSizing = "border-box";
|
|
4851
4916
|
lineGutter.textContent = gutterLines.join("\n");
|
|
4852
4917
|
pre.style.margin = "0";
|
|
4918
|
+
pre.style.padding = "0 16px 0 0";
|
|
4853
4919
|
pre.style.fontFamily = "Consolas, Menlo, Monaco, 'Courier New', monospace";
|
|
4854
4920
|
pre.style.fontSize = `${fontSize}px`;
|
|
4855
4921
|
pre.style.lineHeight = "1.6";
|
|
@@ -4857,6 +4923,11 @@ var CodePlugin = class {
|
|
|
4857
4923
|
pre.style.wordBreak = "normal";
|
|
4858
4924
|
pre.style.overflowWrap = "normal";
|
|
4859
4925
|
pre.style.flex = "1";
|
|
4926
|
+
code.style.display = "block";
|
|
4927
|
+
code.style.fontFamily = "inherit";
|
|
4928
|
+
code.style.fontSize = "inherit";
|
|
4929
|
+
code.style.lineHeight = "inherit";
|
|
4930
|
+
code.style.whiteSpace = "inherit";
|
|
4860
4931
|
}
|
|
4861
4932
|
const ext = (ctx.metadata.extension || "").replace(".", "");
|
|
4862
4933
|
const renderCodePage = (text) => {
|