feedback-vos 1.0.45 → 1.0.46
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/index.js +61 -53
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +61 -53
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -399,62 +399,70 @@ function ScreenshotButton({
|
|
|
399
399
|
const [tempScreenshot, setTempScreenshot] = react$1.useState(null);
|
|
400
400
|
const themeClasses = getThemeClasses(theme);
|
|
401
401
|
async function handleTakeScreenshot() {
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
402
|
+
try {
|
|
403
|
+
setIsTakenScreenShot(true);
|
|
404
|
+
const canvas = await html2canvas__default.default(document.body, {
|
|
405
|
+
width: window.innerWidth,
|
|
406
|
+
height: window.innerHeight,
|
|
407
|
+
windowWidth: window.innerWidth,
|
|
408
|
+
windowHeight: window.innerHeight,
|
|
409
|
+
scrollX: -window.scrollX,
|
|
410
|
+
scrollY: -window.scrollY,
|
|
411
|
+
scale: 1,
|
|
412
|
+
// Use scale 1 for consistent sizing
|
|
413
|
+
useCORS: true,
|
|
414
|
+
allowTaint: true,
|
|
415
|
+
// Allow external images for better rendering
|
|
416
|
+
backgroundColor: null,
|
|
417
|
+
// Preserve page background
|
|
418
|
+
removeContainer: false,
|
|
419
|
+
// Maintain proper container rendering
|
|
420
|
+
logging: false,
|
|
421
|
+
ignoreElements: (element) => {
|
|
422
|
+
return element.hasAttribute("data-feedback-widget") || element.closest("[data-feedback-widget]") !== null;
|
|
423
|
+
}
|
|
424
|
+
});
|
|
425
|
+
if (canvas.width === 0 || canvas.height === 0) {
|
|
426
|
+
console.warn("Screenshot failed: Captured canvas has 0 width or height");
|
|
427
|
+
return;
|
|
422
428
|
}
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
429
|
+
const isMobile = window.innerWidth < 768;
|
|
430
|
+
const targetWidth = isMobile ? 1080 : 1920;
|
|
431
|
+
const targetHeight = isMobile ? 1920 : 1080;
|
|
432
|
+
const normalizedCanvas = document.createElement("canvas");
|
|
433
|
+
normalizedCanvas.width = targetWidth;
|
|
434
|
+
normalizedCanvas.height = targetHeight;
|
|
435
|
+
const ctx = normalizedCanvas.getContext("2d");
|
|
436
|
+
if (!ctx) {
|
|
437
|
+
return;
|
|
438
|
+
}
|
|
439
|
+
ctx.imageSmoothingEnabled = true;
|
|
440
|
+
ctx.imageSmoothingQuality = "high";
|
|
441
|
+
const sourceAspect = canvas.width / canvas.height;
|
|
442
|
+
const targetAspect = targetWidth / targetHeight;
|
|
443
|
+
let drawWidth = targetWidth;
|
|
444
|
+
let drawHeight = targetHeight;
|
|
445
|
+
let drawX = 0;
|
|
446
|
+
let drawY = 0;
|
|
447
|
+
if (sourceAspect > targetAspect) {
|
|
448
|
+
drawHeight = targetHeight;
|
|
449
|
+
drawWidth = drawHeight * sourceAspect;
|
|
450
|
+
drawX = (targetWidth - drawWidth) / 2;
|
|
451
|
+
} else {
|
|
452
|
+
drawWidth = targetWidth;
|
|
453
|
+
drawHeight = drawWidth / sourceAspect;
|
|
454
|
+
drawY = (targetHeight - drawHeight) / 2;
|
|
455
|
+
}
|
|
456
|
+
ctx.fillStyle = "#ffffff";
|
|
457
|
+
ctx.fillRect(0, 0, targetWidth, targetHeight);
|
|
458
|
+
ctx.drawImage(canvas, drawX, drawY, drawWidth, drawHeight);
|
|
459
|
+
const base64image = normalizedCanvas.toDataURL("image/png", 1);
|
|
460
|
+
onScreenshotTook(base64image);
|
|
461
|
+
} catch (error) {
|
|
462
|
+
console.error("Failed to take screenshot:", error);
|
|
463
|
+
} finally {
|
|
432
464
|
setIsTakenScreenShot(false);
|
|
433
|
-
return;
|
|
434
|
-
}
|
|
435
|
-
ctx.imageSmoothingEnabled = true;
|
|
436
|
-
ctx.imageSmoothingQuality = "high";
|
|
437
|
-
const sourceAspect = canvas.width / canvas.height;
|
|
438
|
-
const targetAspect = targetWidth / targetHeight;
|
|
439
|
-
let drawWidth = targetWidth;
|
|
440
|
-
let drawHeight = targetHeight;
|
|
441
|
-
let drawX = 0;
|
|
442
|
-
let drawY = 0;
|
|
443
|
-
if (sourceAspect > targetAspect) {
|
|
444
|
-
drawHeight = targetHeight;
|
|
445
|
-
drawWidth = drawHeight * sourceAspect;
|
|
446
|
-
drawX = (targetWidth - drawWidth) / 2;
|
|
447
|
-
} else {
|
|
448
|
-
drawWidth = targetWidth;
|
|
449
|
-
drawHeight = drawWidth / sourceAspect;
|
|
450
|
-
drawY = (targetHeight - drawHeight) / 2;
|
|
451
465
|
}
|
|
452
|
-
ctx.fillStyle = "#ffffff";
|
|
453
|
-
ctx.fillRect(0, 0, targetWidth, targetHeight);
|
|
454
|
-
ctx.drawImage(canvas, drawX, drawY, drawWidth, drawHeight);
|
|
455
|
-
const base64image = normalizedCanvas.toDataURL("image/png", 1);
|
|
456
|
-
onScreenshotTook(base64image);
|
|
457
|
-
setIsTakenScreenShot(false);
|
|
458
466
|
}
|
|
459
467
|
function handleEditorSave(editedScreenshot) {
|
|
460
468
|
onScreenshotTook(editedScreenshot);
|