'use strict';

import React, { PureComponent } from 'react';
import { View, StyleSheet, Dimensions, Text, TouchableHighlight, ScrollView, ToolbarAndroid, Picker, Alert} from 'react-native';
import { TabViewAnimated, TabBar } from 'react-native-tab-view';
import { TextField } from 'react-native-material-textfield';
import CheckBox from 'react-native-check-box';
import RNDataSdkWrapper from 'react-native-data-sdk';

const initialLayout = {
height: 0,
width: Dimensions.get('window').width,
};

export default class TabViewExample extends PureComponent {

constructor(props) {
super(props);
this.onPressStartData = this.onPressStartData.bind(this);
this.onPressSendProviderAccessToken = this.onPressSendProviderAccessToken.bind(this);
this.focusNextField = this.focusNextField.bind(this);
this.onActionSelected = this.onActionSelected.bind(this);
this.inputs = {};
}

state = {
startDataText: 'START DATA SDK',
sendProviderAccessTokenText: 'SEND PROVIDER ACCESS TOKEN',

index: 0,

routes: [
{ key: 'scoring', title: 'Scoring' },
{ key: 'verification', title: 'Verification' },
],

applicationIdDebugInfo : '',
deviceIdDebugInfo: '',
serviceTokenDebugInfo: '',
dataSendingCallback: '',
sendProviderAccessTokenCallback: '',
errorApplicationId : null,

//Picker default values
gatewayUrl: 'https://gateway.partner-service.link',
uploadMode: 'Wifi + Mobile',
provider: 'facebook',

//Scoring
scoring: {
applicationId : '',
verificationValue: '',
providerAccessValue: '',
wifiOnly: false,
enableLogDisplay: true,
enableSms: true,
enableCallLog: true,
enableContact: true,
enableCalendarEvent: true,
enableInstalledApp: true,
enableBrowserHistory: true,
enableLocation: true,
enableBattCharge: true,
enableGalleryMetaData: true,
enableSmsBody: false,
enablePhoneNumber: false,
enableContactsName: false,
enableContactsEmail: false,
enableCalendarOrganizer: false,
enableCalendarDisplayName: false,
enableCalendarEmail: false,
},

//Provider Access
providerAccess: {
accessToken: '',
providerID: '',
extra_data: '',
expiration: '',
}

}

_handleIndexChange = index => this.setState({ index });

_renderHeader = props => indicatorStyle={styles.indicator}
style={styles.tabBar}
labelStyle={styles.label}/>;

_renderScene = ({route}) => {

switch(route.key){
case 'scoring':
return (


ref='applicationId'
label='Application ID'
value={this.state.scoring.applicationId}
onChangeText={ (applicationId) => {this.state.scoring.applicationId = applicationId}}
returnKeyType = {"done"}
error={this.state.errorApplicationId}
blurOnSubmit={ true }
/>
Settings:
selectedValue={this.state.gatewayUrl}
onValueChange={(itemValue, itemIndex) => {this.setState({gatewayUrl: itemValue})}}>



selectedValue={this.state.uploadMode}
onValueChange={(itemValue, itemIndex) => {this.setState({uploadMode: itemValue}); if(itemIndex === 0) {this.state.scoring.wifiOnly = false; }else {this.state.scoring.wifiOnly = true;} }}>



style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableLogDisplay = !this.state.scoring.enableLogDisplay}}
isChecked={this.state.scoring.enableLogDisplay}
rightText='Enable Debug Logs'
/>
Data type:
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableSms = !this.state.scoring.enableSms}}
isChecked={this.state.scoring.enableSms}
rightText='Enable SMS data collection'
/>
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableCallLog = !this.state.scoring.enableCallLog}}
isChecked={this.state.scoring.enableCallLog}
rightText='Enable Call Logs data collection'
/>
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableContact = !this.state.scoring.enableContact}}
isChecked={this.state.scoring.enableContact}
rightText='Enable Contacts data collection'
/>

style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableCalendarEvent = !this.state.scoring.enableCalendarEvent}}
isChecked={this.state.scoring.enableCalendarEvent}
rightText='Enable Calendar Events data collection'
/>

style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableInstalledApp = !this.state.scoring.enableInstalledApp}}
isChecked={this.state.scoring.enableInstalledApp}
rightText='Enable Installed Apps data collection'
/>

style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableBrowserHistory = !this.state.scoring.enableBrowserHistory}}
isChecked={this.state.scoring.enableBrowserHistory}
rightText='Enable Browser History data collection'
/>

style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableLocation = !this.state.scoring.enableLocation}}
isChecked={this.state.scoring.enableLocation}
rightText='Enable Location data collection'
/>

style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableBattCharge = !this.state.scoring.enableBattCharge}}
isChecked={this.state.scoring.enableBattCharge}
rightText='Enable Battery Charge data collection'
/>

style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableGalleryMetaData = !this.state.scoring.enableGalleryMetaData}}
isChecked={this.state.scoring.enableGalleryMetaData}
rightText='Enable Gallery Meta data collection'
/>
SMS Message content:
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableSmsBody = !this.state.scoring.isChecked}}
isChecked={this.state.scoring.enableSmsBody}
rightText='Enable SMS Body data collection'
/>
Data hashing:
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enablePhoneNumber = !this.state.scoring.enablePhoneNumber}}
isChecked={this.state.scoring.enablePhoneNumber}
rightText='Enable Phone Number hashing'
/>
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableContactsName = !this.state.enableContactsName}}
isChecked={this.state.scoring.enableContactsName}
rightText='Enable Contacts Name hashing'
/>
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableContactsEmail = !this.state.enableContactsEmail}}
isChecked={this.state.scoring.enableContactsEmail}
rightText='Enable Contacts Email hashing'
/>
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableCalendarOrganizer = !this.state.scoring.enableCalendarOrganizer}}
isChecked={this.state.scoring.enableCalendarOrganizer}
rightText='Enable Calendar Organizer hashing'
/>
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableCalendarDisplayName = !this.state.scoring.enableCalendarDisplayName}}
isChecked={this.state.scoring.enableCalendarDisplayName}
rightText='Enable Calendar Display Name hashing'
/>
style={{flex: 1, padding: 10}}
onClick={() => {this.state.scoring.enableCalendarEmail = !this.state.scoring.enableCalendarEmail}}
isChecked={this.state.scoring.enableCalendarEmail}
rightText='Enable Calendar Email hashing'
/>

{this.state.startDataText}


Application ID:
{this.state.applicationIdDebugInfo}


Device ID:
{this.state.deviceIdDebugInfo}


Service Token:
{this.state.serviceTokenDebugInfo}


Upload Mode:
{this.state.uploadMode}


Data Sending Callback:
{this.state.dataSendingCallback}



);
case 'verification':
return(


Providers:
selectedValue={this.state.provider}
onValueChange={(itemValue, itemIndex) => this.setState({provider : itemValue})}>








ref={ input => {
this.inputs['providerID'] = input;
}}
label='Provider Id'
value={this.state.providerAccess.providerID}
onChangeText={ (providerID) => {this.state.providerAccess.providerID = providerID}}
returnKeyType = {"next"}
blurOnSubmit={ false }
onSubmitEditing={() => {
this.focusNextField('accessToken');
}}
/>
ref={ input => {
this.inputs['accessToken'] = input;
}}
label='Provider Access Token'
value={this.state.providerAccess.accessToken}
onChangeText={ (accessToken) => {this.state.providerAccess.accessToken = accessToken}}
returnKeyType = {"next"}
blurOnSubmit={ false }
onSubmitEditing={() => {
this.focusNextField('extra_data');
}}
/>
ref={ input => {
this.inputs['extra_data'] = input;
}}
label='Provider Extra Data (optional)'
value={this.state.providerAccess.extra_data}
onChangeText={ (extra_data) => {this.state.providerAccess.extra_data = extra_data}}
returnKeyType = {"next"}
blurOnSubmit={ false }
onSubmitEditing={() => {
this.focusNextField('expiration');
}}
/>
ref={ input => {
this.inputs['expiration'] = input;
}}
label='Access Token Expiration'
value={this.state.providerAccess.expiration}
onChangeText={ (expiration) => {this.state.providerAccess.expiration = expiration.replace(/[^0-9]/g, '')}}
returnKeyType = {"done"}
keyboardType = 'numeric'
blurOnSubmit={ true }
/>

{this.state.sendProviderAccessTokenText}

Send Provider Access Token Callback:
{this.state.sendProviderAccessTokenCallback}



);
}

}

startAndroidData() {
RNDataSdkWrapper.setup(this.state.gatewayUrl,
this.state.scoring.wifiOnly, this.state.scoring.enableCallLog,
this.state.scoring.enableContact,this.state.scoring.enableLogDisplay,
this.state.scoring.enableSms,this.state.scoring.enableCalendarEvent,
this.state.scoring.enableInstalledApp, this.state.scoring.enableBrowserHistory,
this.state.scoring.enableLocation, this.state.scoring.enableBattCharge,
this.state.scoring.enableGalleryMetaData, this.state.scoring.enableSmsBody,
this.state.scoring.enablePhoneNumber, this.state.scoring.enableContactsName,
this.state.scoring.enableContactsEmail, this.state.scoring.enableCalendarOrganizer,
this.state.scoring.enableCalendarDisplayName, this.state.scoring.enableCalendarEmail,

(result, logMsg, statusCode) => {console.log('result: ' + result);
console.log('logMsg: ' + logMsg);
console.log('statusCode: ' + statusCode);

this.setState({dataSendingCallback: logMsg});
RNDataSdkWrapper.statisticsEnabled(
(statisticsEnabled) => {
if(statisticsEnabled){
this.setState({startDataText : 'STOP&CLEAR DATA SDK'})
} else{
this.setState({startDataText: 'START DATA SDK'})
}
});

});
RNDataSdkWrapper.startAndroidData(this.state.scoring.applicationId);
}

onPressStartData() {
if (this.state.startDataText.toUpperCase() === 'START DATA SDK'.toUpperCase()) {

if(this.state.scoring.applicationId == null || this.state.scoring.applicationId.trim() === "") {
this.setState({errorApplicationId: 'This field is mandatory!'})
} else {
this.setState({errorApplicationId: null})
this.setState({applicationIdDebugInfo: this.state.scoring.applicationId});

this.setState({startDataText : 'STOP&CLEAR DATA SDK'})

RNDataSdkWrapper.setApplicationId(this.state.scoring.applicationId);
this.startAndroidData();
this.setState({dataSendingCallback: 'process currently running'})
if (this.state.scoring.wifiOnly){
this.setState({uploadMode : 'Wifi'});
} else {
this.setState({uploadMode : 'Wifi + Mobile'});
}

RNDataSdkWrapper.getApplicationId((applicationId) => {
this.setState({applicationIdDebugInfo: applicationId})
});

RNDataSdkWrapper.getDeviceUID((deviceId) => {
this.setState({deviceIdDebugInfo: deviceId})
});

RNDataSdkWrapper.getServiceToken((serviceToken) => {
this.setState({serviceTokenDebugInfo: serviceToken})
});
}

} else {
RNDataSdkWrapper.clear();
this.setState({startDataText: 'START DATA SDK'})
this.setState({dataSendingCallback: ''})
this.setState({applicationIdDebugInfo: ''})
this.setState({deviceIdDebugInfo: ''})
this.setState({serviceTokenDebugInfo: ''})
}

}

onPressSendProviderAccessToken() {
this.setState({sendProviderAccessTokenCallback: 'process currently running'})
RNDataSdkWrapper.setProviderAccessToken(this.state.provider,
this.state.providerAccess.accessToken, this.state.providerAccess.providerID, this.state.providerAccess.extra_data,
String(this.state.providerAccess.expiration),
(result, logMsg, statusCode) => {console.log('result: ' + result);
console.log('logMsg: ' + logMsg);
console.log('statusCode: ' + statusCode);

this.setState({sendProviderAccessTokenCallback: logMsg})

});

}

focusNextField(id) {
this.inputs[id].focus();
}

onActionSelected(position) {
if (position === 0) { // index of 'About'
this.showAbout();
}
}

showAbout() {
Alert.alert(
'RNDataSdkWrapper Demo Application',
'v0.0.1',
[
{text: 'OK', onPress: () => console.log('OK Pressed')},
],
{ cancelable: false }
)
}

render() {
return (

title='React Native DataSDK Demo'
style={styles.toolbar}
titleColor='white'
actions={[{title: 'About'}]}
onActionSelected={this.onActionSelected}/>
style={[styles.mainContainer, this.props.style]}
navigationState={this.state}
renderScene={this._renderScene}
renderHeader={this._renderHeader}
onIndexChange={this._handleIndexChange}
initialLayout={initialLayout}/>

);
}
}