viewer: refresh slide on gobals update (#1194)

Signed-off-by: Varun Patil <radialapps@gmail.com>

src/components/viewer/Viewer.vue

@@ -751,8 +751,11 @@ export default defineComponent({
 
             // If the anchor shifts to the left, we need to shift the index
             // by the same amount. This happens synchronously, so update first.
-            if (globals.anchor < this.globalAnchor) {
+            // Also check if the current position is invalid here
+            if (globals.anchor != this.globalAnchor) {
               goTo = this.photoswipe.currIndex - (this.globalAnchor - globals.anchor);
+            } else if (this.photoswipe.currIndex >= globals.count || this.photoswipe.currIndex < 0) {
+              goTo = this.photoswipe.currIndex; // equivalent to above
             }
 
             // Update the global anchor and count
@@ -762,12 +765,14 @@ export default defineComponent({
             // Go to the new index if needed
             if (goTo === null) {
               // no change
-            } else if (this.photoswipe.currIndex >= this.globalCount) {
-              this.photoswipe.goTo(this.globalCount - 1);
-            } else if (goTo < 0) {
-              this.photoswipe.goTo(0);
             } else {
+              // Change the index to the new one with clamp
+              goTo = utils.clamp(goTo, 0, globals.count - 1);
               this.photoswipe.goTo(goTo);
+
+              // Make sure the slide is current, since this call is deferred
+              // https://github.com/pulsejet/memories/issues/1194
+              this.photoswipe.refreshSlideContent(goTo);
             }
           },
           0,

src/services/utils/algo.ts

@@ -116,6 +116,11 @@ export function isNumber<T>(num: T): boolean {
   return !isNaN(cast) && isFinite(cast);
 }
 
+/** Clamp number between two numbers */
+export function clamp(num: number, min: number, max: number): number {
+  return Math.min(Math.max(num, min), max);
+}
+
 /** Check if a value is truthy */
 export function truthy<T>(value: T): value is NonNullable<T> {
   return !!value;