VideoFiltersBuilder

Filter video content by content type and stream lifecycle state using the VideoFilterBuilder() function.

Starting Web SDK 0.35.2.

interface IVideoFilterOptions {
  contentTypes?: ('Video' | 'Stream')[];
  streamStates?: ('Live' | 'Upcoming' | 'Ended')[];
}

Usage Example:

const filters = BlazeSDK.VideoFilterBuilder();

const widget = BlazeSDK.WidgetRowView('container', {
  dataSource: BlazeSDK.DataSourceBuilder().labels({ labels: 'sports' }),
  contentType: 'video',
  videoFilters: filters.liveOnly()
});

liveOnly()

Show only currently broadcasting live streams.

const filters = BlazeSDK.VideoFilterBuilder();

const widget = BlazeSDK.WidgetRowView('live-container', {
  dataSource: BlazeSDK.DataSourceBuilder().labels({ labels: 'sports' }),
  contentType: 'video',
  videoFilters: filters.liveOnly()
});

upcomingOnly()

Show only scheduled streams that haven't started (waiting room).

const filters = BlazeSDK.VideoFilterBuilder();

const widget = BlazeSDK.WidgetGridView('upcoming-container', {
  dataSource: BlazeSDK.DataSourceBuilder().labels({ labels: 'events' }),
  contentType: 'video',
  videoFilters: filters.upcomingOnly()
});

endedOnly()

Show only ended streams (replays/DVR recordings).

const filters = BlazeSDK.VideoFilterBuilder();

const widget = BlazeSDK.WidgetRowView('replays-container', {
  dataSource: BlazeSDK.DataSourceBuilder().labels({ labels: 'highlights' }),
  contentType: 'video',
  videoFilters: filters.endedOnly()
});

allStreams()

Show all streams regardless of state (live, upcoming, and ended).

const filters = BlazeSDK.VideoFilterBuilder();

const widget = BlazeSDK.WidgetRowView('streams-container', {
  dataSource: BlazeSDK.DataSourceBuilder().labels({ labels: 'sports' }),
  contentType: 'video',
  videoFilters: filters.allStreams()
});

vodOnly()

Show only on-demand video content (exclude all streams).

const filters = BlazeSDK.VideoFilterBuilder();

const widget = BlazeSDK.WidgetRowView('vod-container', {
  dataSource: BlazeSDK.DataSourceBuilder().labels({ labels: 'tutorials' }),
  contentType: 'video',
  videoFilters: filters.vodOnly()
});

watchable()

Show watchable content: on-demand videos + currently live streams. Excludes upcoming and ended streams.

const filters = BlazeSDK.VideoFilterBuilder();

const widget = BlazeSDK.WidgetRowView('main-feed', {
  dataSource: BlazeSDK.DataSourceBuilder().labels({ labels: 'entertainment' }),
  contentType: 'video',
  videoFilters: filters.watchable()
});

custom(options: IVideoFilterOptions)

Create custom filter configurations for advanced use cases:

const filters = BlazeSDK.VideoFilterBuilder();

// Show live and upcoming streams only
const widget = BlazeSDK.WidgetRowView('events-container', {
  dataSource: BlazeSDK.DataSourceBuilder().labels({ labels: 'games' }),
  contentType: 'video',
  videoFilters: filters.custom({
    contentTypes: ['Stream'],
    streamStates: ['Live', 'Upcoming']
  })
});

Important:

streamStates requires contentTypes to include 'Stream'
Empty arrays are not allowed - use undefined to omit the filter
custom() includes validation that throws errors for invalid configurations

DataSourceBuilder | BlazeDataSourceType | BlazeSDK class