From 5d097409d7984f2532b1ccfd3cc9cdefbf78876d Mon Sep 17 00:00:00 2001 From: Eduard Kuzmenko Date: Sat, 16 Apr 2022 00:19:57 +0300 Subject: [PATCH] Picture-in-Picture fixes --- src/components/appMediaPlaybackController.ts | 57 ++++++++++++-------- src/components/appMediaViewerBase.ts | 18 +++++-- 2 files changed, 49 insertions(+), 26 deletions(-) diff --git a/src/components/appMediaPlaybackController.ts b/src/components/appMediaPlaybackController.ts index 26ce1e1a..da60a6ef 100644 --- a/src/components/appMediaPlaybackController.ts +++ b/src/components/appMediaPlaybackController.ts @@ -546,16 +546,17 @@ export class AppMediaPlaybackController { this.setMedia(media, message); const verify = (element: MediaItem) => element.mid === mid && element.peerId === peerId; - const current = this.listLoader.getCurrent(); + const listLoader = this.listLoader; + const current = listLoader.getCurrent(); if(!current || !verify(current)) { - const previous = this.listLoader.getPrevious(); + const previous = listLoader.getPrevious(); let idx = previous.findIndex(verify); let jumpLength: number; if(idx !== -1) { jumpLength = -(previous.length - idx); } else { - idx = this.listLoader.getNext().findIndex(verify); + idx = listLoader.getNext().findIndex(verify); if(idx !== -1) { jumpLength = idx + 1; } @@ -605,9 +606,10 @@ export class AppMediaPlaybackController { //console.log('on media end'); + const listLoader = this.listLoader; if(this.lockedSwitchers || - (!this.round && this.listLoader.current && !this.listLoader.next.length) || - !this.listLoader.getNext().length || + (!this.round && listLoader.current && !listLoader.next.length) || + !listLoader.getNext().length || !this.next()) { this.stop(); rootScope.dispatchEvent('media_stop'); @@ -704,14 +706,15 @@ export class AppMediaPlaybackController { }; public go = (length: number, dispatchJump?: boolean) => { - if(this.lockedSwitchers) { + const listLoader = this.listLoader; + if(this.lockedSwitchers || !listLoader) { return; } if(this.playingMediaType === 'audio') { - return this.listLoader.goRound(length, dispatchJump); + return listLoader.goRound(length, dispatchJump); } else { - return this.listLoader.go(length, dispatchJump); + return listLoader.go(length, dispatchJump); } }; @@ -772,8 +775,9 @@ export class AppMediaPlaybackController { } public setTargets(current: MediaItem, prev?: MediaItem[], next?: MediaItem[]) { - if(!this.listLoader) { - this.listLoader = new SearchListLoader({ + let listLoader = this.listLoader; + if(!listLoader) { + listLoader = this.listLoader = new SearchListLoader({ loadCount: 10, loadWhenLeft: 5, processItem: (message: Message.message) => { @@ -789,21 +793,21 @@ export class AppMediaPlaybackController { } }); } else { - this.listLoader.reset(); + listLoader.reset(); } const reverse = this.searchContext.folderId !== undefined ? false : true; if(prev) { - this.listLoader.setTargets(prev, next, reverse); + listLoader.setTargets(prev, next, reverse); } else { - this.listLoader.reverse = reverse; + listLoader.reverse = reverse; } - this.listLoader.setSearchContext(this.searchContext); - this.listLoader.current = current; + listLoader.setSearchContext(this.searchContext); + listLoader.current = current; - this.listLoader.load(true); - this.listLoader.load(false); + listLoader.load(true); + listLoader.load(false); } private getPlaybackMediaTypeFromMessage(message: Message.message) { @@ -860,11 +864,18 @@ export class AppMediaPlaybackController { this.next() || this.previous(); } } - - if(media && this.playingMedia === media) { - this.stop(); + + // If it's still not cleaned + if(this.playingMedia === media) { + this.playingMedia = undefined; + this.playingMediaType = undefined; } + // I don't remember what it was for + // if(media && this.playingMedia === media) { + // this.stop(); + // } + if(playPaused) { this.play(); } @@ -894,8 +905,10 @@ export class AppMediaPlaybackController { listenerSetter.removeAll(); }, {once: true}); - listenerSetter.add(video)('play', () => { - this.pause(); + listenerSetter.add(video)('play', (e) => { + if(this.playingMedia !== video) { + this.pause(); + } // if(this.pause()) { // listenerSetter.add(video)('pause', () => { // this.play(); diff --git a/src/components/appMediaViewerBase.ts b/src/components/appMediaViewerBase.ts index 13687ef9..f131538d 100644 --- a/src/components/appMediaViewerBase.ts +++ b/src/components/appMediaViewerBase.ts @@ -23,7 +23,7 @@ import { LazyLoadQueueBase } from "./lazyLoadQueue"; import ProgressivePreloader from "./preloader"; import SwipeHandler from "./swipeHandler"; import { formatFullSentTime } from "../helpers/date"; -import appNavigationController from "./appNavigationController"; +import appNavigationController, { NavigationItem } from "./appNavigationController"; import { Message } from "../layer"; import findUpClassName from "../helpers/dom/findUpClassName"; import renderImageFromUrl, { renderImageFromUrlPromise } from "../helpers/dom/renderImageFromUrl"; @@ -117,6 +117,7 @@ export default class AppMediaViewerBase< protected ctrlKeyDown: boolean; protected releaseSingleMedia: ReturnType; + protected navigationItem: NavigationItem; get target() { return this.listLoader.current; @@ -422,7 +423,9 @@ export default class AppMediaViewerBase< if(this.setMoverAnimationPromise) return Promise.reject(); - appNavigationController.removeByType('media'); + if(this.navigationItem) { + appNavigationController.removeItem(this.navigationItem); + } this.lazyLoadQueue.clear(); @@ -1257,7 +1260,7 @@ export default class AppMediaViewerBase< this.toggleWholeActive(true); if(!IS_MOBILE_SAFARI) { - appNavigationController.pushItem({ + this.navigationItem = { type: 'media', onPop: (canAnimate) => { if(this.setMoverAnimationPromise) { @@ -1266,7 +1269,9 @@ export default class AppMediaViewerBase< this.close(); } - }); + }; + + appNavigationController.pushItem(this.navigationItem); } } @@ -1417,6 +1422,11 @@ export default class AppMediaViewerBase< this.toggleOverlay(!pip); this.toggleGlobalListeners(!pip); + if(this.navigationItem) { + if(pip) appNavigationController.removeItem(this.navigationItem); + else appNavigationController.pushItem(this.navigationItem); + } + if(useController) { if(pip) { // appMediaPlaybackController.toggleSwitchers(true);