nostr/iris-messenger
1
0
Fork 0
mirror of https://github.com/irislib/iris-messenger.git synced 2024-10-18 14:13:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

animate gallery

Browse Source
This commit is contained in:
Martti Malmi 2020-05-19 10:05:17 +03:00
parent 365201845d
commit 058cfb0ac7
1 changed files with 40 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/js/app.js
View File

@ -338,13 +338,18 @@ if (!iris.util.isMobile) {
$(document).keyup(function(e) { $(document).keyup(function(e) {
if (e.key === "Escape") { // escape key maps to keycode `27` if (e.key === "Escape") { // escape key maps to keycode `27`
if ($('#attachment-preview.gallery:visible').length) {
closeAttachmentsGallery();
} else {
closeAttachmentsPreview(); closeAttachmentsPreview();
} }
}
}); });
function openAttachmentsPreview() { function openAttachmentsPreview() {
$('#floating-day-separator').remove(); $('#floating-day-separator').remove();
var attachmentsPreview = $('#attachment-preview'); var attachmentsPreview = $('#attachment-preview');
attachmentsPreview.removeClass('gallery');
attachmentsPreview.empty(); attachmentsPreview.empty();
var closeBtn = $('<button>').text('Cancel').click(closeAttachmentsPreview); var closeBtn = $('<button>').text('Cancel').click(closeAttachmentsPreview);
attachmentsPreview.append(closeBtn); attachmentsPreview.append(closeBtn);
@ -365,22 +370,44 @@ function openAttachmentsPreview() {
} }
} }
function openAttachmentsGallery(msg) { function openAttachmentsGallery(msg, event) {
$('#floating-day-separator').remove(); $('#floating-day-separator').remove();
var attachmentsPreview = $('#attachment-preview'); var attachmentsPreview = $('#attachment-preview');
attachmentsPreview.addClass('gallery'); attachmentsPreview.addClass('gallery');
attachmentsPreview.empty(); attachmentsPreview.empty();
$('#attachment-preview').one('click', closeAttachmentsPreview); attachmentsPreview.fadeIn(100);
attachmentsPreview.show(); var left, top, width, img;
if (msg.attachments) { if (msg.attachments) {
msg.attachments.forEach(a => { msg.attachments.forEach(a => {
if (a.type.indexOf('image') === 0 && a.data) { if (a.type.indexOf('image') === 0 && a.data) {
var img = $('<img>').attr('src', a.data); img = $('<img>').attr('src', a.data);
attachmentsPreview.append(img); if (msg.attachments.length === 1) {
attachmentsPreview.css({'justify-content': 'center'});
var original = $(event.target);
left = original.offset().left;
top = original.offset().top - $(window).scrollTop();
width = original.width();
var transitionImg = img.clone();
transitionImg.css({position: 'fixed', left, top, width, 'max-width': 'none', 'max-height': 'none'});
img.css({visibility: 'hidden', 'align-self': 'center'});
attachmentsPreview.append(img);
$('body').append(transitionImg);
var o = img.offset();
transitionImg.animate({width: img.width(), left: o.left, top: o.top}, {duration: 300, complete: () => {
img.css({visibility: 'visible'});
transitionImg.remove();
}});
} else {
attachmentsPreview.css({'justify-content': ''});
attachmentsPreview.append(img);
}
} }
}) })
} }
$('#attachment-preview').one('click', () => {
closeAttachmentsGallery();
});
} }
function closeAttachmentsPreview() { function closeAttachmentsPreview() {
@ -392,6 +419,13 @@ function closeAttachmentsPreview() {
} }
} }
function closeAttachmentsGallery() {
$('#attachment-preview').fadeOut(300);
if (activeChat) {
chats[activeChat].attachments = null;
}
}
$('#attach-file').click(event => { $('#attach-file').click(event => {
event.preventDefault(); event.preventDefault();
$('#attachment-input').click(); $('#attachment-input').click();
@ -1117,7 +1151,7 @@ function addMessage(msg, chatId) {
if (msg.attachments) { if (msg.attachments) {
msg.attachments.forEach(a => { msg.attachments.forEach(a => {
if (a.type.indexOf('image') === 0 && a.data) { if (a.type.indexOf('image') === 0 && a.data) {
var img = $('<img>').attr('src', a.data).click(() => { openAttachmentsGallery(msg); }); var img = $('<img>').attr('src', a.data).click(e => { openAttachmentsGallery(msg, e); });
msgContent.prepend(img); msgContent.prepend(img);
img.one('load', scrollToMessageListBottom); img.one('load', scrollToMessageListBottom);
} }