From 8a84cd91c22e198b6354a634210268dac435a583 Mon Sep 17 00:00:00 2001
From: Varun Patil <varunpatil@ucla.edu>
Date: Sat, 5 Nov 2022 23:32:25 -0700
Subject: [PATCH] viewer: fix OTD

---
 src/components/Timeline.vue             |  1 +
 src/components/Viewer.vue               | 35 +++++++++++++++++++++----
 src/components/top-matter/OnThisDay.vue |  5 +++-
 3 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/src/components/Timeline.vue b/src/components/Timeline.vue
index c877bfe2..c09248cc 100644
--- a/src/components/Timeline.vue
+++ b/src/components/Timeline.vue
@@ -45,6 +45,7 @@
           <OnThisDay
             v-if="$route.name === 'timeline'"
             :key="config_timelinePath"
+            :viewer="$refs.viewer"
             @load="scrollerManager.adjust()"
           >
           </OnThisDay>
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index b1e5f5b3..ce2e4913 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -418,12 +418,8 @@ export default class Viewer extends Mixins(GlobalMixin) {
 
       // Get full image
       return {
-        src: getPreviewUrl(photo, false, 256),
+        ...this.getItemData(photo),
         msrc: thumbSrc,
-        width: photo.w || undefined,
-        height: photo.h || undefined,
-        thumbCropped: true,
-        photo: photo,
       };
     });
 
@@ -436,6 +432,34 @@ export default class Viewer extends Mixins(GlobalMixin) {
     this.photoswipe.init();
   }
 
+  /** Open with a static list of photos */
+  public async openStatic(photo: IPhoto, list: IPhoto[]) {
+    this.list = list;
+    await this.createBase({
+      index: list.findIndex((p) => p.fileid === photo.fileid),
+    });
+
+    this.globalCount = list.length;
+    this.globalAnchor = 0;
+
+    this.photoswipe.addFilter("itemData", (itemData, index) => {
+      return this.getItemData(this.list[index]);
+    });
+
+    this.photoswipe.init();
+  }
+
+  /** Get base data object */
+  private getItemData(photo: IPhoto) {
+    return {
+      src: getPreviewUrl(photo, false, 256),
+      width: photo.w || undefined,
+      height: photo.h || undefined,
+      thumbCropped: true,
+      photo: photo,
+    };
+  }
+
   /** Get element for thumbnail if it exists */
   private thumbElem(photo: IPhoto) {
     if (!photo) return;
@@ -481,6 +505,7 @@ export default class Viewer extends Mixins(GlobalMixin) {
       this.updateLoading(1);
       for await (const p of dav.favoritePhotos([photo], val)) {
         if (!p[0]) return;
+        this.$forceUpdate();
       }
     } finally {
       this.updateLoading(-1);
diff --git a/src/components/top-matter/OnThisDay.vue b/src/components/top-matter/OnThisDay.vue
index c3b9a14b..fac25666 100644
--- a/src/components/top-matter/OnThisDay.vue
+++ b/src/components/top-matter/OnThisDay.vue
@@ -73,6 +73,9 @@ interface IYear {
 export default class OnThisDay extends Mixins(GlobalMixin) {
   private getPreviewUrl = getPreviewUrl;
 
+  @Prop()
+  private viewer: any;
+
   @Emit("load")
   onload() {}
 
@@ -191,7 +194,7 @@ export default class OnThisDay extends Mixins(GlobalMixin) {
 
   click(year: IYear) {
     const allPhotos = this.years.flatMap((y) => y.photos);
-    // this.viewerManager.open(year.preview, allPhotos);
+    this.viewer.openStatic(year.preview, allPhotos);
   }
 }
 </script>