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