Student Guide

Watching Videos

Learn how to use the HLS video player, resume watching where you left off, and understand how your progress is tracked automatically.

Video Progress Flow

Start Press play or resume Watch HLS adaptive streaming Progress Saved Every 30 seconds auto-reported keep watching 90% = Complete Episode marked as finished automatically

Figure 1: Video Progress Flow

HLS Video Player Controls

The platform uses HLS (HTTP Live Streaming) for adaptive video delivery. The video quality adjusts automatically based on your internet connection, ensuring smooth playback.

Play / Pause

Click the central play button or anywhere on the video to toggle playback.

Progress Scrubber

Drag the progress bar below the video to jump to any position.

Fullscreen

Use the browser's native fullscreen control in the bottom-right corner of the player.

Supported Formats: The player supports HLS (.m3u8) natively in Safari and via hls.js in all other browsers. Direct MP4 URLs also work as a fallback.

Resume Watching Feature

The platform remembers exactly where you stopped watching. When you return to an episode, the video automatically seeks to your last position.

  1. Position Saved

    Your last_position_seconds is stored on the server each time progress is reported.

  2. Progress Fetched

    When the episode page loads, the player fetches your saved progress from /api/progress/{episode_id}.

  3. Auto-Seek

    The HLS player initializes with your saved position, so you pick up right where you left off.

Progress Tracking (30-Second Intervals)

While watching, the player automatically reports your progress to the server every 30 seconds. This ensures your position is saved frequently even if you close the tab unexpectedly.

Each progress update sends:

watched_seconds

Total watched time for this episode.

total_seconds

The full video duration.

last_position

Current playhead position in the video.

is_completed

Set to true when you reach the 90% threshold.

Completion Detection (90% Threshold)

An episode is marked as complete when you have watched at least 90% of its total duration. This allows for skipping intros or credits without missing the completion mark.

When this threshold is reached, a green "Episode Completed" badge appears and the video is marked complete on the server.

After the video completes, you can still rewatch it. The watch count increments each time and your completion status remains.
Before Closing the Tab: The player sends one final progress report when you navigate away. If your internet connection drops, the last report may not go through. Stay on the page a moment after finishing.