saltfish 0.3.86 → 0.3.91

package/dist/saltfish-playlist-player.es.js

@@ -699,32 +699,8 @@ class PlayerStateMachine {
     this.config = config;
     this.currentState = config.initial;
     this.context = initialContext;
-    this.setupDefaultActions();
     this.runEntryActions(this.currentState);
   }
-  /**
-   * Set up default action handlers for common operations
-   */
-  setupDefaultActions() {
-    this.actionHandlers = {
-      ...this.actionHandlers,
-      logStateEntry: (_context) => {
-        log(`State Machine: Entered ${this.currentState} state`);
-      },
-      logErrorEvent: (_context, event) => {
-        if ((event == null ? void 0 : event.type) === "ERROR") {
-          log(`State Machine: ERROR event received with message: ${event.error.message}`);
-        }
-      },
-      logStepTransition: (_context, event) => {
-        if ((event == null ? void 0 : event.type) === "TRANSITION_TO_STEP") {
-          log(`State Machine: Transitioning to new step: ${event.step.id}`);
-        }
-      },
-      logErrorRecovery: () => {
-      }
-    };
-  }
   /**
    * Register custom action handlers
    * @param actions - Object mapping action names to handler functions
@@ -833,18 +809,14 @@ const playerStateMachineConfig = {
       on: {
         "INITIALIZE": { target: "idle" },
         "LOAD_MANIFEST": { target: "loading" }
-      },
-      entry: ["logStateEntry"]
+      }
     },
     "loading": {
       on: {
         "MANIFEST_LOADED": { target: "paused" },
-        "ERROR": {
-          target: "error",
-          actions: ["logErrorEvent"]
-        }
+        "ERROR": { target: "error" }
       },
-      entry: ["logStateEntry", "showLoadingState"],
+      entry: ["showLoadingState"],
       exit: ["hideLoadingState"]
     },
     "playing": {
@@ -853,15 +825,12 @@ const playerStateMachineConfig = {
         "MINIMIZE": { target: "minimized" },
         "VIDEO_FINISHED_WAIT": { target: "waitingForInteraction" },
         "AUTOPLAY_FALLBACK": { target: "autoplayBlocked" },
-        "TRANSITION_TO_STEP": {
-          target: "playing",
-          actions: ["logStepTransition"]
-        },
+        "TRANSITION_TO_STEP": { target: "playing" },
         "ERROR": { target: "error" },
         "COMPLETE_PLAYLIST": { target: "completed" },
         "COMPLETE_PLAYLIST_WAITING_FOR_INTERACTION": { target: "completedWaitingForInteraction" }
       },
-      entry: ["logStateEntry", "startVideoPlayback", "showVideoControls", "hidePlayButton"],
+      entry: ["startVideoPlayback", "showVideoControls", "hidePlayButton"],
       exit: ["pauseVideoPlayback"]
     },
     "paused": {
@@ -870,19 +839,16 @@ const playerStateMachineConfig = {
         "START_IDLE_MODE": { target: "idleMode" },
         "AUTOPLAY_FALLBACK": { target: "autoplayBlocked" },
         "MINIMIZE": { target: "minimized" },
-        "TRANSITION_TO_STEP": {
-          target: "playing",
-          actions: ["logStepTransition"]
-        }
+        "TRANSITION_TO_STEP": { target: "playing" }
       },
-      entry: ["logStateEntry", "pauseVideoPlayback", "showPlayButton"]
+      entry: ["pauseVideoPlayback", "showPlayButton"]
     },
     "minimized": {
       on: {
         "MAXIMIZE": { target: "playing" },
         "EXIT": { target: "closing" }
       },
-      entry: ["logStateEntry", "pauseVideoPlayback"]
+      entry: ["pauseVideoPlayback"]
     },
     "waitingForInteraction": {
       on: {
@@ -891,12 +857,9 @@ const playerStateMachineConfig = {
         "MINIMIZE": { target: "minimized" },
         "COMPLETE_PLAYLIST": { target: "completed" },
         "COMPLETE_PLAYLIST_WAITING_FOR_INTERACTION": { target: "completedWaitingForInteraction" },
-        "TRANSITION_TO_STEP": {
-          target: "playing",
-          actions: ["logStepTransition"]
-        }
+        "TRANSITION_TO_STEP": { target: "playing" }
       },
-      entry: ["logStateEntry", "showPlayButton"]
+      entry: ["showPlayButton"]
     },
     "autoplayBlocked": {
       on: {
@@ -904,7 +867,7 @@ const playerStateMachineConfig = {
         "TRANSITION_TO_STEP": { target: "playing" },
         "MINIMIZE": { target: "minimized" }
       },
-      entry: ["logStateEntry", "enterCompactMode", "startMutedLoopedVideo", "hideVideoControls", "showPlayButton", "enablePlayButtonProminent"],
+      entry: ["enterCompactMode", "startMutedLoopedVideo", "hideVideoControls", "showPlayButton", "enablePlayButtonProminent"],
       exit: ["disablePlayButtonProminent", "showVideoControls", "exitCompactMode"]
     },
     "idleMode": {
@@ -913,43 +876,37 @@ const playerStateMachineConfig = {
         "TRANSITION_TO_STEP": { target: "playing" },
         "MINIMIZE": { target: "minimized" }
       },
-      entry: ["logStateEntry", "startIdleModeVideo", "hideVideoControls", "showPlayButton", "enablePlayButtonProminent"],
+      entry: ["startIdleModeVideo", "hideVideoControls", "showPlayButton", "enablePlayButtonProminent"],
       exit: ["disablePlayButtonProminent", "showVideoControls", "exitCompactMode"]
     },
     "error": {
       on: {
         "INITIALIZE": { target: "idle" },
-        "PLAY": {
-          target: "playing",
-          actions: ["logErrorRecovery"]
-        },
+        "PLAY": { target: "playing" },
         "AUTOPLAY_FALLBACK": { target: "autoplayBlocked" }
       },
-      entry: ["logStateEntry", "handleError", "showPlayButton"],
+      entry: ["handleError", "showPlayButton"],
       exit: ["hideError"]
     },
     "completedWaitingForInteraction": {
       on: {
         "COMPLETE_PLAYLIST": { target: "completed" },
         "INITIALIZE": { target: "idle" },
-        "TRANSITION_TO_STEP": {
-          target: "playing",
-          actions: ["logStepTransition"]
-        },
+        "TRANSITION_TO_STEP": { target: "playing" },
         "PLAY": { target: "playing" },
         "MINIMIZE": { target: "minimized" }
       },
-      entry: ["logStateEntry", "showPlayButton"]
+      entry: ["showPlayButton"]
     },
     "completed": {
       on: {
         "INITIALIZE": { target: "idle" }
       },
-      entry: ["logStateEntry", "trackPlaylistComplete"]
+      entry: ["trackPlaylistComplete"]
     },
     "closing": {
       on: {},
-      entry: ["logStateEntry", "triggerPlaylistDismissed"]
+      entry: ["triggerPlaylistDismissed"]
     }
   }
 };
@@ -1212,6 +1169,13 @@ const saltfishStore = createStore()(
       const newState = _stateMachine.send(event);
       return newState;
     };
+    const dispatch = (event) => {
+      const newState = _stateMachine.send(event);
+      set2((state) => {
+        state.currentState = newState;
+      });
+      return newState;
+    };
     return {
       // State
       config: null,
@@ -1273,7 +1237,51 @@ const saltfishStore = createStore()(
       },
       setUserData: (userData) => {
         set2((state) => {
-          state.userData = userData;
+          var _a;
+          const incoming = (userData == null ? void 0 : userData.watchedPlaylists) || {};
+          const existing = ((_a = state.userData) == null ? void 0 : _a.watchedPlaylists) || {};
+          const merged = { ...incoming };
+          for (const [playlistId, local] of Object.entries(existing)) {
+            if (!local) {
+              continue;
+            }
+            const next = merged[playlistId];
+            const localTerminal = local.status === "completed" || local.status === "dismissed";
+            const nextTerminal = !!next && (next.status === "completed" || next.status === "dismissed");
+            if (localTerminal && !nextTerminal) {
+              merged[playlistId] = local;
+              log(`Store: setUserData preserved local '${local.status}' status for playlist ${playlistId} (incoming was '${(next == null ? void 0 : next.status) ?? "absent"}')`);
+            } else if (next) {
+              const visitCount = Math.max(local.visitCount ?? 0, next.visitCount ?? 0);
+              if ((next.visitCount ?? 0) !== visitCount) {
+                merged[playlistId] = { ...next, visitCount };
+              }
+            }
+          }
+          state.userData = { ...userData, watchedPlaylists: merged };
+        });
+      },
+      updateWatchedPlaylist: (playlistId, status, currentStepId) => {
+        set2((state) => {
+          if (!state.userData) {
+            state.userData = { watchedPlaylists: {} };
+          }
+          if (!state.userData.watchedPlaylists) {
+            state.userData.watchedPlaylists = {};
+          }
+          const existing = state.userData.watchedPlaylists[playlistId];
+          const previousStatus = existing == null ? void 0 : existing.status;
+          const previousVisitCount = (existing == null ? void 0 : existing.visitCount) ?? 0;
+          const completesVisit = (status === "completed" || status === "dismissed") && previousStatus !== status;
+          const now = Date.now();
+          state.userData.watchedPlaylists[playlistId] = {
+            status,
+            // Completed playlists restart from the beginning, so they keep no step.
+            currentStepId: status === "completed" ? null : currentStepId ?? state.currentStepId ?? null,
+            timestamp: now,
+            lastProgressAt: now,
+            visitCount: completesVisit ? previousVisitCount + 1 : previousVisitCount
+          };
         });
       },
       setManifest: (manifest, startStepId) => {
@@ -1319,9 +1327,7 @@ const saltfishStore = createStore()(
       goToStep: (stepId) => {
         const { manifest } = get();
         if (stepId === "completed") {
-          set2((state) => {
-            state.currentState = transitionState({ type: "COMPLETE_PLAYLIST" });
-          });
+          dispatch({ type: "COMPLETE_PLAYLIST" });
           return;
         }
         if (manifest && manifest.steps.some((step) => step.id === stepId)) {
@@ -1406,9 +1412,7 @@ const saltfishStore = createStore()(
         });
       },
       completePlaylist: () => {
-        set2((state) => {
-          state.currentState = transitionState({ type: "COMPLETE_PLAYLIST" });
-        });
+        dispatch({ type: "COMPLETE_PLAYLIST" });
       },
       // Add new method to reset playlist state while preserving config and user data
       resetForNewPlaylist: () => {
@@ -1445,9 +1449,7 @@ const saltfishStore = createStore()(
       },
       // Method to send events to the state machine without exposing it
       sendStateMachineEvent: (event) => {
-        set2((state) => {
-          state.currentState = transitionState(event);
-        });
+        dispatch(event);
       },
       // New action to update progress when transitioning to completion waiting state
       updateProgressWithCompletion: (playlistId, currentStepId) => {
@@ -3222,14 +3224,110 @@ class PlaylistOrchestrator {
   destroy() {
   }
 }
+class CursorAnimationScheduler {
+  constructor(managers, logPrefix) {
+    __publicField(this, "listener", null);
+    __publicField(this, "videoElement", null);
+    __publicField(this, "stepId", null);
+    this.managers = managers;
+    this.logPrefix = logPrefix;
+  }
+  /**
+   * Cleans up the active cursor animation time listener.
+   * @param stepId - Optional step ID to verify we're cleaning up the right listener
+   */
+  cleanup(stepId) {
+    if (stepId && this.stepId && stepId !== this.stepId) {
+      log(`${this.logPrefix}: Skipping cleanup - stepId mismatch (requested: ${stepId}, current: ${this.stepId})`);
+      return;
+    }
+    if (this.listener && this.videoElement) {
+      this.videoElement.removeEventListener("timeupdate", this.listener);
+      this.listener = null;
+      this.videoElement = null;
+      this.stepId = null;
+    }
+  }
+  /**
+   * Schedules a cursor animation to run either immediately or at a specific video time.
+   */
+  schedule(animation, stepId) {
+    this.cleanup();
+    let showAtSeconds = animation.showAtSeconds ?? 0;
+    if (typeof showAtSeconds !== "number" || !isFinite(showAtSeconds)) {
+      log(`${this.logPrefix}: Invalid showAtSeconds value (${showAtSeconds}), defaulting to 0`);
+      showAtSeconds = 0;
+    }
+    if (showAtSeconds < 0) {
+      log(`${this.logPrefix}: Negative showAtSeconds value (${showAtSeconds}), treating as immediate (0)`);
+      showAtSeconds = 0;
+    }
+    if (showAtSeconds <= 0) {
+      log(`${this.logPrefix}: Starting immediate cursor animation for step ${stepId}`);
+      this.managers.cursorManager.animate(animation);
+      return;
+    }
+    log(`${this.logPrefix}: Scheduling cursor animation for step ${stepId} at ${showAtSeconds} seconds`);
+    const videoElement = this.managers.videoManager.getVideoElement();
+    if (!videoElement) {
+      log(`${this.logPrefix}: Warning - No video element found, cannot schedule delayed cursor animation`);
+      return;
+    }
+    let animationTriggered = false;
+    let warningLogged = false;
+    const timeUpdateHandler = () => {
+      if (animationTriggered) {
+        return;
+      }
+      const currentTime = videoElement.currentTime;
+      const duration = videoElement.duration;
+      if (duration && !isNaN(duration) && showAtSeconds > duration && !warningLogged) {
+        log(`${this.logPrefix}: showAtSeconds (${showAtSeconds}s) exceeds video duration (${duration}s) for step ${stepId}. Triggering animation immediately.`);
+        warningLogged = true;
+        animationTriggered = true;
+        this.cleanup();
+        this.managers.cursorManager.animate(animation);
+        return;
+      }
+      if (currentTime >= showAtSeconds) {
+        animationTriggered = true;
+        log(`${this.logPrefix}: Triggering cursor animation at ${currentTime} seconds`);
+        this.cleanup();
+        this.managers.cursorManager.animate(animation);
+      }
+    };
+    const endedHandler = () => {
+      if (animationTriggered) {
+        return;
+      }
+      const store = getSaltfishStore();
+      if (store.currentStepId !== stepId) {
+        log(`${this.logPrefix}: Video ended but step changed (was ${stepId}, now ${store.currentStepId}). Not triggering cursor animation.`);
+        this.cleanup(stepId);
+        return;
+      }
+      const duration = videoElement.duration;
+      log(`${this.logPrefix}: Video ended before cursor animation could trigger (showAtSeconds: ${showAtSeconds}s, duration: ${duration}s). Triggering at end.`);
+      animationTriggered = true;
+      this.managers.cursorManager.animate(animation);
+      this.cleanup();
+    };
+    this.listener = () => {
+      timeUpdateHandler();
+    };
+    this.videoElement = videoElement;
+    this.stepId = stepId;
+    videoElement.addEventListener("timeupdate", this.listener);
+    videoElement.addEventListener("ended", endedHandler, { once: true });
+  }
+}
 class StateMachineActionHandler {
   constructor(managers) {
     __publicField(this, "managers");
     __publicField(this, "destroyCallback", null);
-    __publicField(this, "cursorAnimationListener", null);
-    __publicField(this, "cursorAnimationVideoElement", null);
-    __publicField(this, "cursorAnimationStepId", null);
+    __publicField(this, "cursorScheduler");
     this.managers = managers;
+    this.cursorScheduler = new CursorAnimationScheduler(managers, "StateMachineActionHandler");
   }
   /**
    * Set the destroy callback for player destruction
@@ -3243,63 +3341,25 @@ class StateMachineActionHandler {
   registerStateMachineActions() {
     const store = getSaltfishStore();
     store.registerStateMachineActions({
-      startVideoPlayback: (context) => {
-        this.handleStartVideoPlayback(context);
-      },
-      pauseVideoPlayback: () => {
-        this.handlePauseVideoPlayback();
-      },
-      startMutedLoopedVideo: () => {
-        this.handleStartMutedLoopedVideo();
-      },
-      startIdleModeVideo: (context) => {
-        this.handleStartIdleModeVideo(context);
-      },
-      trackPlaylistComplete: () => {
-        this.handleTrackPlaylistComplete();
-      },
-      handleError: (context) => {
-        this.handleError(context);
-      },
-      hideError: () => {
-        this.handleHideError();
-      },
-      showLoadingState: () => {
-        this.handleShowLoadingState();
-      },
-      hideLoadingState: () => {
-        this.handleHideLoadingState();
-      },
-      hideVideoControls: () => {
-        this.handleHideVideoControls();
-      },
-      showVideoControls: () => {
-        this.handleShowVideoControls();
-      },
-      showPlayButton: () => {
-        this.handleShowPlayButton();
-      },
-      hidePlayButton: () => {
-        this.handleHidePlayButton();
-      },
-      enablePlayButtonProminent: () => {
-        this.handleEnablePlayButtonProminent();
-      },
-      disablePlayButtonProminent: () => {
-        this.handleDisablePlayButtonProminent();
-      },
-      enterCompactMode: () => {
-        this.handleEnterCompactMode();
-      },
-      exitCompactMode: () => {
-        this.handleExitCompactMode();
-      },
-      triggerPlaylistDismissed: () => {
-        this.handleTriggerPlaylistDismissed();
-      },
-      scheduleDestroy: () => {
-        this.handleScheduleDestroy();
-      }
+      startVideoPlayback: (context) => this.handleStartVideoPlayback(context),
+      startIdleModeVideo: (context) => this.handleStartIdleModeVideo(context),
+      handleError: (context) => this.handleError(context),
+      pauseVideoPlayback: () => this.handlePauseVideoPlayback(),
+      startMutedLoopedVideo: () => this.handleStartMutedLoopedVideo(),
+      trackPlaylistComplete: () => this.handleTrackPlaylistComplete(),
+      hideError: () => this.handleHideError(),
+      showLoadingState: () => this.handleShowLoadingState(),
+      hideLoadingState: () => this.handleHideLoadingState(),
+      hideVideoControls: () => this.handleHideVideoControls(),
+      showVideoControls: () => this.handleShowVideoControls(),
+      showPlayButton: () => this.handleShowPlayButton(),
+      hidePlayButton: () => this.handleHidePlayButton(),
+      enablePlayButtonProminent: () => this.handleEnablePlayButtonProminent(),
+      disablePlayButtonProminent: () => this.handleDisablePlayButtonProminent(),
+      enterCompactMode: () => this.handleEnterCompactMode(),
+      exitCompactMode: () => this.handleExitCompactMode(),
+      triggerPlaylistDismissed: () => this.handleTriggerPlaylistDismissed(),
+      scheduleDestroy: () => this.handleScheduleDestroy()
     });
   }
   /**
@@ -3367,87 +3427,7 @@ class StateMachineActionHandler {
     return null;
   }
   destroy() {
-    this.cleanupCursorAnimationListener();
-  }
-  /**
-   * Cleans up the active cursor animation time listener
-   * @param stepId - Optional step ID to verify we're cleaning up the right listener
-   */
-  cleanupCursorAnimationListener(stepId) {
-    if (stepId && this.cursorAnimationStepId && stepId !== this.cursorAnimationStepId) {
-      log(`StateMachineActionHandler: Skipping cleanup - stepId mismatch (requested: ${stepId}, current: ${this.cursorAnimationStepId})`);
-      return;
-    }
-    if (this.cursorAnimationListener && this.cursorAnimationVideoElement) {
-      this.cursorAnimationVideoElement.removeEventListener("timeupdate", this.cursorAnimationListener);
-      this.cursorAnimationListener = null;
-      this.cursorAnimationVideoElement = null;
-      this.cursorAnimationStepId = null;
-    }
-  }
-  /**
-   * Schedules a cursor animation to run either immediately or at a specific video time
-   * Note: Works for both video and audio-only steps (audio files use the same video element)
-   */
-  scheduleCursorAnimation(animation, stepId) {
-    this.cleanupCursorAnimationListener();
-    let showAtSeconds = animation.showAtSeconds ?? 0;
-    if (typeof showAtSeconds !== "number" || !isFinite(showAtSeconds)) {
-      showAtSeconds = 0;
-    }
-    if (showAtSeconds < 0) {
-      showAtSeconds = 0;
-    }
-    if (showAtSeconds <= 0) {
-      this.managers.cursorManager.animate(animation);
-    } else {
-      const videoElement = this.managers.videoManager.getVideoElement();
-      if (!videoElement) {
-        return;
-      }
-      let animationTriggered = false;
-      let warningLogged = false;
-      const timeUpdateHandler = () => {
-        if (animationTriggered) {
-          return;
-        }
-        const currentTime = videoElement.currentTime;
-        const duration = videoElement.duration;
-        if (duration && !isNaN(duration) && showAtSeconds > duration && !warningLogged) {
-          warningLogged = true;
-          animationTriggered = true;
-          this.cleanupCursorAnimationListener();
-          this.managers.cursorManager.animate(animation);
-          return;
-        }
-        if (currentTime >= showAtSeconds) {
-          animationTriggered = true;
-          this.cleanupCursorAnimationListener();
-          this.managers.cursorManager.animate(animation);
-        }
-      };
-      const endedHandler = () => {
-        if (!animationTriggered) {
-          const store = getSaltfishStore();
-          if (store.currentStepId !== stepId) {
-            log(`StateMachineActionHandler: Video ended but step changed (was ${stepId}, now ${store.currentStepId}). Not triggering cursor animation.`);
-            this.cleanupCursorAnimationListener(stepId);
-            return;
-          }
-          videoElement.duration;
-          animationTriggered = true;
-          this.managers.cursorManager.animate(animation);
-          this.cleanupCursorAnimationListener();
-        }
-      };
-      this.cursorAnimationListener = () => {
-        timeUpdateHandler();
-      };
-      this.cursorAnimationVideoElement = videoElement;
-      this.cursorAnimationStepId = stepId;
-      videoElement.addEventListener("timeupdate", this.cursorAnimationListener);
-      videoElement.addEventListener("ended", endedHandler, { once: true });
-    }
+    this.cursorScheduler.cleanup();
   }
   /**
    * Validates URL requirement for a specific step with retry logic
@@ -3494,158 +3474,155 @@ class StateMachineActionHandler {
     this.managers.uiManager.showPlayer();
     const videoUrl = this.getVideoUrl(currentStep);
     const isAudioFallback = this.isUsingAudioFallback(currentStep);
-    if (isAudioFallback) {
-      const store = getSaltfishStore();
-      const manifest = store.manifest;
-      const posterUrl = currentStep.gifUrl;
-      const avatarThumbnailUrl = manifest == null ? void 0 : manifest.avatarThumbnailUrl;
-      this.managers.videoManager.showAudioFallbackOverlay(posterUrl, avatarThumbnailUrl);
-    } else {
-      this.managers.videoManager.hideAudioFallbackOverlay();
-    }
+    this.showOrHideAudioOverlay(currentStep, isAudioFallback);
     try {
       this.managers.interactionManager.clearButtons();
       if (currentStep.buttons) {
         this.managers.interactionManager.createButtons(currentStep.buttons);
       }
-      log(`StateMachineActionHandler: Step has cursor animations: ${!!(currentStep.cursorAnimations && currentStep.cursorAnimations.length > 0)}`);
       const hasSpecialTransitions = currentStep.buttons && currentStep.buttons.length > 0 || currentStep.transitions.some(
         (t) => t.type === "dom-click" || t.type === "url-path" || t.type === "dom-element-visible"
       );
-      const completionPolicy = hasSpecialTransitions ? "manual" : "auto";
       if (hasSpecialTransitions) {
         log("StateMachineActionHandler: Setting up transitions immediately for step with special transitions");
         this.managers.transitionManager.setupTransitions(currentStep, false, true);
       }
-      this.managers.videoManager.setCompletionPolicy(completionPolicy, () => {
-        var _a;
-        const store = getSaltfishStore();
-        if (!hasSpecialTransitions) {
-          const timeoutTransition = currentStep.transitions.find((t) => t.type === "timeout");
-          const hasNonZeroTimeout = timeoutTransition && timeoutTransition.timeout && timeoutTransition.timeout > 0;
-          if (hasNonZeroTimeout) {
-            log(`StateMachineActionHandler: Setting up transitions after video ended with ${timeoutTransition.timeout}ms delay`);
-            this.managers.transitionManager.setupTransitions(currentStep, false);
-          } else {
-            log("StateMachineActionHandler: Setting up transitions after video ended (immediate)");
-            this.managers.transitionManager.setupTransitions(currentStep, true);
-          }
-          const hasValidNextSteps = currentStep.transitions.some((transition) => {
-            return store.manifest.steps.some((s) => s.id === transition.nextStep);
-          });
-          if (!hasValidNextSteps) {
-            log("StateMachineActionHandler: No valid next steps found, completing playlist");
-            store.sendStateMachineEvent({
-              type: "COMPLETE_PLAYLIST"
-            });
-          }
-        } else {
-          const timeoutTransition = currentStep.transitions.find((t) => t.type === "timeout");
-          const hasStepTransitionButtons = (_a = currentStep.buttons) == null ? void 0 : _a.some(
-            (button) => button.action.type === "goto" || button.action.type === "next"
-          );
-          if (timeoutTransition && !hasStepTransitionButtons) {
-            const timeout = timeoutTransition.timeout || 0;
-            log(`StateMachineActionHandler: Video ended, setting up timeout transition to ${timeoutTransition.nextStep} with ${timeout}ms delay`);
-            setTimeout(() => {
-              var _a2;
-              const currentStore = getSaltfishStore();
-              if (currentStore.currentStepId === currentStep.id && (currentStore.currentState === "waitingForInteraction" || currentStore.currentState === "playing")) {
-                log(`StateMachineActionHandler: Timeout expired (${timeout}ms), transitioning to ${timeoutTransition.nextStep}`);
-                (_a2 = currentStore.goToStep) == null ? void 0 : _a2.call(currentStore, timeoutTransition.nextStep);
-              } else {
-                log(`StateMachineActionHandler: Timeout cancelled - step changed or state is ${currentStore.currentState}`);
-              }
-            }, timeout);
-            store.sendStateMachineEvent({
-              type: "VIDEO_FINISHED_WAIT",
-              step: currentStep
-            });
-          } else {
-            if (hasStepTransitionButtons) {
-              log("StateMachineActionHandler: Video ended, has step-transition button (goto/next) - waiting for user to click button");
-            } else {
-              log("StateMachineActionHandler: Video ended, waiting for user interaction");
-            }
-            store.sendStateMachineEvent({
-              type: "VIDEO_FINISHED_WAIT",
-              step: currentStep
-            });
-          }
-        }
-      });
+      this.managers.videoManager.setCompletionPolicy(
+        hasSpecialTransitions ? "manual" : "auto",
+        () => this.handleStepVideoEnded(currentStep, hasSpecialTransitions)
+      );
       log("StateMachineActionHandler: Starting async video load");
-      const loadTranscriptForStep = () => {
-        var _a, _b;
-        const store = getSaltfishStore();
-        const captionsEnabled = ((_a = store.manifest) == null ? void 0 : _a.captions) ?? true;
-        const language = (_b = store.userData) == null ? void 0 : _b.language;
-        let transcript = currentStep.transcript;
-        if (language && currentStep.translations && currentStep.translations[language]) {
-          const translatedTranscript = currentStep.translations[language].transcript;
-          if (translatedTranscript) {
-            transcript = translatedTranscript;
-            log(`StateMachineActionHandler: Loading translated transcript for step ${currentStep.id} in language ${language}`);
-          } else {
-            log(`StateMachineActionHandler: No translated transcript found for language ${language}, using default`);
-          }
-        } else if (language) {
-          log(`StateMachineActionHandler: No translation available for language ${language}, using default transcript`);
-        }
-        if (transcript) {
-          log(`StateMachineActionHandler: Loading transcript for step ${currentStep.id}, initially visible: ${captionsEnabled}`);
-          this.managers.videoManager.loadTranscript(transcript, captionsEnabled);
-        } else {
-          log(`StateMachineActionHandler: No transcript available for step ${currentStep.id}`);
-          this.managers.videoManager.loadTranscript(null, true);
-        }
-      };
-      this.managers.videoManager.loadVideo(videoUrl).then(() => {
-        log("StateMachineActionHandler: Video loaded successfully, playing");
-        this.managers.uiManager.hideError();
-        loadTranscriptForStep();
-        if (currentStep.cursorAnimations && currentStep.cursorAnimations.length > 0) {
-          log(`StateMachineActionHandler: Setting cursor visibility and scheduling animation for step ${currentStep.id}`);
-          this.managers.cursorManager.setShouldShowCursor(true);
-          this.scheduleCursorAnimation(currentStep.cursorAnimations[0], currentStep.id);
-        } else {
-          log(`StateMachineActionHandler: Setting cursor visibility to false for step ${currentStep.id} - step has no cursor animations`);
-          this.managers.cursorManager.setShouldShowCursor(false);
-        }
-        if (isAudioFallback) {
-          this.managers.videoManager.startAudioVisualization();
+      this.managers.videoManager.loadVideo(videoUrl).then(() => this.handleStepVideoLoaded(currentStep, isAudioFallback)).catch((error2) => this.handleStepVideoLoadError(error2, currentStep));
+    } catch (error2) {
+    }
+  }
+  /**
+   * Shows the audio-fallback overlay for audio-only steps, or hides it for regular video.
+   */
+  showOrHideAudioOverlay(step, isAudioFallback) {
+    if (isAudioFallback) {
+      const manifest = getSaltfishStore().manifest;
+      this.managers.videoManager.showAudioFallbackOverlay(step.gifUrl, manifest == null ? void 0 : manifest.avatarThumbnailUrl);
+    } else {
+      this.managers.videoManager.hideAudioFallbackOverlay();
+    }
+  }
+  /**
+   * Runs when the current step's video ends. Decides how the playlist advances:
+   * - auto policy: set up the step's transitions, or complete if there are none;
+   * - manual policy: arm a timeout fallback (if any) and move to the waiting state.
+   */
+  handleStepVideoEnded(currentStep, hasSpecialTransitions) {
+    var _a;
+    const store = getSaltfishStore();
+    if (!hasSpecialTransitions) {
+      const timeoutTransition2 = currentStep.transitions.find((t) => t.type === "timeout");
+      const hasNonZeroTimeout = timeoutTransition2 && timeoutTransition2.timeout && timeoutTransition2.timeout > 0;
+      if (hasNonZeroTimeout) {
+        log(`StateMachineActionHandler: Setting up transitions after video ended with ${timeoutTransition2.timeout}ms delay`);
+        this.managers.transitionManager.setupTransitions(currentStep, false);
+      } else {
+        this.managers.transitionManager.setupTransitions(currentStep, true);
+      }
+      const hasValidNextSteps = currentStep.transitions.some(
+        (transition) => store.manifest.steps.some((s) => s.id === transition.nextStep)
+      );
+      if (!hasValidNextSteps) {
+        store.sendStateMachineEvent({ type: "COMPLETE_PLAYLIST" });
+      }
+      return;
+    }
+    const timeoutTransition = currentStep.transitions.find((t) => t.type === "timeout");
+    const hasStepTransitionButtons = (_a = currentStep.buttons) == null ? void 0 : _a.some(
+      (button) => button.action.type === "goto" || button.action.type === "next"
+    );
+    if (timeoutTransition && !hasStepTransitionButtons) {
+      const timeout = timeoutTransition.timeout || 0;
+      log(`StateMachineActionHandler: Video ended, setting up timeout transition to ${timeoutTransition.nextStep} with ${timeout}ms delay`);
+      setTimeout(() => {
+        var _a2;
+        const currentStore = getSaltfishStore();
+        if (currentStore.currentStepId === currentStep.id && (currentStore.currentState === "waitingForInteraction" || currentStore.currentState === "playing")) {
+          log(`StateMachineActionHandler: Timeout expired (${timeout}ms), transitioning to ${timeoutTransition.nextStep}`);
+          (_a2 = currentStore.goToStep) == null ? void 0 : _a2.call(currentStore, timeoutTransition.nextStep);
         } else {
-          this.managers.videoManager.initializeAudioForVideo();
+          log(`StateMachineActionHandler: Timeout cancelled - step changed or state is ${currentStore.currentState}`);
         }
-        this.managers.videoManager.play();
-        const nextVideoUrl = this.findNextVideoUrl(currentStep);
-        if (nextVideoUrl) {
-          log(`StateMachineActionHandler: Preloading next video: ${nextVideoUrl}`);
-          this.managers.videoManager.preloadNextVideo(nextVideoUrl);
-        }
-      }).catch((error2) => {
-        var _a;
-        log(`StateMachineActionHandler: Error loading video: ${error2}`);
-        this.managers.uiManager.showError(
-          error2 instanceof Error ? error2 : new Error(`Failed to load video: ${error2}`),
-          "video"
-        );
-        const store = getSaltfishStore();
-        const errorObj = error2 instanceof Error ? error2 : new Error(`Failed to load video: ${error2}`);
-        const enrichedError = error2;
-        this.managers.eventManager.trigger("error", {
-          timestamp: Date.now(),
-          playlistId: ((_a = store.manifest) == null ? void 0 : _a.id) || void 0,
-          stepId: currentStep.id,
-          error: errorObj,
-          errorType: "video",
-          videoUrl: enrichedError == null ? void 0 : enrichedError.videoUrl,
-          mediaErrorCode: enrichedError == null ? void 0 : enrichedError.mediaErrorCode,
-          mediaErrorMessage: enrichedError == null ? void 0 : enrichedError.mediaErrorMessage,
-          failureReason: enrichedError == null ? void 0 : enrichedError.failureReason
-        });
-      });
-    } catch (error2) {
+      }, timeout);
+    }
+    store.sendStateMachineEvent({ type: "VIDEO_FINISHED_WAIT", step: currentStep });
+  }
+  /**
+   * Runs after the step's video has loaded: shows transcript, cursor animation,
+   * starts/initializes audio, plays, and preloads the next video.
+   */
+  handleStepVideoLoaded(currentStep, isAudioFallback) {
+    this.managers.uiManager.hideError();
+    this.loadTranscriptForStep(currentStep);
+    if (currentStep.cursorAnimations && currentStep.cursorAnimations.length > 0) {
+      log(`StateMachineActionHandler: Setting cursor visibility and scheduling animation for step ${currentStep.id}`);
+      this.managers.cursorManager.setShouldShowCursor(true);
+      this.cursorScheduler.schedule(currentStep.cursorAnimations[0], currentStep.id);
+    } else {
+      log(`StateMachineActionHandler: Setting cursor visibility to false for step ${currentStep.id} - step has no cursor animations`);
+      this.managers.cursorManager.setShouldShowCursor(false);
+    }
+    if (isAudioFallback) {
+      this.managers.videoManager.startAudioVisualization();
+    } else {
+      this.managers.videoManager.initializeAudioForVideo();
+    }
+    this.managers.videoManager.play();
+    const nextVideoUrl = this.findNextVideoUrl(currentStep);
+    if (nextVideoUrl) {
+      this.managers.videoManager.preloadNextVideo(nextVideoUrl);
+    }
+  }
+  /**
+   * Runs when the step's video fails to load: shows an error and emits an
+   * enriched error event for analytics.
+   */
+  handleStepVideoLoadError(error2, currentStep) {
+    var _a;
+    const errorObj = error2 instanceof Error ? error2 : new Error(`Failed to load video: ${error2}`);
+    this.managers.uiManager.showError(errorObj, "video");
+    const store = getSaltfishStore();
+    const enrichedError = error2;
+    this.managers.eventManager.trigger("error", {
+      timestamp: Date.now(),
+      playlistId: ((_a = store.manifest) == null ? void 0 : _a.id) || void 0,
+      stepId: currentStep.id,
+      error: errorObj,
+      errorType: "video",
+      videoUrl: enrichedError == null ? void 0 : enrichedError.videoUrl,
+      mediaErrorCode: enrichedError == null ? void 0 : enrichedError.mediaErrorCode,
+      mediaErrorMessage: enrichedError == null ? void 0 : enrichedError.mediaErrorMessage,
+      failureReason: enrichedError == null ? void 0 : enrichedError.failureReason
+    });
+  }
+  /**
+   * Loads the transcript for a step, preferring a translated transcript when a
+   * language is configured. Falls back to clearing the transcript if none exists.
+   */
+  loadTranscriptForStep(step) {
+    var _a, _b;
+    const store = getSaltfishStore();
+    const captionsEnabled = ((_a = store.manifest) == null ? void 0 : _a.captions) ?? true;
+    const language = (_b = store.userData) == null ? void 0 : _b.language;
+    let transcript = step.transcript;
+    if (language && step.translations && step.translations[language]) {
+      const translatedTranscript = step.translations[language].transcript;
+      if (translatedTranscript) {
+        transcript = translatedTranscript;
+        log(`StateMachineActionHandler: Loading translated transcript for step ${step.id} in language ${language}`);
+      }
+    }
+    if (transcript) {
+      log(`StateMachineActionHandler: Loading transcript for step ${step.id}, initially visible: ${captionsEnabled}`);
+      this.managers.videoManager.loadTranscript(transcript, captionsEnabled);
+    } else {
+      log(`StateMachineActionHandler: No transcript available for step ${step.id}`);
+      this.managers.videoManager.loadTranscript(null, true);
     }
   }
   handlePauseVideoPlayback() {
@@ -3668,15 +3645,7 @@ class StateMachineActionHandler {
     const videoUrl = this.getVideoUrl(currentStep);
     const isAudioFallback = this.isUsingAudioFallback(currentStep);
     this.managers.uiManager.showPlayer();
-    if (isAudioFallback) {
-      const store = getSaltfishStore();
-      const manifest = store.manifest;
-      const posterUrl = currentStep.gifUrl;
-      const avatarThumbnailUrl = manifest == null ? void 0 : manifest.avatarThumbnailUrl;
-      this.managers.videoManager.showAudioFallbackOverlay(posterUrl, avatarThumbnailUrl);
-    } else {
-      this.managers.videoManager.hideAudioFallbackOverlay();
-    }
+    this.showOrHideAudioOverlay(currentStep, isAudioFallback);
     this.managers.videoManager.loadVideo(videoUrl).then(() => {
       this.managers.uiManager.hideError();
       if (isAudioFallback) {
@@ -4134,12 +4103,11 @@ const _ManagerOrchestrator = class _ManagerOrchestrator {
     // Store updater unsubscribe functions
     __publicField(this, "uiUpdaterUnsubscribe", null);
     __publicField(this, "eventUpdaterUnsubscribe", null);
-    __publicField(this, "cursorAnimationListener", null);
-    __publicField(this, "cursorAnimationVideoElement", null);
-    __publicField(this, "cursorAnimationStepId", null);
+    __publicField(this, "cursorScheduler");
     // Initialization state
     __publicField(this, "isInitialized", false);
     this.managers = managers;
+    this.cursorScheduler = new CursorAnimationScheduler(managers, "ManagerOrchestrator");
   }
   /**
    * Set initialization state
@@ -4181,86 +4149,6 @@ const _ManagerOrchestrator = class _ManagerOrchestrator {
       stepTimeoutUnsubscribe();
     };
   }
-  /**
-   * Cleans up the active cursor animation time listener
-   * @param stepId - Optional step ID to verify we're cleaning up the right listener
-   */
-  cleanupCursorAnimationListener(stepId) {
-    if (stepId && this.cursorAnimationStepId && stepId !== this.cursorAnimationStepId) {
-      log(`ManagerOrchestrator: Skipping cleanup - stepId mismatch (requested: ${stepId}, current: ${this.cursorAnimationStepId})`);
-      return;
-    }
-    if (this.cursorAnimationListener && this.cursorAnimationVideoElement) {
-      this.cursorAnimationVideoElement.removeEventListener("timeupdate", this.cursorAnimationListener);
-      this.cursorAnimationListener = null;
-      this.cursorAnimationVideoElement = null;
-      this.cursorAnimationStepId = null;
-    }
-  }
-  /**
-   * Schedules a cursor animation to run either immediately or at a specific video time
-   * Note: Works for both video and audio-only steps (audio files use the same video element)
-   */
-  scheduleCursorAnimation(animation, stepId) {
-    this.cleanupCursorAnimationListener();
-    let showAtSeconds = animation.showAtSeconds ?? 0;
-    if (typeof showAtSeconds !== "number" || !isFinite(showAtSeconds)) {
-      showAtSeconds = 0;
-    }
-    if (showAtSeconds < 0) {
-      showAtSeconds = 0;
-    }
-    if (showAtSeconds <= 0) {
-      this.managers.cursorManager.animate(animation);
-    } else {
-      const videoElement = this.managers.videoManager.getVideoElement();
-      if (!videoElement) {
-        return;
-      }
-      let animationTriggered = false;
-      let warningLogged = false;
-      const timeUpdateHandler = () => {
-        if (animationTriggered) {
-          return;
-        }
-        const currentTime = videoElement.currentTime;
-        const duration = videoElement.duration;
-        if (duration && !isNaN(duration) && showAtSeconds > duration && !warningLogged) {
-          warningLogged = true;
-          animationTriggered = true;
-          this.cleanupCursorAnimationListener();
-          this.managers.cursorManager.animate(animation);
-          return;
-        }
-        if (currentTime >= showAtSeconds) {
-          animationTriggered = true;
-          this.cleanupCursorAnimationListener();
-          this.managers.cursorManager.animate(animation);
-        }
-      };
-      const endedHandler = () => {
-        if (!animationTriggered) {
-          const store = getSaltfishStore();
-          if (store.currentStepId !== stepId) {
-            log(`ManagerOrchestrator: Video ended but step changed (was ${stepId}, now ${store.currentStepId}). Not triggering cursor animation.`);
-            this.cleanupCursorAnimationListener(stepId);
-            return;
-          }
-          videoElement.duration;
-          animationTriggered = true;
-          this.managers.cursorManager.animate(animation);
-          this.cleanupCursorAnimationListener();
-        }
-      };
-      this.cursorAnimationListener = () => {
-        timeUpdateHandler();
-      };
-      this.cursorAnimationVideoElement = videoElement;
-      this.cursorAnimationStepId = stepId;
-      videoElement.addEventListener("timeupdate", this.cursorAnimationListener);
-      videoElement.addEventListener("ended", endedHandler, { once: true });
-    }
-  }
   /**
    * Handle store state changes
    */
@@ -4292,7 +4180,7 @@ const _ManagerOrchestrator = class _ManagerOrchestrator {
       const currentStep = manifest == null ? void 0 : manifest.steps.find((step) => step.id === store.currentStepId);
       if ((currentStep == null ? void 0 : currentStep.cursorAnimations) && currentStep.cursorAnimations.length > 0) {
         this.managers.cursorManager.setShouldShowCursor(true);
-        this.scheduleCursorAnimation(currentStep.cursorAnimations[0], store.currentStepId || "unknown");
+        this.cursorScheduler.schedule(currentStep.cursorAnimations[0], store.currentStepId || "unknown");
       }
     } else if (store.currentState === "completed" || store.currentState === "closing") {
       this.cleanupPlaylist();
@@ -4311,7 +4199,7 @@ const _ManagerOrchestrator = class _ManagerOrchestrator {
    */
   cleanupCurrentPlaylist() {
     try {
-      this.cleanupCursorAnimationListener();
+      this.cursorScheduler.cleanup();
       if (this.eventUpdaterUnsubscribe) {
         this.eventUpdaterUnsubscribe();
         this.eventUpdaterUnsubscribe = null;
@@ -4402,7 +4290,7 @@ const _ManagerOrchestrator = class _ManagerOrchestrator {
         isMinimized: store.isMinimized,
         manifestId: (_a = store.manifest) == null ? void 0 : _a.id
       });
-      this.cleanupCursorAnimationListener();
+      this.cursorScheduler.cleanup();
       if (this.uiUpdaterUnsubscribe) {
         this.uiUpdaterUnsubscribe();
         this.uiUpdaterUnsubscribe = null;
@@ -5552,27 +5440,37 @@ class VideoControlsUI {
       event.preventDefault();
     });
     this.container.appendChild(this.ccButton);
-    if (videoElement) {
-      videoElement.addEventListener("seeking", this.handleSeeking);
-      videoElement.addEventListener("seeked", this.handleSeeked);
-      videoElement.addEventListener("timeupdate", this.handleDetailedTimeUpdate);
+    this.attachProgressListeners(videoElement);
+  }
+  /**
+   * Attaches progress-tracking listeners (seeking/seeked/timeupdate) to a video element.
+   */
+  attachProgressListeners(video) {
+    if (!video) {
+      return;
+    }
+    video.addEventListener("seeking", this.handleSeeking);
+    video.addEventListener("seeked", this.handleSeeked);
+    video.addEventListener("timeupdate", this.handleDetailedTimeUpdate);
+  }
+  /**
+   * Removes progress-tracking listeners from a video element.
+   */
+  detachProgressListeners(video) {
+    if (!video) {
+      return;
     }
+    video.removeEventListener("seeking", this.handleSeeking);
+    video.removeEventListener("seeked", this.handleSeeked);
+    video.removeEventListener("timeupdate", this.handleDetailedTimeUpdate);
   }
   /**
    * Updates the video element reference (used when swapping videos)
    */
   updateVideoElement(videoElement) {
-    if (this.videoElement) {
-      this.videoElement.removeEventListener("seeking", this.handleSeeking);
-      this.videoElement.removeEventListener("seeked", this.handleSeeked);
-      this.videoElement.removeEventListener("timeupdate", this.handleDetailedTimeUpdate);
-    }
+    this.detachProgressListeners(this.videoElement);
     this.videoElement = videoElement;
-    if (videoElement) {
-      videoElement.addEventListener("seeking", this.handleSeeking);
-      videoElement.addEventListener("seeked", this.handleSeeked);
-      videoElement.addEventListener("timeupdate", this.handleDetailedTimeUpdate);
-    }
+    this.attachProgressListeners(videoElement);
   }
   /**
    * Resets controls for new video
@@ -5597,11 +5495,7 @@ class VideoControlsUI {
    */
   destroy() {
     this.stopProgressTracking();
-    if (this.videoElement) {
-      this.videoElement.removeEventListener("seeking", this.handleSeeking);
-      this.videoElement.removeEventListener("seeked", this.handleSeeked);
-      this.videoElement.removeEventListener("timeupdate", this.handleDetailedTimeUpdate);
-    }
+    this.detachProgressListeners(this.videoElement);
     if (this.controlsElement) {
       const controlsConfig = this.deviceHandler.getControlsConfig();
       if (controlsConfig.useTouch) {
@@ -6302,6 +6196,31 @@ class VideoManager {
   getInactiveVideo() {
     return this.activeVideoIndex === 0 ? this.nextVideo : this.currentVideo;
   }
+  /**
+   * Runs a callback against each existing video element (current + next).
+   */
+  forEachVideo(fn) {
+    for (const video of [this.currentVideo, this.nextVideo]) {
+      if (video) {
+        fn(video);
+      }
+    }
+  }
+  /**
+   * Applies the global mute state from the store to a single video element.
+   */
+  applyStoreMuteState(video) {
+    video.muted = getSaltfishStore().isMuted;
+  }
+  /**
+   * Clears the pending autoplay fallback timeout, if any.
+   */
+  clearAutoplayFallbackTimeout() {
+    if (this.autoplayFallbackTimeout !== null) {
+      window.clearTimeout(this.autoplayFallbackTimeout);
+      this.autoplayFallbackTimeout = null;
+    }
+  }
   /**
    * Swaps between the two video elements
    */
@@ -6312,8 +6231,7 @@ class VideoManager {
       return;
     }
     activeVideo.pause();
-    const store = getSaltfishStore();
-    inactiveVideo.muted = store.isMuted;
+    this.applyStoreMuteState(inactiveVideo);
     activeVideo.classList.add("sf-hidden");
     inactiveVideo.classList.remove("sf-hidden");
     this.activeVideoIndex = this.activeVideoIndex === 0 ? 1 : 0;
@@ -6336,14 +6254,13 @@ class VideoManager {
     if (this.controls) {
       this.controls.reset90PercentTrigger();
     }
-    const store = getSaltfishStore();
-    activeVideo.muted = store.isMuted;
+    this.applyStoreMuteState(activeVideo);
     try {
       if (this.controls) {
         this.controls.reset();
       }
-      const store2 = getSaltfishStore();
-      const isPersistenceEnabled = ((_a = store2.playlistOptions) == null ? void 0 : _a.persistence) ?? true;
+      const store = getSaltfishStore();
+      const isPersistenceEnabled = ((_a = store.playlistOptions) == null ? void 0 : _a.persistence) ?? true;
       if (this.currentVideoUrl === url && activeVideo.src && (activeVideo.src === url || activeVideo.src.endsWith(url))) {
         if (isPersistenceEnabled) {
           const savedPosition = this.playbackPositions.get(url);
@@ -6481,8 +6398,7 @@ class VideoManager {
       inactiveVideo.src = url;
       inactiveVideo.load();
       inactiveVideo.preload = "auto";
-      const store = getSaltfishStore();
-      inactiveVideo.muted = store.isMuted;
+      this.applyStoreMuteState(inactiveVideo);
     } else {
       fetch(url).then((response) => {
         if (!response.ok) {
@@ -6639,10 +6555,7 @@ class VideoManager {
     this.nextVideoUrl = "";
     this.activeVideoIndex = 0;
     this.hasUserInteracted = false;
-    if (this.autoplayFallbackTimeout !== null) {
-      window.clearTimeout(this.autoplayFallbackTimeout);
-      this.autoplayFallbackTimeout = null;
-    }
+    this.clearAutoplayFallbackTimeout();
     this.completionPolicy = "auto";
     this.videoEndedCallback = null;
     this.transcriptManager.reset();
@@ -6674,10 +6587,7 @@ class VideoManager {
     }
     this.transcriptManager.destroy();
     this.hideAudioFallbackOverlay();
-    if (this.autoplayFallbackTimeout !== null) {
-      window.clearTimeout(this.autoplayFallbackTimeout);
-      this.autoplayFallbackTimeout = null;
-    }
+    this.clearAutoplayFallbackTimeout();
     if (this.deviceChangeCleanup) {
       this.deviceChangeCleanup();
       this.deviceChangeCleanup = null;
@@ -6696,31 +6606,19 @@ class VideoManager {
    * Adds event listeners to the video elements
    */
   addEventListeners() {
-    const currentVideo = this.currentVideo;
-    const nextVideo = this.nextVideo;
-    if (currentVideo) {
-      currentVideo.addEventListener("ended", this.handleVideoEnded);
-      currentVideo.addEventListener("error", this.handleVideoError);
-    }
-    if (nextVideo) {
-      nextVideo.addEventListener("ended", this.handleVideoEnded);
-      nextVideo.addEventListener("error", this.handleVideoError);
-    }
+    this.forEachVideo((video) => {
+      video.addEventListener("ended", this.handleVideoEnded);
+      video.addEventListener("error", this.handleVideoError);
+    });
   }
   /**
    * Removes event listeners from the video elements
    */
   removeEventListeners() {
-    const currentVideo = this.currentVideo;
-    const nextVideo = this.nextVideo;
-    if (currentVideo) {
-      currentVideo.removeEventListener("ended", this.handleVideoEnded);
-      currentVideo.removeEventListener("error", this.handleVideoError);
-    }
-    if (nextVideo) {
-      nextVideo.removeEventListener("ended", this.handleVideoEnded);
-      nextVideo.removeEventListener("error", this.handleVideoError);
-    }
+    this.forEachVideo((video) => {
+      video.removeEventListener("ended", this.handleVideoEnded);
+      video.removeEventListener("error", this.handleVideoError);
+    });
   }
   /**
    * Sets the muted state of both video elements
@@ -6810,10 +6708,8 @@ class VideoManager {
   markUserInteraction() {
     if (!this.hasUserInteracted) {
       this.hasUserInteracted = true;
-      if (this.autoplayFallbackTimeout !== null) {
-        window.clearTimeout(this.autoplayFallbackTimeout);
-        this.autoplayFallbackTimeout = null;
-      }
+      if (this.autoplayFallbackTimeout !== null) ;
+      this.clearAutoplayFallbackTimeout();
     }
   }
   /**
@@ -6828,10 +6724,7 @@ class VideoManager {
    */
   resetUserInteraction() {
     this.hasUserInteracted = false;
-    if (this.autoplayFallbackTimeout !== null) {
-      window.clearTimeout(this.autoplayFallbackTimeout);
-      this.autoplayFallbackTimeout = null;
-    }
+    this.clearAutoplayFallbackTimeout();
   }
   /**
    * Handles autoplay fallback click specifically for mobile Chrome
@@ -10492,7 +10385,8 @@ class TriggerManager {
     }
     const playlistData = watchedPlaylists && watchedPlaylists[playlistId];
     const visitCount = (playlistData == null ? void 0 : playlistData.visitCount) ?? ((playlistData == null ? void 0 : playlistData.status) === "completed" || (playlistData == null ? void 0 : playlistData.status) === "dismissed" ? 1 : 0);
-    return visitCount < maxVisits;
+    const effectiveVisits = visitCount + ((playlistData == null ? void 0 : playlistData.status) === "in_progress" ? 1 : 0);
+    return effectiveVisits < maxVisits;
   }
   /**
    * Normalizes a URL by removing trailing slash (unless it's the root path)
@@ -11519,7 +11413,6 @@ class PlaylistManager extends EventSubscriberManager {
    */
   constructor(eventManager, storageManager2) {
     super(eventManager);
-    __publicField(this, "isUpdatingWatchedPlaylists", false);
     __publicField(this, "playlistLoader");
     __publicField(this, "storageManager");
     this.playlistLoader = new PlaylistLoader();
@@ -11552,84 +11445,56 @@ class PlaylistManager extends EventSubscriberManager {
     });
   }
   /**
-   * Updates the watched playlist status locally and in the backend
+   * Updates the watched playlist status.
+   *
+   * The in-memory update is done first, atomically, via the store action so that
+   * rapid status changes (per-step `in_progress` updates followed by the final
+   * `completed` update) can never overwrite each other — this is what keeps the
+   * `maxVisits`/"once" triggers correct on SPA navigation. Persistence (backend
+   * for identified users, localStorage for anonymous) is a follow-up side effect
+   * that mirrors the record the store just computed; it never gates the in-memory
+   * update.
+   *
    * @param playlistId - ID of the playlist
-   * @param status - New status ('in_progress' or 'completed')
+   * @param status - New status
    * @param currentStepId - Optional current step ID
    */
   async updateWatchedPlaylistStatus(playlistId, status, currentStepId) {
-    var _a, _b, _c, _d, _e, _f;
-    if (this.isUpdatingWatchedPlaylists) {
+    var _a, _b, _c, _d, _e;
+    const store = getSaltfishStore();
+    store.updateWatchedPlaylist(playlistId, status, currentStepId);
+    const record = (_b = (_a = store.userData) == null ? void 0 : _a.watchedPlaylists) == null ? void 0 : _b[playlistId];
+    const isAnonymous = !((_c = store == null ? void 0 : store.config) == null ? void 0 : _c.token) || !((_d = store == null ? void 0 : store.user) == null ? void 0 : _d.id) || ((_e = store == null ? void 0 : store.user) == null ? void 0 : _e.__isAnonymous);
+    if (isAnonymous) {
+      if (record) {
+        this.persistAnonymousWatchedPlaylist(playlistId, record);
+      }
       return;
     }
-    this.isUpdatingWatchedPlaylists = true;
+    const apiUrl = `https://player.saltfish.ai/clients/${store.config.token}/users/${store.user.id}/playlists/${playlistId}`;
     try {
-      const store = getSaltfishStore();
-      const currentUserData = store.userData || {};
-      const currentWatchedPlaylists = currentUserData.watchedPlaylists || {};
-      const existingPlaylistData = currentWatchedPlaylists[playlistId];
-      const previousStatus = existingPlaylistData == null ? void 0 : existingPlaylistData.status;
-      const currentVisitCount = (existingPlaylistData == null ? void 0 : existingPlaylistData.visitCount) ?? 0;
-      const shouldIncrementVisitCount = (status === "completed" || status === "dismissed") && previousStatus !== status;
-      const updatedPlaylistData = {
-        status,
-        // Don't save currentStepId for completed playlists - they should restart from beginning
-        currentStepId: status === "completed" ? null : currentStepId || store.currentStepId || null,
-        timestamp: Date.now(),
-        // Use timestamp for consistency with checkAndResumeInProgressPlaylist
-        lastProgressAt: Date.now(),
-        // Keep for backward compatibility
-        visitCount: shouldIncrementVisitCount ? currentVisitCount + 1 : currentVisitCount
-      };
-      const updatedWatchedPlaylists = {
-        ...currentWatchedPlaylists,
-        [playlistId]: updatedPlaylistData
-      };
-      store.setUserData({
-        ...currentUserData,
-        watchedPlaylists: updatedWatchedPlaylists
+      const response = await fetch(apiUrl, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ status, currentStepId: (record == null ? void 0 : record.currentStepId) ?? null })
       });
-      log(`PlaylistManager: Updated local watched playlists for ${playlistId} with status ${status}`);
-      if (!((_a = store == null ? void 0 : store.config) == null ? void 0 : _a.token) || !((_b = store == null ? void 0 : store.user) == null ? void 0 : _b.id) || ((_c = store == null ? void 0 : store.user) == null ? void 0 : _c.__isAnonymous)) {
-        log(`PlaylistManager: Cannot update backend - token: ${!!((_d = store == null ? void 0 : store.config) == null ? void 0 : _d.token)}, userId: ${!!((_e = store == null ? void 0 : store.user) == null ? void 0 : _e.id)}, anonymous: ${(_f = store == null ? void 0 : store.user) == null ? void 0 : _f.__isAnonymous}`);
-        this.updateAnonymousUserWatchedPlaylists(playlistId, status, currentStepId || store.currentStepId || null);
-        return;
-      }
-      const apiUrl = `https://player.saltfish.ai/clients/${store.config.token}/users/${store.user.id}/playlists/${playlistId}`;
-      log(`PlaylistManager: Making API call to update status - URL: ${apiUrl}, Status: ${status}`);
-      try {
-        const response = await fetch(apiUrl, {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify({
-            status,
-            currentStepId: currentStepId || store.currentStepId || null
-          })
-        });
-        if (!response.ok) {
-          throw new Error(`Failed to update watched playlist status: ${response.statusText} (${response.status})`);
-        }
-        log(`PlaylistManager: Successfully updated watched playlist status via API for ${playlistId} to '${status}'`);
-      } catch (error2) {
-        console.error(`PlaylistManager: Error updating watched playlist status for ${playlistId}:`, error2);
+      if (!response.ok) {
+        throw new Error(`Failed to update watched playlist status: ${response.statusText} (${response.status})`);
       }
-    } finally {
-      this.isUpdatingWatchedPlaylists = false;
+      log(`PlaylistManager: Successfully updated watched playlist status via API for ${playlistId} to '${status}'`);
+    } catch (error2) {
+      console.error(`PlaylistManager: Error updating watched playlist status for ${playlistId}:`, error2);
     }
   }
   /**
-   * Updates anonymous user watched playlist status in localStorage
-   * @param playlistId - ID of the playlist
-   * @param status - New status ('in_progress', 'completed', or 'dismissed')
-   * @param currentStepId - Optional current step ID
+   * Mirrors a computed watched-playlist record into the anonymous user's
+   * localStorage so it survives a full page reload.
    */
-  updateAnonymousUserWatchedPlaylists(playlistId, status, currentStepId) {
+  persistAnonymousWatchedPlaylist(playlistId, record) {
     if (typeof window === "undefined") {
       return;
     }
-    let anonymousUserData = this.storageManager.getAnonymousUserData() || {
+    const anonymousUserData = this.storageManager.getAnonymousUserData() || {
       userId: "anonymous",
       userData: {},
       watchedPlaylists: {},
@@ -11638,21 +11503,10 @@ class PlaylistManager extends EventSubscriberManager {
     if (!anonymousUserData.watchedPlaylists) {
       anonymousUserData.watchedPlaylists = {};
     }
-    const existingPlaylistData = anonymousUserData.watchedPlaylists[playlistId];
-    const previousStatus = existingPlaylistData == null ? void 0 : existingPlaylistData.status;
-    const currentVisitCount = (existingPlaylistData == null ? void 0 : existingPlaylistData.visitCount) ?? 0;
-    const shouldIncrementVisitCount = (status === "completed" || status === "dismissed") && previousStatus !== status;
-    anonymousUserData.watchedPlaylists[playlistId] = {
-      status,
-      currentStepId: currentStepId || null,
-      timestamp: Date.now(),
-      // Use timestamp for consistency with checkAndResumeInProgressPlaylist
-      lastProgressAt: Date.now(),
-      // Keep for backward compatibility
-      visitCount: shouldIncrementVisitCount ? currentVisitCount + 1 : currentVisitCount
-    };
+    anonymousUserData.watchedPlaylists[playlistId] = record;
     anonymousUserData.timestamp = Date.now();
-    this.storageManager.setAnonymousUserData(anonymousUserData);
+    const success = this.storageManager.setAnonymousUserData(anonymousUserData);
+    log(`PlaylistManager: ${success ? "Updated" : "Failed to update"} anonymous user localStorage for playlist ${playlistId} with status ${record.status}`);
   }
   /**
    * Loads a playlist manifest and sets up the store
@@ -12273,10 +12127,10 @@ class UIManager {
       }
       const token = (_a2 = currentStore.config) == null ? void 0 : _a2.token;
       if (token) {
-        window.open(`https://www.saltfish.ai/demos?clientId=${token}`, "_blank");
+        window.open(`https://www.saltfish.ai/?utm_source=player&utm_medium=logo&clientId=${token}`, "_blank");
       } else {
         console.warn("UIManager: No token available, falling back to saltfish.ai homepage");
-        window.open("https://www.saltfish.ai/", "_blank");
+        window.open("https://www.saltfish.ai/?utm_source=player&utm_medium=logo", "_blank");
       }
     });
   }
@@ -12901,7 +12755,7 @@ const SaltfishPlayer$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.de
   __proto__: null,
   SaltfishPlayer
 }, Symbol.toStringTag, { value: "Module" }));
-const version = "0.3.86";
+const version = "0.3.91";
 const packageJson = {
   version
 };