From 60b8e88b09f28160e76107bbb807c77af117f75c Mon Sep 17 00:00:00 2001 From: Eduard Kuzmenko Date: Fri, 13 Aug 2021 22:23:29 +0300 Subject: [PATCH] Documents: add preview to lazy load queue --- src/components/appSearchSuper..ts | 3 ++- src/components/chat/bubbles.ts | 6 ++++-- src/components/wrappers.ts | 17 +++++++++-------- src/lib/appManagers/appDownloadManager.ts | 1 - src/scss/partials/_chatBubble.scss | 9 +++++---- 5 files changed, 20 insertions(+), 16 deletions(-) diff --git a/src/components/appSearchSuper..ts b/src/components/appSearchSuper..ts index 013c02be..ee2e6343 100644 --- a/src/components/appSearchSuper..ts +++ b/src/components/appSearchSuper..ts @@ -508,7 +508,8 @@ export default class AppSearchSuper { fontWeight: 400, voiceAsMusic: true, showSender: showSender, - searchContext: this.copySearchContext(inputFilter) + searchContext: this.copySearchContext(inputFilter), + lazyLoadQueue: this.lazyLoadQueue }); if(['audio', 'voice'].includes(message.media.document.type)) { diff --git a/src/components/chat/bubbles.ts b/src/components/chat/bubbles.ts index c46fc298..9a1f0c53 100644 --- a/src/components/chat/bubbles.ts +++ b/src/components/chat/bubbles.ts @@ -2537,6 +2537,7 @@ export default class ChatBubbles { const docDiv = wrapDocument({ message, noAutoDownload: this.chat.noAutoDownloadMedia, + lazyLoadQueue: this.lazyLoadQueue }); preview.append(docDiv); preview.classList.add('preview-with-document'); @@ -2594,7 +2595,7 @@ export default class ChatBubbles { if(size.w === size.h && t) { bubble.classList.add('is-square-photo'); isSquare = true; - this.appPhotosManager.setAttachmentSize(photo, preview, 32, 32, false); + this.appPhotosManager.setAttachmentSize(photo, preview, 48, 48, false); /* if(t) { t.append(timeSpan); @@ -2717,7 +2718,8 @@ export default class ChatBubbles { messageDiv, chat: this.chat, loadPromises, - noAutoDownload: this.chat.noAutoDownloadMedia + noAutoDownload: this.chat.noAutoDownloadMedia, + lazyLoadQueue: this.lazyLoadQueue }); if(newNameContainer) { diff --git a/src/components/wrappers.ts b/src/components/wrappers.ts index f2cc09e0..d321074a 100644 --- a/src/components/wrappers.ts +++ b/src/components/wrappers.ts @@ -445,7 +445,7 @@ export const formatDate = (timestamp: number, monthShort = false, withYear = tru return str + ' at ' + date.getHours() + ':' + ('0' + date.getMinutes()).slice(-2); }; -export function wrapDocument({message, withTime, fontWeight, voiceAsMusic, showSender, searchContext, loadPromises, noAutoDownload}: { +export function wrapDocument({message, withTime, fontWeight, voiceAsMusic, showSender, searchContext, loadPromises, noAutoDownload, lazyLoadQueue}: { message: any, withTime?: boolean, fontWeight?: number, @@ -454,6 +454,7 @@ export function wrapDocument({message, withTime, fontWeight, voiceAsMusic, showS searchContext?: SearchSuperContext, loadPromises?: Promise[], noAutoDownload?: boolean, + lazyLoadQueue?: LazyLoadQueue }): HTMLElement { if(!fontWeight) fontWeight = 500; @@ -470,10 +471,7 @@ export function wrapDocument({message, withTime, fontWeight, voiceAsMusic, showS if(voiceAsMusic) audioElement.voiceAsMusic = voiceAsMusic; if(searchContext) audioElement.searchContext = searchContext; if(showSender) audioElement.showSender = showSender; - - if(uploading) { - audioElement.preloader = message.media.preloader; - } + if(uploading) audioElement.preloader = message.media.preloader; audioElement.dataset.fontWeight = '' + fontWeight; audioElement.render(); @@ -507,7 +505,8 @@ export function wrapDocument({message, withTime, fontWeight, voiceAsMusic, showS boxWidth: 54, boxHeight: 54, loadPromises, - withoutPreloader: true + withoutPreloader: true, + lazyLoadQueue }); icoDiv.style.width = icoDiv.style.height = ''; if(wrapped.images.thumb) imgs.push(wrapped.images.thumb); @@ -1444,7 +1443,7 @@ export function wrapAlbum({groupId, attachmentDiv, middleware, uploading, lazyLo }); } -export function wrapGroupedDocuments({albumMustBeRenderedFull, message, bubble, messageDiv, chat, loadPromises, noAutoDownload}: { +export function wrapGroupedDocuments({albumMustBeRenderedFull, message, bubble, messageDiv, chat, loadPromises, noAutoDownload, lazyLoadQueue}: { albumMustBeRenderedFull: boolean, message: any, messageDiv: HTMLElement, @@ -1453,6 +1452,7 @@ export function wrapGroupedDocuments({albumMustBeRenderedFull, message, bubble, chat: Chat, loadPromises?: Promise[], noAutoDownload?: boolean, + lazyLoadQueue?: LazyLoadQueue }) { let nameContainer: HTMLElement; const mids = albumMustBeRenderedFull ? chat.getMidsByMid(message.mid) : [message.mid]; @@ -1465,7 +1465,8 @@ export function wrapGroupedDocuments({albumMustBeRenderedFull, message, bubble, const div = wrapDocument({ message, loadPromises, - noAutoDownload + noAutoDownload, + lazyLoadQueue }); const container = document.createElement('div'); diff --git a/src/lib/appManagers/appDownloadManager.ts b/src/lib/appManagers/appDownloadManager.ts index f6267178..b34142c8 100644 --- a/src/lib/appManagers/appDownloadManager.ts +++ b/src/lib/appManagers/appDownloadManager.ts @@ -12,7 +12,6 @@ import rootScope from "../rootScope"; import apiManager from "../mtproto/mtprotoworker"; import { deferredPromise, CancellablePromise } from "../../helpers/cancellablePromise"; import { InputFile } from "../../layer"; -import referenceDatabase, {ReferenceBytes} from "../mtproto/referenceDatabase"; import { getFileNameByLocation } from "../../helpers/fileName"; import CacheStorageController from "../cacheStorage"; import { MOUNT_CLASS_TO } from "../../config/debug"; diff --git a/src/scss/partials/_chatBubble.scss b/src/scss/partials/_chatBubble.scss index 8bb85139..f17c4b73 100644 --- a/src/scss/partials/_chatBubble.scss +++ b/src/scss/partials/_chatBubble.scss @@ -915,15 +915,16 @@ $bubble-margin: .25rem; .preview-resizer { margin: 0; - width: 2rem; - height: 2rem; + width: 3rem; + height: 3rem; float: right; margin-left: .625rem; + margin-top: .1875rem; } .preview { - max-width: unquote('min(2rem, 100%)'); - max-height: unquote('min(2rem, 100%)'); + max-width: unquote('min(3rem, 100%)'); + max-height: unquote('min(3rem, 100%)'); margin: 0; } }