import React, {Component} from 'react';
import {
    Platform,
    StyleSheet,
    Text,
    View,
    TextInput, Button
} from 'react-native';

export default class LoginForm extends Component<{}> {
    constructor(props) {
        super(props);
        this._onLogInPressed = this._onLogInPressed.bind(this);
        this._response_recognizer = this._response_recognizer.bind(this);
        this.state = {
            phone_number: '',
            password: '',
            data: {}
        };
    }
    _response_recognizer(data: string ){

    }

    _onLogInPressed = () => {

        var data = {
            'phone_number': this.state.phone_number,
            'password': this.state.password
        }


        fetch("http://192.168.1.12:5000/login", {
            method: "POST",
            headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json',
                },
            body:  JSON.stringify(data)
        }).then(function(response){
                return response.json();
            }).then(function(data){
                console.log(data)
            this._response_recognizer(data)
            }) .catch((error) => {
            console.log("Error" + error);
        });
    };

    render() {
        return (
            <View style={styles.flow}>
                <Text style={styles.text}>phone number:</Text>
                <TextInput keyboardType='numeric'
                           style={styles.input}
                           ref="phone_number"
                           onChangeText={(phone_number) => this.setState({phone_number})}
                           maxLengt={11}
                           value={this.state.phone_number}
                />
                <Text style={styles.text}>password:</Text>
                <TextInput style={styles.input} secureTextEntry={true} ref="password"
                           onChangeText={(password) => this.setState({password})}
                           value={this.state.password}/>
                <Button style={styles.button} onPress={this._onLogInPressed} title='login'/>
            </View>
        );
    }
}