42 lines
1.3 KiB
TypeScript
42 lines
1.3 KiB
TypeScript
import { format } from 'date-fns';
|
|
import { View } from '../view/view';
|
|
|
|
export const screenshotImage = (image: HTMLImageElement): string | null => {
|
|
return screenshotElement(image, image.naturalWidth, image.naturalHeight);
|
|
};
|
|
|
|
export const screenshotVideo = (video: HTMLVideoElement): string | null => {
|
|
return screenshotElement(video, video.videoWidth, video.videoHeight);
|
|
};
|
|
|
|
const screenshotElement = (
|
|
src: CanvasImageSource,
|
|
width: number,
|
|
height: number,
|
|
): string | null => {
|
|
const canvas = document.createElement('canvas');
|
|
canvas.width = width;
|
|
canvas.height = height;
|
|
|
|
const ctx = canvas.getContext('2d');
|
|
if (!ctx) {
|
|
return null;
|
|
}
|
|
ctx.drawImage(src, 0, 0, canvas.width, canvas.height);
|
|
return canvas.toDataURL('image/jpeg');
|
|
};
|
|
|
|
export const generateScreenshotFilename = (view?: View | null): string => {
|
|
if (view?.is('live') || view?.is('image')) {
|
|
return `${view.view}${view.camera ? `_${view.camera}` : ''}_${format(
|
|
new Date(),
|
|
`yyyy-MM-dd-HH-mm-ss`,
|
|
)}.jpg`;
|
|
} else if (view?.isViewerView()) {
|
|
const media = view.queryResults?.getSelectedResult();
|
|
const id = media?.getID() ?? null;
|
|
return `${view.view}${view.camera ? `_${view.camera}` : ''}${id ? `_${id}` : ''}.jpg`;
|
|
}
|
|
return 'screenshot.jpg';
|
|
};
|