Fix lightbox for tap-to-view GIFs
This commit is contained in:
parent
ddc591e962
commit
30075f18fc
3 changed files with 38 additions and 16 deletions
|
@ -170,22 +170,29 @@ export function Lightbox({
|
|||
};
|
||||
}, [onKeyDown]);
|
||||
|
||||
const { attachment, contentType, loop = false, objectURL, message } =
|
||||
media[selectedIndex] || {};
|
||||
|
||||
const isAttachmentGIF = isGIF([attachment]);
|
||||
|
||||
useEffect(() => {
|
||||
playVideo();
|
||||
|
||||
if (videoElement && isViewOnce) {
|
||||
videoElement.addEventListener('timeupdate', onTimeUpdate);
|
||||
|
||||
return () => {
|
||||
videoElement.removeEventListener('timeupdate', onTimeUpdate);
|
||||
};
|
||||
if (!videoElement || !isViewOnce) {
|
||||
return noop;
|
||||
}
|
||||
|
||||
return noop;
|
||||
}, [isViewOnce, onTimeUpdate, playVideo, videoElement]);
|
||||
if (isAttachmentGIF) {
|
||||
return noop;
|
||||
}
|
||||
|
||||
videoElement.addEventListener('timeupdate', onTimeUpdate);
|
||||
|
||||
return () => {
|
||||
videoElement.removeEventListener('timeupdate', onTimeUpdate);
|
||||
};
|
||||
}, [isViewOnce, isAttachmentGIF, onTimeUpdate, playVideo, videoElement]);
|
||||
|
||||
const { attachment, contentType, loop = false, objectURL, message } =
|
||||
media[selectedIndex] || {};
|
||||
const caption = attachment?.caption;
|
||||
|
||||
let content: JSX.Element;
|
||||
|
@ -239,7 +246,8 @@ export function Lightbox({
|
|||
);
|
||||
}
|
||||
} else if (isVideoTypeSupported) {
|
||||
const shouldLoop = loop || isGIF([attachment]) || isViewOnce;
|
||||
const shouldLoop = loop || isAttachmentGIF || isViewOnce;
|
||||
|
||||
content = (
|
||||
<video
|
||||
className="Lightbox__object"
|
||||
|
|
|
@ -1062,6 +1062,25 @@ story.add('TapToView Video', () => {
|
|||
return renderBothDirections(props);
|
||||
});
|
||||
|
||||
story.add('TapToView GIF', () => {
|
||||
const props = createProps({
|
||||
attachments: [
|
||||
{
|
||||
contentType: VIDEO_MP4,
|
||||
flags: SignalService.AttachmentPointer.Flags.GIF,
|
||||
fileName: 'cat-gif.mp4',
|
||||
url: '/fixtures/cat-gif.mp4',
|
||||
width: 400,
|
||||
height: 332,
|
||||
},
|
||||
],
|
||||
isTapToView: true,
|
||||
status: 'sent',
|
||||
});
|
||||
|
||||
return renderBothDirections(props);
|
||||
});
|
||||
|
||||
story.add('TapToView Expired', () => {
|
||||
const props = createProps({
|
||||
attachments: [
|
||||
|
|
|
@ -2122,11 +2122,6 @@ export class Message extends React.PureComponent<Props, State> {
|
|||
|
||||
const isAttachmentPending = this.isAttachmentPending();
|
||||
|
||||
if (isGIF(attachments)) {
|
||||
window.log.info("<Message> handleOpen: lightbox doesn't open for GIFs");
|
||||
return;
|
||||
}
|
||||
|
||||
if (isTapToView) {
|
||||
if (isAttachmentPending) {
|
||||
window.log.info(
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue