Fix rendering video thumbnails

src/components/appMediaViewer.ts

@@ -964,7 +964,7 @@ class AppMediaViewerBase<ContentAdditionType extends string, ButtonsAdditionType
         img = new Image();
         img.src = cacheContext.url;
       } else {
-        const gotThumb = appPhotosManager.getStrippedThumbIfNeeded(media, true);
+        const gotThumb = appPhotosManager.getStrippedThumbIfNeeded(media, cacheContext, true);
         if(gotThumb) {
           thumbPromise = gotThumb.loadPromise;
           img = gotThumb.image;

src/components/wrappers.ts

@@ -36,7 +36,7 @@ import { animateSingle } from '../helpers/animation';
 import renderImageFromUrl from '../helpers/dom/renderImageFromUrl';
 import sequentialDom from '../helpers/sequentialDom';
 import { fastRaf } from '../helpers/schedulers';
-import appDownloadManager, { DownloadBlob } from '../lib/appManagers/appDownloadManager';
+import appDownloadManager, { DownloadBlob, ThumbCache } from '../lib/appManagers/appDownloadManager';
 import appStickersManager from '../lib/appManagers/appStickersManager';
 import { cancelEvent } from '../helpers/dom/cancelEvent';
 import { attachClickEvent } from '../helpers/dom/clickEvent';
@@ -698,6 +698,7 @@ export function wrapPhoto({photo, message, container, boxWidth, boxHeight, withT
   let loadThumbPromise: Promise<any> = Promise.resolve();
   let thumbImage: HTMLImageElement;
   let image: HTMLImageElement;
+  let cacheContext: ThumbCache;
   // if(withTail) {
   //   image = wrapMediaWithTail(photo, message, container, boxWidth, boxHeight, isOut);
   // } else {
@@ -707,6 +708,7 @@ export function wrapPhoto({photo, message, container, boxWidth, boxHeight, withT
       const set = appPhotosManager.setAttachmentSize(photo, container, boxWidth, boxHeight, undefined, message);
       size = set.photoSize;
       isFit = set.isFit;
+      cacheContext = appDownloadManager.getCacheContext(photo, size.type);
 
       if(!isFit) {
         aspecter = document.createElement('div');
@@ -714,7 +716,7 @@ export function wrapPhoto({photo, message, container, boxWidth, boxHeight, withT
         aspecter.style.width = set.size.width + 'px';
         aspecter.style.height = set.size.height + 'px';
 
-        const gotThumb = appPhotosManager.getStrippedThumbIfNeeded(photo, !noBlur, true);
+        const gotThumb = appPhotosManager.getStrippedThumbIfNeeded(photo, cacheContext, !noBlur, true);
         if(gotThumb) {
           loadThumbPromise = gotThumb.loadPromise;
           const thumbImage = gotThumb.image; // local scope
@@ -725,9 +727,15 @@ export function wrapPhoto({photo, message, container, boxWidth, boxHeight, withT
         container.classList.add('media-container-fitted');
         container.append(aspecter);
       }
+    } else {
+      if(!size) {
+        size = appPhotosManager.choosePhotoSize(photo, boxWidth, boxHeight, true);
+      }
+      
+      cacheContext = appDownloadManager.getCacheContext(photo, size?.type);
     }
 
-    const gotThumb = appPhotosManager.getStrippedThumbIfNeeded(photo, !noBlur);
+    const gotThumb = appPhotosManager.getStrippedThumbIfNeeded(photo, cacheContext, !noBlur);
     if(gotThumb) {
       loadThumbPromise = Promise.all([loadThumbPromise, gotThumb.loadPromise]);
       thumbImage = gotThumb.image;
@@ -739,8 +747,6 @@ export function wrapPhoto({photo, message, container, boxWidth, boxHeight, withT
   image.classList.add('media-photo');
   
   //console.log('wrapPhoto downloaded:', photo, photo.downloaded, container);
-  
-  const cacheContext = appDownloadManager.getCacheContext(photo, size?.type/* photo._ === 'photo' ? size?.type : undefined */);
 
   const needFadeIn = (thumbImage || !cacheContext.downloaded) && rootScope.settings.animationsEnabled;
   if(needFadeIn) {

src/lib/appManagers/appPhotosManager.ts

@@ -19,7 +19,7 @@ import { InputFileLocation, InputMedia, Photo, PhotoSize, PhotosPhotos } from ".
 import apiManager from "../mtproto/mtprotoworker";
 import referenceDatabase, { ReferenceContext } from "../mtproto/referenceDatabase";
 import { MyDocument } from "./appDocsManager";
-import appDownloadManager from "./appDownloadManager";
+import appDownloadManager, { ThumbCache } from "./appDownloadManager";
 import appUsersManager from "./appUsersManager";
 import blur from "../../helpers/blur";
 import { MOUNT_CLASS_TO } from "../../config/debug";
@@ -269,10 +269,9 @@ export class AppPhotosManager {
     return {photoSize, size, isFit};
   }
 
-  public getStrippedThumbIfNeeded(photo: MyPhoto | MyDocument, useBlur: boolean, ignoreCache = false): ReturnType<AppPhotosManager['getImageFromStrippedThumb']> {
+  public getStrippedThumbIfNeeded(photo: MyPhoto | MyDocument, cacheContext: ThumbCache, useBlur: boolean, ignoreCache = false): ReturnType<AppPhotosManager['getImageFromStrippedThumb']> {
-    const cacheContext = appDownloadManager.getCacheContext(photo);
     if(!cacheContext.downloaded || (['video', 'gif'] as MyDocument['type'][]).includes((photo as MyDocument).type) || ignoreCache) {
-      if(photo._ === 'document' && cacheContext.downloaded) {
+      if(photo._ === 'document' && cacheContext.downloaded && !ignoreCache) {
         return null;
       }