move file action buttons to large button row #90

Merged
akinwale merged 3 commits from file-show-buttons into master 2019-12-06 17:22:43 +01:00
3 changed files with 70 additions and 94 deletions

View file

@ -86,11 +86,9 @@ class DiscoverPage extends React.PureComponent {
} }
onComponentFocused = () => { onComponentFocused = () => {
const { fetchSubscriptions, pushDrawerStack } = this.props; const { pushDrawerStack } = this.props;
// pushDrawerStack(); // pushDrawerStack();
NativeModules.Firebase.setCurrentScreen('Your tags').then(result => { NativeModules.Firebase.setCurrentScreen('Your tags');
fetchSubscriptions();
});
}; };
handleSortByItemSelected = item => { handleSortByItemSelected = item => {
@ -123,46 +121,6 @@ class DiscoverPage extends React.PureComponent {
return null; return null;
}; };
componentDidUpdate(prevProps, prevState) {
const { unreadSubscriptions, enabledChannelNotifications } = this.props;
const utility = NativeModules.UtilityModule;
const hasUnread =
prevProps.unreadSubscriptions &&
prevProps.unreadSubscriptions.length !== unreadSubscriptions.length &&
unreadSubscriptions.length > 0;
if (hasUnread) {
unreadSubscriptions.map(({ channel, uris }) => {
const { claimName: channelName } = parseURI(channel);
// check if notifications are enabled for the channel
if (enabledChannelNotifications.includes(channelName)) {
uris.forEach(uri => {
Lbry.resolve({ urls: uri }).then(result => {
const sub = result[uri];
if (sub && sub.value) {
const { source, title, thumbnail } = sub.value;
const isPlayable =
source && source.media_type && ['audio', 'video'].includes(source.media_type.substring(0, 5));
if (title) {
utility.showNotificationForContent(
uri,
title,
channelName,
thumbnail ? thumbnail.url : null,
isPlayable
);
}
}
});
});
}
});
}
}
showRatingReminder = () => { showRatingReminder = () => {
const { ratingReminderDisabled, ratingReminderLastShown, setClientSetting } = this.props; const { ratingReminderDisabled, ratingReminderLastShown, setClientSetting } = this.props;

View file

@ -597,6 +597,18 @@ class FilePage extends React.PureComponent {
setPlayerVisible(); setPlayerVisible();
}; };
onDownloadPressed = () => {
const { claim, costInfo, purchaseUri } = this.props;
this.setState(
{
downloadPressed: true,
autoPlayMedia: false,
stopDownloadConfirmed: false,
},
() => purchaseUri(claim.permanent_url, costInfo, true)
);
};
onBackButtonPressed = () => { onBackButtonPressed = () => {
const { navigation, drawerStack, popDrawerStack } = this.props; const { navigation, drawerStack, popDrawerStack } = this.props;
navigateBack(navigation, drawerStack, popDrawerStack); navigateBack(navigation, drawerStack, popDrawerStack);
@ -819,7 +831,7 @@ class FilePage extends React.PureComponent {
<View style={filePageStyle.pageContainer}> <View style={filePageStyle.pageContainer}>
{!this.state.fullscreenMode && <UriBar value={uri} navigation={navigation} />} {!this.state.fullscreenMode && <UriBar value={uri} navigation={navigation} />}
{this.state.showWebView && isWebViewable && ( {this.state.showWebView && isWebViewable && (
<WebView source={{ uri: localFileUri }} style={filePageStyle.viewer} /> <WebView allowFileAccess source={{ uri: localFileUri }} style={filePageStyle.viewer} />
)} )}
{this.state.showImageViewer && ( {this.state.showImageViewer && (
@ -938,48 +950,8 @@ class FilePage extends React.PureComponent {
/> />
)} )}
{showActions && showFileActions && (
<View style={filePageStyle.actions}>
{showFileActions && (
<View style={filePageStyle.fileActions}>
{canEdit && (
<Button
style={[filePageStyle.actionButton, filePageStyle.editButton]}
theme={'light'}
icon={'edit'}
text={__('Edit')}
onPress={this.onEditPressed}
/>
)}
{(completed || canEdit) && (
<Button
style={filePageStyle.actionButton}
theme={'light'}
icon={'trash-alt'}
text={__('Delete')}
onPress={this.onDeletePressed}
/>
)}
{!completed &&
fileInfo &&
!fileInfo.stopped &&
fileInfo.written_bytes < fileInfo.total_bytes &&
!this.state.stopDownloadConfirmed && (
<Button
style={filePageStyle.actionButton}
icon={'stop'}
theme={'light'}
text={__('Stop Download')}
onPress={this.onStopDownloadPressed}
/>
)}
</View>
)}
</View>
)}
<ScrollView <ScrollView
style={showActions ? filePageStyle.scrollContainerActions : filePageStyle.scrollContainer} style={filePageStyle.scrollContainer}
contentContainerstyle={showActions ? null : filePageStyle.scrollContent} contentContainerstyle={showActions ? null : filePageStyle.scrollContent}
keyboardShouldPersistTaps={'handled'} keyboardShouldPersistTaps={'handled'}
ref={ref => { ref={ref => {
@ -1015,6 +987,28 @@ class FilePage extends React.PureComponent {
<Text style={filePageStyle.largeButtonText}>{__('Tip')}</Text> <Text style={filePageStyle.largeButtonText}>{__('Tip')}</Text>
</TouchableOpacity> </TouchableOpacity>
<View style={filePageStyle.sharedLargeButton}>
{!isPlayable && !fileInfo && (
<TouchableOpacity style={filePageStyle.innerLargeButton} onPress={this.onDownloadPressed}>
<Icon name={'download'} size={20} style={filePageStyle.largeButtonIcon} />
<Text style={filePageStyle.largeButtonText}>{__('Download')}</Text>
</TouchableOpacity>
)}
{!completed &&
fileInfo &&
!fileInfo.stopped &&
fileInfo.written_bytes > 0 &&
fileInfo.written_bytes < fileInfo.total_bytes &&
!this.state.stopDownloadConfirmed && (
<TouchableOpacity style={filePageStyle.innerLargeButton} onPress={this.onStopDownloadPressed}>
<Icon name={'stop'} size={20} style={filePageStyle.largeButtonIcon} />
<Text style={filePageStyle.largeButtonText}>{__('Stop')}</Text>
</TouchableOpacity>
)}
</View>
{!canEdit && (
<TouchableOpacity <TouchableOpacity
style={filePageStyle.largeButton} style={filePageStyle.largeButton}
onPress={() => Linking.openURL(`https://lbry.com/dmca/${claim.claim_id}`)} onPress={() => Linking.openURL(`https://lbry.com/dmca/${claim.claim_id}`)}
@ -1022,6 +1016,21 @@ class FilePage extends React.PureComponent {
<Icon name={'flag'} size={20} style={filePageStyle.largeButtonIcon} /> <Icon name={'flag'} size={20} style={filePageStyle.largeButtonIcon} />
<Text style={filePageStyle.largeButtonText}>{__('Report')}</Text> <Text style={filePageStyle.largeButtonText}>{__('Report')}</Text>
</TouchableOpacity> </TouchableOpacity>
)}
{canEdit && (
<TouchableOpacity style={filePageStyle.largeButton} onPress={this.onEditPressed}>
<Icon name={'edit'} size={20} style={filePageStyle.largeButtonIcon} />
<Text style={filePageStyle.largeButtonText}>{__('Edit')}</Text>
</TouchableOpacity>
)}
{(completed || canEdit) && (
<TouchableOpacity style={filePageStyle.largeButton} onPress={this.onDeletePressed}>
<Icon name={'trash-alt'} size={20} style={filePageStyle.largeButtonIcon} />
<Text style={filePageStyle.largeButtonText}>{__('Delete')}</Text>
</TouchableOpacity>
)}
</View> </View>
<View style={filePageStyle.channelRow}> <View style={filePageStyle.channelRow}>

View file

@ -381,10 +381,19 @@ const filePageStyle = StyleSheet.create({
backButtonIcon: { backButtonIcon: {
color: Colors.White, color: Colors.White,
}, },
sharedLargeButton: {
alignItems: 'center',
justifyContent: 'center',
marginRight: 36,
},
innerLargeButton: {
alignItems: 'center',
justifyContent: 'center',
},
largeButton: { largeButton: {
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
marginRight: 48, marginRight: 36,
}, },
largeButtonIcon: { largeButtonIcon: {
color: Colors.DescriptionGrey, color: Colors.DescriptionGrey,