OTT Express SDK
OTT Express
The best in Native and React Native component library and SDKs for robust and rapid app development.
Homepage
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Sample Code:
============= Home Screen ===================================
class DSHomeScreen extends SPLTHomeScreen {
carouselItemClick = (spltContent: SPLTContent) => {};
railItemClick = (spltContent: SPLTContent) => {
this.props.navigation.navigate('DSPDP', {
spltContent,
type: typeof spltContent,
});
};
}
const mapStateToProps = state => ({
error: state.spltAppLoadReducer.error,
spltContents: state.spltAppLoadReducer.spltCategories,
theme: theme,
style: style,
config: config,
});
export default connect(mapStateToProps, {spltAppLoadActions})(DSHomeScreen);
Dynamic On Demand Rail Pages
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
============= PDP Screen ===================================
class DSPDPScreen extends SPLTPDPScreen {
componentDidMount() {
this.props.spltPDPActionsData(this.props.route.params?.spltContent);
}
function mapDispatchToProps(dispatch: any) {
return {
spltPDPActionsData: (spltContent: SPLTContent) =>
dispatch(spltPDPActions(spltContent)),
clearChannelActions: () => dispatch(clearChannelActions()),
};
}
function mapStateToProps(state) {
let recommendationSpltCategory = state.spltRecommendationReducer
.spltCategory as SPLTRecommendationCategory;
recommendationSpltCategory.style.cellImageStyle.aspectRatio = 2.0 / 3.0;
if (DeviceInfo.isTablet()) {
recommendationSpltCategory.style.cellStyle.widthPercentage = 17;
recommendationSpltCategory.style.railStyle.itemSpacingPercentage = 5;
} else if (Platform.isTV) {
recommendationSpltCategory.style.cellStyle.widthPercentage = 17;
} else {
recommendationSpltCategory.style.cellStyle.widthPercentage = 35;
}
return {
error: state.spltPDPReducer?.error,
spltChannel: state.spltPDPReducer.spltChannel,
recommendationError:state.spltRecommendationReducer.error,
recommendationSpltCategory: recommendationSpltCategory,
ratioData: state.spltPDPReducer?.ratioData ? state.spltPDPReducer?.ratioData : 0.6667,
theme,
style,
config,
};
}
export default connect(mapStateToProps, mapDispatchToProps)(DSPDPScreen);
Program Guide Schedule Pages
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
============= EPG Screen ===================================
class DSEPGScreen extends SPLTEPGScreen {
fromDay: number = 0;
}
function mapStateToProps(state) {
return {
EPGConfig: EPGStyle.EPGConfig,
theme: EPGStyle.themes,
style: EPGStyle.styles,
promo: state.spltPromoReducer.spltPromoChannels,
promoImage: state.spltPromoReducer.spltPromoChannels.spotlight_poster,
marketingURL: state.spltPromoReducer.spltPromoChannels.strSlug,
PLAYER_IMAGE_SAMPLE: EPGDrawable.PLAYER_IMAGE_SAMPLE,
PLAY_ICON: IconsDrawable.PLAY_ICON,
BOUNCING_BALL: bouncingBall,
SPLASH_BACKGROUND: splashDrawable.splash_bg,
error: state.spltEPGReducer.error,
spltEPGChannels: state.spltEPGReducer.spltEPGChannels,
fromDay: state.spltEPGReducer.fromDay,
spltVideo: state.spltVideoReducer.spltVideo,
isLoading: state.spltEPGReducer.isLoading,
};
}
const mapDispatchToProps = dispatch => {
return {
spltVideoActionsData: (spltVideo: SPLTVideo) =>
dispatch(spltVideoActions(spltVideo)),
spltEPGActions: (
from: number,
size: number,
fromDay: number,
) => dispatch(spltEPGActions(from, size, isLowerDevice, fromDay)),
spltPromoActions: () => dispatch(spltPromoActions()),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(DSEPGScreen);
============= Player Screen ===================================
class DSPlayerScreen extends SPLTPlayerScreen {
componentDidMount() {
super.componentDidMount();
this.setState({spltChannel: this.props.route.params.spltChannel});
}
}
function mapStateToProps(state) {
return {
theme: player.themes,
style: player.styles,
error: state.spltEPGReducer.error,
spltEPGChannel: state.spltEPGReducer.spltEPGChannel,
};
}
const mapDispatchToProps = dispatch => ({});
export default connect(mapStateToProps, mapDispatchToProps)(DSPlayerScreen);
Elegant Player Controls
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Subscription Plans
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
============= Subscription Screen ===================================
class DSProductsScreens extends SPLTProductsScreen {
componentDidMount() {
if (this.props.validationType) {
validationType = this.props.validationType
}
if (this.props.channelId) {
channelId = this.props.channelId
}
this.props.spltProductActions(channelId);
}
onClickSubscription = (items: SPLTProduct) => {
};
}
function mapStateToProps(state) {
const spltUserProduct = state.spltUserProductReducer.spltUserProduct;
return {
error: state.spltProductReducer.error,
isLoading: state.spltProductReducer.isLoading,
spltProduct: spltProduct,
theme: theme,
style: style,
};
}
const mapDispatchToProps = dispatch => ({
spltProductActions: channelId => dispatch(spltProductAction(channelId)),
});
export default connect(mapStateToProps, mapDispatchToProps)(DSProductsScreens);
DRM
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Adobe Primetime
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
============= Authentication Controller ===================================
For Login,
this.props.navigation.navigate('DSAuthController', {
validationType: ValidationType.LOGIN,
channelId: channel.dspro_id,
onAuthenticationSuccess: () => this.onAuthenticationSuccess(),
onAuthenticationFail: () => this.onAuthenticationFail(),
onAuthenticationSkip: () => this.onAuthenticationSkip(),
});
For Subscription,
this.props.navigation.navigate('DSAuthController', {
validationType: ValidationType.SUBSCRIPTION,
channelId: channel.dspro_id,
onAuthenticationSuccess: () => this.onAuthenticationSuccess(),
onAuthenticationFail: () => this.onAuthenticationFail(),
onAuthenticationSkip: () => this.onAuthenticationSkip(),
});
To purchase Channel
this.props.navigation.navigate('DSAuthController', {
validationType: ValidationType.CHANNEL_UNLOCKED,
channelId: channel.dspro_id,
onAuthenticationSuccess: () => this.onAuthenticationSuccess(),
onAuthenticationFail: () => this.onAuthenticationFail(),
onAuthenticationSkip: () => this.onAuthenticationSkip(),
});
Authentication
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
App Settings
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Search
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Modular Component Library
OTT Express component library and SDKs for robust and rapid app development.
Add Your Heading Text Here
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.