JELLIFYAPI

Empower your streaming site with the Jellify embed player. Built for seamless integration, smart fallbacks, and total progress control.

Embed Movies

TMDB ID is accepted. Use the movie ID to load the Jellify player.

Endpoint URL

https://{My Domain}/embed/movie/{tmdb_id}

Embed Shows

TMDB ID is accepted. Season and episode are required for shows.

Endpoint URL

https://{My Domain}/embed/tv/{tmdb_id}/{season}/{episode}

Interactive Builder

Basic Settings

Media type

Ready to generate and preview.

Colors

Theme presets
#daab6e

Features & Controls

https://{My Domain}/embed/movie/550
01.

Integration Code

Snippet
<!-- Movie -->
<iframe
  src="https://{My Domain}/embed/movie/{tmdb_id}"
  title="Jellify Player"
  width="100%"
  height="100%"
  frameborder="0"
  allow="autoplay; fullscreen; picture-in-picture"
  allowfullscreen
></iframe>

<!-- TV Series -->
<iframe
  src="https://{My Domain}/embed/tv/{tmdb_id}/{season}/{episode}"
  title="Jellify Player"
  width="100%"
  height="100%"
  frameborder="0"
  allow="autoplay; fullscreen; picture-in-picture"
  allowfullscreen
></iframe>
02.

Query Parameters

server

Preferred server

Prefer a provider or server first, while allowing normal fallback when unavailable.

Accepted
Provider alias or server number
Default
Automatic
server=moviebox
audio

Audio language

Request a preferred audio language when a source exposes track metadata.

Accepted
Language code or original
Default
Provider default
audio=en
subtitle

Subtitle language

Request a preferred subtitle track where subtitles are available.

Accepted
Language code
Default
None
subtitle=en
autoplay

Autoplay

Attempt playback automatically after a source is ready, subject to browser policy.

Accepted
true or false
Default
true
autoplay=true
startAt

Start time

Begin playback from a specific offset in seconds on first source load.

Accepted
Number of seconds
Default
0
startAt=90
hide

Hidden controls

Hide selected player controls from the embedded interface.

Accepted
Comma-separated controls
Default
None
hide=server,quality,speed
theme

Theme accent

Apply the Jellify preset or a custom hex accent to the player controls.

Accepted
Preset name or hex value
Default
jellify
theme=%23c84e75
season

TV season

Select the season when embedding TV content.

Accepted
Positive integer
Default
Required for TV
season=1
episode

TV episode

Select the episode when embedding TV content.

Accepted
Positive integer
Default
Required for TV
episode=1
03.

Events & Progress Tracking

Events & Progress Tracking

Jellify sends individual playback updates as `PLAYER_EVENT` messages and the complete updated `movifyProgress` object as `MEDIA_DATA`. The player saves this progress in its own browser origin, and parent sites can save the same object for Continue Watching.

Available Events

readyPlayer instance is readyInitial playback state
playPlayback starts or resumesCurrent playback position
pausePlayback pausesCurrent playback position
timeupdatePeriodic playback progress updateCurrent time, duration, percentage
seekedA seek operation completesUpdated playback position
endedPlayback reaches the endCompleted playback state
sourcechangeActive stream source changesProvider and quality labels
errorPlayback failsPlayback position and media identity

`PLAYER_EVENT` contains the latest individual event. `MEDIA_DATA` contains the complete updated `movifyProgress` store and is emitted only after progress saves.

PLAYER_EVENT Data Structure

TypeScript
interface JellifyPlayerEventMessage {
  type: "PLAYER_EVENT";
  data: {
    event:
      | "ready"
      | "play"
      | "pause"
      | "seeked"
      | "ended"
      | "timeupdate"
      | "sourcechange"
      | "error";
    currentTime: number;
    duration: number;
    percentage: number;
    tmdbId: number;
    mediaType: "movie" | "tv";
    season?: number;
    episode?: number;
    title?: string;
    provider?: string;
    quality?: string;
    timestamp: number;
  };
}

interface JellifyMediaDataMessage {
  type: "MEDIA_DATA";
  data: JellifyProgressStore;
}

Event Listener Implementation

Validate the iframe origin before storing progress or reacting to playback events.

JavaScript
const JELLIFY_ORIGIN =
  "https://player.your-domain.com";

window.addEventListener(
  "message",
  (event) => {
    if (event.origin !== JELLIFY_ORIGIN) {
      return;
    }

    const message = event.data;

    if (message?.type === "MEDIA_DATA") {
      const jellifyProgress = message.data;

      localStorage.setItem(
        "movifyProgress",
        JSON.stringify(jellifyProgress),
      );

      return;
    }

    if (message?.type === "PLAYER_EVENT") {
      const {
        event: playerEvent,
        currentTime,
        duration,
        percentage,
      } = message.data;

      console.log(
        `Player ${playerEvent}`,
        {
          currentTime,
          duration,
          percentage,
        },
      );
    }
  },
);

Jellify Progress Data Structure

Jellify stores the complete object under `movifyProgress`. Movie and TV entries are keyed by TMDB ID, while TV episodes are also preserved under `show_progress`.

TypeScript
export type JellifyProgressStore =
  Record<string, JellifyProgressEntry>;

export interface JellifyPlaybackProgress {
  watched: number;
  duration: number;
  percentage: number;
}

export interface JellifyMovieProgressEntry {
  id: number;
  type: "movie";
  title?: string;
  release_year?: number;
  poster_path?: string;
  backdrop_path?: string;
  progress: JellifyPlaybackProgress;
  last_updated: number;
  completed?: boolean;
}

export interface JellifyTvProgressEntry {
  id: number;
  type: "tv";
  title?: string;
  release_year?: number;
  poster_path?: string;
  backdrop_path?: string;
  progress: JellifyPlaybackProgress;
  last_season_watched: string;
  last_episode_watched: string;
  show_progress: Record<string, JellifyEpisodeProgress>;
  last_updated: number;
  completed?: boolean;
}

Movie Progress Example

JSON
{
  "550": {
    "id": 550,
    "type": "movie",
    "title": "Fight Club",
    "release_year": 1999,
    "poster_path": "/poster-path.jpg",
    "backdrop_path": "/backdrop-path.jpg",
    "progress": {
      "watched": 842.5,
      "duration": 8340.2,
      "percentage": 10.1
    },
    "last_updated": 1785000000000,
    "completed": false
  }
}

TV Episode Progress Example

JSON
{
  "1396": {
    "id": 1396,
    "type": "tv",
    "title": "Breaking Bad",
    "poster_path": "/poster-path.jpg",
    "backdrop_path": "/backdrop-path.jpg",
    "progress": {
      "watched": 302.5,
      "duration": 3609.8,
      "percentage": 8.38
    },
    "last_season_watched": "1",
    "last_episode_watched": "2",
    "show_progress": {
      "s1e1": {
        "season": "1",
        "episode": "1",
        "progress": {
          "watched": 1845.2,
          "duration": 3600.4,
          "percentage": 51.25
        },
        "last_updated": 1784990000000,
        "completed": false
      },
      "s1e2": {
        "season": "1",
        "episode": "2",
        "progress": {
          "watched": 302.5,
          "duration": 3609.8,
          "percentage": 8.38
        },
        "last_updated": 1785000000000,
        "completed": false
      }
    },
    "last_updated": 1785000000000,
    "completed": false
  }
}