administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-05 10:45:21 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Refactor copying of text to clipboard with Clipboard API and fallback to document.execCommand('copy') in CameraMap.jsx file

Browse Source
This commit is contained in:
Sergey Krashevich 2023-06-26 10:17:18 +03:00
parent 9e531b0b5b
commit 25396fbd8a
No known key found for this signature in database
GPG Key ID: 625171324E7D3856
1 changed files with 57 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
web/src/routes/CameraMap.jsx
View File

@ -1,3 +1,4 @@
/* eslint-disable no-console */
import { h } from 'preact';
import Card from '../components/Card.jsx';
import Button from '../components/Button.jsx';
@ -95,12 +96,37 @@ export default function CameraMasks({ camera }) {
[motionMaskPoints, setMotionMaskPoints]
);
const handleCopyMotionMasks = useCallback(async () => {
await window.navigator.clipboard.writeText(` motion:
mask:
${motionMaskPoints.map((mask) => ` - ${polylinePointsToPolyline(mask)}`).join('\n')}`);
const handleCopyMotionMasks = useCallback(() => {
const textToCopy = ` motion:
mask:
${motionMaskPoints.map((mask) => ` - ${polylinePointsToPolyline(mask)}`).join('\n')}`;
if (window.navigator.clipboard && window.navigator.clipboard.writeText) {
// Use Clipboard API if available
window.navigator.clipboard.writeText(textToCopy).catch((err) => {
console.error('Failed to copy text: ', err);
});
} else {
// Fallback to document.execCommand('copy')
const textarea = document.createElement('textarea');
textarea.value = textToCopy;
document.body.appendChild(textarea);
textarea.select();
try {
const successful = document.execCommand('copy');
if (!successful) {
throw new Error('Failed to copy text');
}
} catch (err) {
console.error('Failed to copy text: ', err);
}
document.body.removeChild(textarea);
}
}, [motionMaskPoints]);
// Zone methods
const handleEditZone = useCallback(
(key) => {
@ -127,14 +153,36 @@ ${motionMaskPoints.map((mask) => ` - ${polylinePointsToPolyline(mask)}`).jo
);
const handleCopyZones = useCallback(async () => {
await window.navigator.clipboard.writeText(` zones:
const textToCopy = ` zones:
${Object.keys(zonePoints)
.map(
(zoneName) => ` ${zoneName}:
coordinates: ${polylinePointsToPolyline(zonePoints[zoneName])}`
)
.join('\n')}`);
}, [zonePoints]);
coordinates: ${polylinePointsToPolyline(zonePoints[zoneName])}`).join('\n')}`;
if (window.navigator.clipboard && window.navigator.clipboard.writeText) {
// Use Clipboard API if available
window.navigator.clipboard.writeText(textToCopy).catch((err) => {
console.error('Failed to copy text: ', err);
});
} else {
// Fallback to document.execCommand('copy')
const textarea = document.createElement('textarea');
textarea.value = textToCopy;
document.body.appendChild(textarea);
textarea.select();
try {
const successful = document.execCommand('copy');
if (!successful) {
throw new Error('Failed to copy text');
}
} catch (err) {
console.error('Failed to copy text: ', err);
}
document.body.removeChild(textarea);
}
}, [objectMaskPoints]);
// Object methods
const handleEditObjectMask = useCallback(