Storyblock

Displaying a Story Block can be done by using a StoryBlockViewController either programmatically or in a storyboard.

Programmatic

1. Import FireworkVideo

2. Create a new StoryBlockViewController

3. Embed the instantiated StoryBlockViewController

import FireworkVideo

class ViewController: UIViewController {

    func embedFeedInViewController() {
        let storyBlockVC = StoryBlockViewController()
        self.addChild(storyBlockVC)
        self.view.addSubview(storyBlockVC.view)
        storyBlockVC.view.frame = self.view.bounds
        storyBlockVC.willMove(toParent: self)
    }
    
}

Story Block Content Source

The enum StoryBlockContentSource defines the different sources that can be used to populate the story block. The content source must be specified when the StoryBlockViewController is instantiated; StoryBlockViewController(source: .discover). By default, the feed will use the .discover content source.

Other content sources include

Channel

Displays content from the specified channel id.

Note: The user will only see videos they have not viewed before. If the user has viewed all the videos for a channel similar videos will automatically be provided.

let channelID = "<Channel ID>"
let feedVC = StoryBlockViewController(source: .channel(channelID: channelID))

Channel Playlist

Displays content from the specified playlist id.

Note: Unlike the channel content source, only content in the playlist will be shown to the user.

let channelID = "<Your Channel ID>"
let playlistID = "<Playlist ID>"
let feedVC = StoryBlockViewController(source: .channelPlaylist(channelID: channelID, playlistID: playlistID))

Dynamic Content

Displays dynamic content based on the provided channel id and content parameters.

let channelID = "<Channel ID>"
let parameters: DynamicContentParameters = ["<cohort key>": ["<cohort value 1>", "<cohort value 2>"]]
let feedVC = StoryBlockViewController(source: .dynamicContent(channelID: channelID, parameters: parameters))

Hashtag Playlist

Displays content based on the provided channel id and the hashtag expression.

let channelID = "<Channel ID>"
let singleHashtag = "dogs"
let storyBlock = StoryBlockViewController(source: .hashtagPlaylist(channelID: channelID, filterExpression: singleHashtag))

Or a more advanced hashtag expression can be used to fine tune the results

let channelID = "<Channel ID>"
let filterExpression = "(and sport (or food comedy))"
let storyBlock = StoryBlockViewController(source: .hashtagPlaylist(channelID: channelID, filterExpression: filterExpression))

Single Video or Live Stream

Displays a single video or live stream content.

let videoOrLiveStreamID = "<Video or LiveStream ID>"
let storyBlock = StoryBlockViewController(source: .singleContent(videoOrLiveStreamID: videoOrLiveStreamID))

Story Block Configuration

StoryBlockViewController provides a StoryBlockConfiguration API to configure the UI elements of the video player. A story block's video player can be configured differently when displaying in embedded mode or when expanded to full screen. Configurations for embedded mode are automatically propagated to their full screen counterparts. Please refer to API documentation for more details.

var configuration = StoryBlockConfiguration()

// 1. Embedded mode
// 1.1 Configuring the sharing URL
configuration.shareButton.behavior.baseURL = URL(string: "your.custom.url")

// 1.2 Configuring CTA
configuration.ctaButton.contentConfiguration.backgroundColor = <Color>
configuration.ctaButton.contentConfiguration.textColor = <Color>
configuration.ctaButton.contentConfiguration.font = <Font>

// 2. Full Screen Configuration using `fullScreenPlayerView` property
configuration.fullScreenPlayerView.playerStyle = .fit

// Setting configuration
storyBlock.viewConfiguration = configuration