viewer: debounce sidebar updates

Signed-off-by: Varun Patil <radialapps@gmail.com>
pull/767/head
Varun Patil 2023-08-03 20:31:53 -07:00
parent baf3023758
commit b7f6301c4e
1 changed files with 36 additions and 10 deletions

View File

@ -206,6 +206,7 @@ import LivePhotoIcon from 'vue-material-design-icons/MotionPlayOutline.vue';
import AlbumIcon from 'vue-material-design-icons/ImageAlbum.vue'; import AlbumIcon from 'vue-material-design-icons/ImageAlbum.vue';
const SLIDESHOW_MS = 5000; const SLIDESHOW_MS = 5000;
const SIDEBAR_DEBOUNCE_MS = 500;
const BODY_HAS_VIEWER = 'has-viewer'; const BODY_HAS_VIEWER = 'has-viewer';
const BODY_VIEWER_VIDEO = 'viewer-video'; const BODY_VIEWER_VIDEO = 'viewer-video';
const BODY_VIEWER_FULLY_OPENED = 'viewer-fully-opened'; const BODY_VIEWER_FULLY_OPENED = 'viewer-fully-opened';
@ -266,6 +267,8 @@ export default defineComponent({
/** Timer to move to next photo */ /** Timer to move to next photo */
slideshowTimer: 0, slideshowTimer: 0,
/** Timer to debounce changes to sidebar */
sidebarUpdateTimer: 0,
}), }),
mounted() { mounted() {
@ -994,18 +997,41 @@ export default defineComponent({
window.location.href = utils.getLivePhotoVideoUrl(photo, false); window.location.href = utils.getLivePhotoVideoUrl(photo, false);
}, },
/** Open the sidebar */ /**
async openSidebar(photo?: IPhoto) { * Open the sidebar.
globalThis.mSidebar.setTab('memories-metadata'); *
photo ??= this.currentPhoto!; * Calls to this function are debounced to prevent too many updates
* to the sidebar while the user is scrolling through photos.
*/
async openSidebar() {
const photo = this.currentPhoto!;
if (this.routeIsPublic || this.isLocal) { // Update the sidebar
globalThis.mSidebar.open(photo); const update = async () => {
} else { const abort = () => !this.isOpen || photo !== this.currentPhoto;
const fileInfo = (await dav.getFiles([photo]))[0]; if (abort()) return;
const forceNative = fileInfo?.originalFilename?.startsWith('/files/');
globalThis.mSidebar.open(photo, fileInfo?.filename, forceNative); globalThis.mSidebar.setTab('memories-metadata');
if (this.routeIsPublic || this.isLocal) {
globalThis.mSidebar.open(photo);
} else {
const fileInfo = (await dav.getFiles([photo]))[0];
if (abort()) return;
const forceNative = fileInfo?.originalFilename?.startsWith('/files/');
globalThis.mSidebar.open(photo, fileInfo?.filename, forceNative);
}
};
// Do not debounce the first call
let callback = update;
if (!this.sidebarUpdateTimer) {
callback();
callback = async () => {};
} }
// Debounce the rest
utils.setRenewingTimeout(this, 'sidebarUpdateTimer', callback, SIDEBAR_DEBOUNCE_MS);
}, },
handleAppSidebarOpen() { handleAppSidebarOpen() {