mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Adds time stickers to MediaEditor

Browse source
This commit is contained in:
Josh Perez 2023-03-01 14:00:50 -05:00 • committed by GitHub
parent 4549291b7b
commit 4d357f6f06
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
28 changed files with 828 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

53
ts/components/MediaEditor.tsx
View file

@ -27,9 +27,11 @@ import { useFabricHistory } from '../mediaEditor/useFabricHistory';
import { usePortal } from '../hooks/usePortal';
import { useUniqueId } from '../hooks/useUniqueId';
import { MediaEditorFabricPencilBrush } from '../mediaEditor/MediaEditorFabricPencilBrush';
import { MediaEditorFabricAnalogTimeSticker } from '../mediaEditor/MediaEditorFabricAnalogTimeSticker';
import { MediaEditorFabricCropRect } from '../mediaEditor/MediaEditorFabricCropRect';
import { MediaEditorFabricDigitalTimeSticker } from '../mediaEditor/MediaEditorFabricDigitalTimeSticker';
import { MediaEditorFabricIText } from '../mediaEditor/MediaEditorFabricIText';
import { MediaEditorFabricPencilBrush } from '../mediaEditor/MediaEditorFabricPencilBrush';
import { MediaEditorFabricSticker } from '../mediaEditor/MediaEditorFabricSticker';
import { fabricEffectListener } from '../mediaEditor/fabricEffectListener';
import { getRGBA, getHSL } from '../mediaEditor/util/color';
@ -1062,6 +1064,53 @@ export function MediaEditor({
fabricCanvas.setActiveObject(sticker);
setEditMode(undefined);
}}
onPickTimeSticker={(style: 'analog' | 'digital') => {
if (!fabricCanvas) {
return;
}
if (style === 'digital') {
const sticker = new MediaEditorFabricDigitalTimeSticker(
Date.now()
);
sticker.setPositionByOrigin(
new fabric.Point(
imageState.width / 2,
imageState.height / 2
),
'center',
'center'
);
sticker.setCoords();
fabricCanvas.add(sticker);
fabricCanvas.setActiveObject(sticker);
}
if (style === 'analog') {
const sticker = new MediaEditorFabricAnalogTimeSticker();
const STICKER_SIZE_RELATIVE_TO_CANVAS = 4;
const size =
Math.min(imageState.width, imageState.height) /
STICKER_SIZE_RELATIVE_TO_CANVAS;
sticker.scaleToHeight(size);
sticker.setPositionByOrigin(
new fabric.Point(
imageState.width / 2,
imageState.height / 2
),
'center',
'center'
);
sticker.setCoords();
fabricCanvas.add(sticker);
fabricCanvas.setActiveObject(sticker);
}
setEditMode(undefined);
}}
receivedPacks={[]}
recentStickers={recentStickers}
showPickerHint={false}
@ -1247,7 +1296,7 @@ function getNewImageStateFromCrop(
function cloneFabricCanvas(original: fabric.Canvas): Promise<fabric.Canvas> {
return new Promise(resolve => {
original.clone(resolve);
original.clone(resolve, ['data']);
});
}