SDK types documentation

type hexColor = string;

export interface ISdkSettings {
  /**
   * which webpage element will contain the video
   */
  container: HTMLElement;

  /**
   * which frame from the movie should be presented before playback
   */
  posterFrame?: number;

  /**
   * set to true to change the webpage to black background with the movie centered
   */
  cinematic?: boolean;

  /**
   * whether to show a timeline-bar
   */
  showTimeline?: boolean;

  /**
   * an "instagram" style stories instead for video timeline
   */
  storiesMode?: boolean;

  /**
   * stories from right to left instead of left to right - for hebrew
   */
  rightToLeft?: boolean;

  /**
   * Short animation that explains the UI of stories
   */
  showStoriesModeIndicators?: boolean;

  /**
   * Show text in short animation that explains the UI of stories
   */
  showStoriesModeIndicatorsText?: boolean;

  /**
   * show / hide full screen toggle button
   * (note: full screen is not supported in iphone)
   */
  hideFullScreenBtn?: boolean;

  /**
   * colors for the player skin and background.
   */
  colors?: {
    loader?: hexColor;
    ctrlBtns?: hexColor;
    rail?: hexColor;
    progress?: hexColor;
    thumb?: hexColor;
    bg?: hexColor;
  };

  /**
   * @deprecated - use `colors`
   * colors for the loading spinner and the play/pause buttons.
   */
  loaderColor?: hexColor;
  ctrlBtnsColor?: hexColor;
  bgColor?: hexColor;

  /**
   * should the video start muted or not
   */
  muted?: boolean;

  /**
   * should the video start automatically or after pressing a button.
   * NOTE:
   * starting with autoplay might start the video muted according to browser's policy
   * see: https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
   */
  autoplay?: boolean;

  /** should video start automatically to replay once completed */
  autoReplay?: boolean;

  /**
   * on first play, should the video go to full screen (note: full screen is not supported in iphone)
   * @default: false
   */
  autoFullScreen?: boolean;

  /**
   * should player be auto focused
   */
  autoFocus?: boolean;

  /**
   * Image to be shown during the initial loading of the video
   */
  loadingImage?: string;

  /**
   * Text to be shown during the initial loading of the video
   */
  loadingText?: string;

  /** For analytics using google-analytics */
  identifier?: string;
  googleAnalyticsTrackingId?: string;

  /** Timeout for asset loading in ms */
  maxLoadingTime: number;

  /** Send or not errors to Sentry **/
  errorTracking?: boolean;
}

export interface ISceneObj {
  id: string;
  data?: any;
  ip?: number;
  op?: number;
}
export type ISdkScene = ISceneObj | string;
export interface IProjectFetchData {
  /**
   * project environment.
   * "dev" | "staging" | "master"
   * Default: production ("master")
   */
  env?: SettingsApiEnv | undefined;
  /**
   * ID for this project
   */
  projectId: string; // todo: change to id
}
export interface IProjectServerData {
  videoParts: Array<IVideoPartFilled | IVideoPart>;
  liveControlData: any;
  playerSettings: IPlayerSettings;
  title?: string;
}
export interface IPlayerSettings {
  posterFrame?: number;
  showTimeline?: boolean;
  storiesMode?: boolean;
  color_loader?: string;
  color_ctrlBtns?: string;
  color_rail?: string;
  color_progress?: string;
  color_thumb?: string;
  color_bg?: string;
  muted?: boolean;
  autoplay?: boolean;
  autoReplay?: boolean;
}
export interface ISdkParams {
  project: IProjectFetchData | Omit<IProjectServerData, "playerSettings">;
  /**
   * list of video-parts ("scenes") and their order that will be played
   */
  scenes?: ISdkScene[];

  data: any;

  settings: ISdkSettings;

  /**
   * extra things that Player can get
   * For Blings developers only (not for external docs)
   * (note: currently not deep clone, so make sure to not override other stuff
   */
  rest?: Partial<IPlayerParams>;
  polyfills?: IPolyfills;
}

Player Events

export type PlayerEvents =
  | "onAllReady" 
  | "onAllReadyAfterConcat"
  | "onFirstPlay"
  | "onPlay"
  | "onFrame"
  | "onReplay"
  | "onPause"
  | "onStop"
  | "onCoverShown"
  | "onCoverHide"
  | "onMute"
  | "onUnmute"
  | "onVisibilityChange"
  | "onComplete"
  | "onSeek" // real seek
  | "onSeeked" // real seek
  | "onSeeking" 
  | "onSeekend"
  | "onReplaceAnimation"
  | "onFullScreenEnter"
  | "onOutputRenderUpdate"
  | "onFullScreenExit"
  | "onOutputRenderTypeStart"
  | "onDeletePlayerSkin";

Last updated