You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
193 lines
5.5 KiB
193 lines
5.5 KiB
7 years ago
|
let BlueApp = require('../../BlueApp')
|
||
|
import React, { Component } from 'react';
|
||
|
import { ActivityIndicator, TextInput, View } from 'react-native';
|
||
|
import Ionicons from 'react-native-vector-icons/Ionicons';
|
||
|
import { SafeAreaView, } from 'react-navigation';
|
||
|
import { Icon, Card, Header, } from 'react-native-elements'
|
||
|
import { List, Button, ListItem } from 'react-native-elements'
|
||
|
import { FormLabel, FormInput, Text, FormValidationMessage } from 'react-native-elements'
|
||
|
import {
|
||
|
BlueSpacing20, BlueList, BlueButton, SafeBlueArea, BlueCard, BlueText, BlueListItem, BlueHeader,
|
||
|
BlueFormInput, BlueSpacing
|
||
|
} from '../../BlueComponents'
|
||
|
let EV = require('../../events')
|
||
|
let BigNumber = require('bignumber.js');
|
||
|
|
||
|
export default class SendDetails extends Component {
|
||
|
|
||
|
static navigationOptions = {
|
||
|
tabBarIcon: ({ tintColor, focused }) => (
|
||
|
<Ionicons
|
||
|
name={focused ? 'md-paper-plane' : 'md-paper-plane'}
|
||
|
size={26}
|
||
|
style={{ color: tintColor }}
|
||
|
/>
|
||
|
),
|
||
|
}
|
||
|
|
||
|
|
||
|
constructor(props) {
|
||
|
super(props);
|
||
|
let startTime = Date.now()
|
||
|
let address
|
||
|
if (props.navigation.state.params) address = props.navigation.state.params.address
|
||
|
let fromAddress
|
||
|
if (props.navigation.state.params) fromAddress = props.navigation.state.params.fromAddress
|
||
|
let fromWallet = {}
|
||
|
|
||
|
let startTime2 = Date.now()
|
||
|
for (let w of BlueApp.getWallets()) {
|
||
|
if (w.getAddress() === fromAddress) {
|
||
|
fromWallet = w
|
||
|
}
|
||
|
}
|
||
|
|
||
|
let endTime2 = Date.now()
|
||
|
console.log('getAddress() took', (endTime2-startTime2)/1000, 'sec')
|
||
|
|
||
|
this.state = {
|
||
|
fromAddress: fromAddress,
|
||
|
fromWallet: fromWallet,
|
||
|
isLoading: true,
|
||
|
address : address,
|
||
|
amount: '',
|
||
|
fee: '',
|
||
|
}
|
||
|
|
||
|
EV(EV.enum.CREATE_TRANSACTION_NEW_DESTINATION_ADDRESS, (data) => {
|
||
|
console.log('received event with ', data)
|
||
|
this.setState({
|
||
|
address: data
|
||
|
})
|
||
|
})
|
||
|
let endTime = Date.now()
|
||
|
console.log('constructor took', (endTime-startTime)/1000, 'sec')
|
||
|
}
|
||
|
|
||
|
async componentDidMount() {
|
||
|
let startTime = Date.now()
|
||
|
console.log('send/details - componentDidMount')
|
||
|
this.setState({
|
||
|
isLoading: false,
|
||
|
})
|
||
|
let endTime = Date.now()
|
||
|
console.log('componentDidMount took', (endTime-startTime)/1000, 'sec')
|
||
|
}
|
||
|
|
||
|
recalculateAvailableBalance(balance, amount, fee) {
|
||
|
if (!amount) amount = 0
|
||
|
if (!fee) fee = 0
|
||
|
let availableBalance
|
||
|
try {
|
||
|
availableBalance = new BigNumber(balance)
|
||
|
availableBalance = availableBalance.sub(amount)
|
||
|
availableBalance = availableBalance.sub(fee)
|
||
|
availableBalance = availableBalance.toString(10)
|
||
|
} catch (err) {
|
||
|
return balance
|
||
|
}
|
||
|
console.log(typeof availableBalance, availableBalance)
|
||
|
return availableBalance === 'NaN' && balance || availableBalance
|
||
|
}
|
||
|
|
||
|
|
||
|
createTransaction() {
|
||
|
this.props.navigation.navigate('CreateTransaction', {
|
||
|
amount : this.state.amount,
|
||
|
fee: this.state.fee,
|
||
|
address: this.state.address,
|
||
|
memo: this.state.memo,
|
||
|
fromAddress: this.state.fromAddress
|
||
|
})
|
||
|
}
|
||
|
|
||
|
|
||
|
render() {
|
||
|
const {navigate} = this.props.navigation;
|
||
|
|
||
|
if (this.state.isLoading) {
|
||
|
return (
|
||
|
<View style={{flex: 1, paddingTop: 20}}>
|
||
|
<ActivityIndicator />
|
||
|
</View>
|
||
|
);
|
||
|
}
|
||
|
|
||
|
if (!this.state.fromWallet.getAddress) {
|
||
|
return (
|
||
|
<View style={{flex: 1, paddingTop: 20}}>
|
||
|
<Text>System error: Source wallet not found (this should never happen)</Text>
|
||
|
</View>
|
||
|
);
|
||
|
}
|
||
|
|
||
|
return (
|
||
|
<SafeBlueArea style={{flex: 1, paddingTop: 20}}>
|
||
|
<BlueSpacing/>
|
||
|
<BlueCard title={"Create Transaction"} style={{alignItems: 'center', flex: 1}}>
|
||
|
|
||
|
<BlueFormInput style={{width: 250}}
|
||
|
onChangeText={(text) => this.setState({address: text})}
|
||
|
placeholder={"receiver address here"}
|
||
|
value={this.state.address}
|
||
|
/>
|
||
|
|
||
|
|
||
|
<BlueFormInput onChangeText={(text) => this.setState({amount: text})} keyboardType={"numeric"}
|
||
|
placeholder={"amount to send (in BTC)"}
|
||
|
value={this.state.amount+''}
|
||
|
/>
|
||
|
|
||
|
|
||
|
|
||
|
<BlueFormInput onChangeText={(text) => this.setState({fee: text})} keyboardType={"numeric"}
|
||
|
placeholder={"plus transaction fee (in BTC)"}
|
||
|
value={this.state.fee + ''}
|
||
|
/>
|
||
|
|
||
|
<BlueFormInput onChangeText={(text) => this.setState({memo: text})}
|
||
|
placeholder={"memo to self"}
|
||
|
value={this.state.memo}
|
||
|
/>
|
||
|
|
||
|
<BlueSpacing20/>
|
||
|
<BlueText>Remaining balance: {this.recalculateAvailableBalance(this.state.fromWallet.getBalance(), this.state.amount, this.state.fee)} BTC</BlueText>
|
||
|
|
||
|
|
||
|
|
||
|
</BlueCard>
|
||
|
|
||
|
<View style={{flex: 1, flexDirection: 'row', paddingTop:20,}}>
|
||
|
<View style={{flex: 0.33}}>
|
||
|
<BlueButton
|
||
|
onPress={() =>
|
||
|
this.props.navigation.goBack()
|
||
|
}
|
||
|
title="Cancel"
|
||
|
/>
|
||
|
</View>
|
||
|
<View style={{flex: 0.33}}>
|
||
|
<BlueButton icon={{name: 'qrcode', type: 'font-awesome'}} style={{}}
|
||
|
title="scan"
|
||
|
onPress={() => this.props.navigation.navigate('ScanQrAddress')}
|
||
|
/>
|
||
|
</View>
|
||
|
<View style={{flex: 0.33}}>
|
||
|
<BlueButton
|
||
|
onPress={() =>
|
||
|
this.createTransaction()
|
||
|
}
|
||
|
title="Create"
|
||
|
/>
|
||
|
</View>
|
||
|
|
||
|
</View>
|
||
|
|
||
|
|
||
|
</SafeBlueArea>
|
||
|
);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
|