@files-preview-app/preview-file 1.3.10 → 1.3.12
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 +63 -18
- package/dist/angular.cjs.map +1 -1
- package/dist/angular.js +63 -18
- package/dist/angular.js.map +1 -1
- package/dist/index.cjs +63 -18
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +63 -18
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +63 -18
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +63 -18
- package/dist/react.js.map +1 -1
- package/dist/vue.cjs +63 -18
- 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 +63 -18
- 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;
|
|
@@ -6057,6 +6082,16 @@ var ThreeDPlugin = class {
|
|
|
6057
6082
|
type: "button",
|
|
6058
6083
|
group: "actions",
|
|
6059
6084
|
execute: () => instance.download?.()
|
|
6085
|
+
},
|
|
6086
|
+
{
|
|
6087
|
+
id: "open-window",
|
|
6088
|
+
icon: "open-window",
|
|
6089
|
+
label: "Open in Separate Full Window",
|
|
6090
|
+
type: "button",
|
|
6091
|
+
group: "actions",
|
|
6092
|
+
execute: () => {
|
|
6093
|
+
instance.openInSeparateWindow?.();
|
|
6094
|
+
}
|
|
6060
6095
|
}
|
|
6061
6096
|
];
|
|
6062
6097
|
}
|
|
@@ -6127,12 +6162,21 @@ var ThreeDPlugin = class {
|
|
|
6127
6162
|
});
|
|
6128
6163
|
meshGroup.add(obj);
|
|
6129
6164
|
}
|
|
6165
|
+
const initialBox = new THREE.Box3().setFromObject(meshGroup);
|
|
6166
|
+
const center = initialBox.getCenter(new THREE.Vector3());
|
|
6167
|
+
meshGroup.position.sub(center);
|
|
6130
6168
|
scene.add(meshGroup);
|
|
6131
6169
|
const box = new THREE.Box3().setFromObject(meshGroup);
|
|
6132
|
-
const
|
|
6133
|
-
const
|
|
6170
|
+
const size = box.getSize(new THREE.Vector3());
|
|
6171
|
+
const maxDim = Math.max(size.x, size.y, size.z) || 10;
|
|
6172
|
+
grid.position.y = -size.y / 2;
|
|
6173
|
+
const gridScale = Math.max(0.1, maxDim / 50);
|
|
6174
|
+
grid.scale.set(gridScale, 1, gridScale);
|
|
6175
|
+
const fovRad = camera.fov * (Math.PI / 180);
|
|
6176
|
+
let cameraDistance = maxDim / 2 / Math.tan(fovRad / 2);
|
|
6177
|
+
cameraDistance = Math.max(cameraDistance * 1.5, 2);
|
|
6134
6178
|
const fitCamera = () => {
|
|
6135
|
-
camera.position.set(
|
|
6179
|
+
camera.position.set(cameraDistance * 0.8, cameraDistance * 0.6, cameraDistance);
|
|
6136
6180
|
camera.lookAt(0, 0, 0);
|
|
6137
6181
|
controls.target.set(0, 0, 0);
|
|
6138
6182
|
controls.update();
|
|
@@ -6178,6 +6222,7 @@ var ThreeDPlugin = class {
|
|
|
6178
6222
|
controls.update();
|
|
6179
6223
|
},
|
|
6180
6224
|
fitToPage: fitCamera,
|
|
6225
|
+
fitToWidth: fitCamera,
|
|
6181
6226
|
resetZoom: fitCamera,
|
|
6182
6227
|
rotateCW: () => {
|
|
6183
6228
|
isWireframe = !isWireframe;
|