End of play
What you learn
You're instantiating DIVA Player in your app and relying on DIVA Back Office as the video streaming source.
The goal of this article is to build the simplest front-end to stream a video from the DIVA Back Office with, at the end, some additional content.
- Portrait mode
- Landscape mode and TV


Before starting
-
Ensure the DIVA Back Office instance you rely on is up and running.
-
Ask your video engineers team
<videoId>,<settingsURL>,<languageCountryCode>,<userToken>and<sharedKey>. -
According to your End-of-Play experience, ensure the VideoMetadata contains the End-of-Play properties for:
noteIn portrait mode the end of play contents will be shown below the video player. Tabs will be displayed in the bottom of the screen.
Instantiation
Write the Basic instantiation code. There's no additional code to write, unless you need to overwrite the autoplay behavior that the VideoMetadata contains.
End of play configuration
End of play screen content:
- Background image - loaded from image property.
- Title string - loaded from title property.
- SubTitle string - loaded from subtitle property.
- Replay button - Text read from Dictionary key [diva_eop_replay].
End of play screen is display:
- 5 seconds before video to finish or when.
- Squeeze back is enabled.
- Chain play / Up Next is enabled.
PlayerDelegate {
companion object {
const val PLAYBACK_END_ERROR_MARGIN = 500
}
}
Working sample code for overwriting End Of Play data (.tsx)
{
val conf = DivaExtraParamsMobile(
videoMetaDataMap = this::videoMetadataMapper
)
private fun videoMetadataMapper(videoMetadata: VideoMetadata): VideoMetadata {
return videoMetadata
.copy(image = imageUrl, title = "Game of Thrones", subtitle = "E3-S5")
}
}
Dictionary
Ensure the dictionary file contains the relevant keys.
Analytics events
Find here the available analytics events for the End of Play.