diff --git a/app/src/component/floatingWalletBalance/view.js b/app/src/component/floatingWalletBalance/view.js index 8320ecd8..42d43614 100644 --- a/app/src/component/floatingWalletBalance/view.js +++ b/app/src/component/floatingWalletBalance/view.js @@ -1,9 +1,10 @@ // @flow import React from 'react'; -import { Text, TouchableOpacity, View } from 'react-native'; +import { ActivityIndicator, Text, TouchableOpacity, View } from 'react-native'; import { formatCredits } from 'lbry-redux' import Address from '../address'; import Button from '../button'; +import Colors from '../../styles/colors'; import floatingButtonStyle from '../../styles/floatingButton'; type Props = { @@ -17,6 +18,7 @@ class FloatingWalletBalance extends React.PureComponent { return ( navigation && navigation.navigate({ routeName: 'Wallet' })}> + {isNaN(balance) && } {(balance || balance === 0) && (formatCredits(balance, 2) + ' LBC')} diff --git a/app/src/component/mediaPlayer/view.js b/app/src/component/mediaPlayer/view.js index 6033f2d5..9b8e562d 100644 --- a/app/src/component/mediaPlayer/view.js +++ b/app/src/component/mediaPlayer/view.js @@ -295,6 +295,17 @@ class MediaPlayer extends React.PureComponent { return encodedFilePath; } + onSeekerTouchAreaPressed = (evt) => { + if (evt && evt.nativeEvent) { + const newSeekerPosition = evt.nativeEvent.locationX; + if (!isNaN(newSeekerPosition)) { + const time = this.state.duration * (newSeekerPosition / this.seekerWidth); + this.setSeekerPosition(newSeekerPosition); + this.seekTo(time); + } + } + } + render() { const { backgroundPlayEnabled, fileInfo, thumbnail, onLayout, style } = this.props; const completedWidth = this.getCurrentTimePercentage() * this.seekerWidth; @@ -348,6 +359,10 @@ class MediaPlayer extends React.PureComponent { { left: this.state.seekerPosition }]} { ...this.seekResponder.panHandlers }> + } ); diff --git a/app/src/page/file/view.js b/app/src/page/file/view.js index a1be2609..d7bfb79c 100644 --- a/app/src/page/file/view.js +++ b/app/src/page/file/view.js @@ -229,6 +229,10 @@ class FilePage extends React.PureComponent { const isLandscape = screenWidth > screenHeight; this.setState({ isLandscape }); + if (!this.playerBackground) { + return; + } + if (isLandscape) { this.playerBackground.setNativeProps({ height: screenHeight - StyleSheet.flatten(uriBarStyle.uriContainer).height }); } else if (this.state.playerBgHeight > 0) { diff --git a/app/src/styles/mediaPlayer.js b/app/src/styles/mediaPlayer.js index c836c0b5..2b06732f 100644 --- a/app/src/styles/mediaPlayer.js +++ b/app/src/styles/mediaPlayer.js @@ -39,7 +39,7 @@ const mediaPlayerStyle = StyleSheet.create({ }, fullscreenTrackingControls: { alignSelf: 'center', - width: '70%' + width: '60%' }, playerControls: { position: 'absolute', @@ -75,7 +75,7 @@ const mediaPlayerStyle = StyleSheet.create({ position: 'absolute', left: 8, bottom: 24, - fontSize: 12, + fontSize: 14, color: '#ffffff' }, totalDuration: { @@ -83,7 +83,7 @@ const mediaPlayerStyle = StyleSheet.create({ position: 'absolute', right: 40, bottom: 24, - fontSize: 12, + fontSize: 14, color: '#ffffff' }, seekerCircle: { @@ -100,7 +100,8 @@ const mediaPlayerStyle = StyleSheet.create({ position: 'absolute', height: 36, width: 48, - marginLeft: -18 + marginLeft: -18, + zIndex: 20 }, seekerHandleContained: { bottom: -17 @@ -108,6 +109,18 @@ const mediaPlayerStyle = StyleSheet.create({ seekerHandleFs: { bottom: 0 }, + seekerTouchArea: { + position: 'absolute', + height: 30, + width: '100%', + zIndex: 10, + }, + seekerTouchAreaContained: { + bottom: -15, + }, + seekerTouchAreaFs: { + bottom: 0 + }, bigSeekerCircle: { borderRadius: 24, position: 'relative',