LBRYCommunity/lbry-android
1
0
Fork 0
Code Issues155 Pull requests6 Projects Releases84 Packages Wiki Activity

add time to start (in seconds) to Play track event for new downloads #269

Merged
akinwale merged 3 commits from time-to-start into master 2018-08-30 19:11:04 +02:00
Conversation 0 Commits 3 Files changed 3 +49 -24
2 changed files with 49 additions and 24 deletions
Showing only changes of commit a23dcd1aa2 - Show all commits
app/src
component/mediaPlayer
view.js
page/file
view.js

5
app/src/component/mediaPlayer/view.js
View file

@ -93,9 +93,8 @@ class MediaPlayer extends React.PureComponent {
}
if (this.state.firstPlay) {
if (NativeModules.Mixpanel) {
const { uri } = this.props;
NativeModules.Mixpanel.track('Play', { Uri: uri });
if (this.props.onPlaybackStarted) {
this.props.onPlaybackStarted();
}
this.setState({ firstPlay: false });
this.hidePlayerControls();

68
app/src/page/file/view.js
View file

@ -38,11 +38,13 @@ class FilePage extends React.PureComponent {
player = null;
startTime = null;
constructor(props) {
super(props);
this.state = {
mediaLoaded: false,
autoplayMedia: false,
autoPlayMedia: false,
downloadButtonShown: false,
downloadPressed: false,
fullscreenMode: false,
@ -220,6 +222,31 @@ class FilePage extends React.PureComponent {
}
}
onMediaLoaded = (title, channelName) => {
this.setState({ mediaLoaded: true });
window.currentMediaInfo = {
title: title,
channel: channelName
};
}
onPlaybackStarted = () => {
let timeToStart = null;
if (this.startTime) {
timeToStart = Math.ceil((Date.now() - this.startTime) / 1000);
this.startTime = null;
}
const { navigation } = this.props;
const { uri } = navigation.state.params;
let payload = { 'Uri': uri };
if (!isNaN(timeToStart)) {
payload['Time to Start (seconds)'] = timeToStart;
}
NativeModules.Mixpanel.track('Play', payload);
}
render() {
const {
claim,
@ -320,7 +347,10 @@ class FilePage extends React.PureComponent {
style={filePageStyle.downloadButton}
openFile={openFile}
isPlayable={isPlayable}
onPlay={() => this.setState({ downloadPressed: true, autoPlayMedia: true })}
onPlay={() => {
this.startTime = Date.now();
this.setState({ downloadPressed: true, autoPlayMedia: true });
}}
onButtonLayout={() => this.setState({ downloadButtonShown: true })} />}
{!fileInfo && <FilePrice uri={uri} style={filePageStyle.filePriceContainer} textStyle={filePageStyle.filePriceText} />}
</View>
@ -331,25 +361,21 @@ class FilePage extends React.PureComponent {
this.setState({ playerBgHeight: evt.nativeEvent.layout.height });
}
}} />}
{canLoadMedia && fileInfo && <MediaPlayer fileInfo={fileInfo}
ref={(ref) => { this.player = ref; }}
uri={uri}
style={playerStyle}
autoPlay={this.state.autoPlayMedia}
onFullscreenToggled={this.handleFullscreenToggle}
onMediaLoaded={() => {
this.setState({ mediaLoaded: true });
window.currentMediaInfo = {
title: title,
channel: channelName
};
}}
onLayout={(evt) => {
if (!this.state.playerHeight) {
this.setState({ playerHeight: evt.nativeEvent.layout.height });
}
}}
/>}
{canLoadMedia && fileInfo && <MediaPlayer
fileInfo={fileInfo}
ref={(ref) => { this.player = ref; }}
uri={uri}
style={playerStyle}
autoPlay={this.state.autoPlayMedia}
onFullscreenToggled={this.handleFullscreenToggle}
onLayout={(evt) => {
if (!this.state.playerHeight) {
this.setState({ playerHeight: evt.nativeEvent.layout.height });
}
}}
onMediaLoaded={() => this.onMediaLoaded(title, channelName)}
onPlaybackStarted={this.onPlaybackStarted}
/>}
{ showActions &&
<View style={filePageStyle.actions}>