import React, { Component } from "react"
import { TextInput, EmitterSubscription, Text, TextInputProperties } from 'react-native';

import { IformState, IformProp, IformOption } from '../aim/form'

import OperateForm from '../operate/form'
import PlusHelperItem from '../helper/item'

import PlusItemBook from '../item/book'
import { IbaseStyleExtend, IbasePropertyExtend, IclassEvent, IbaseDeviceEvent, IbaseEventExpand } from "../aim/face"
import PlusCommonEvent from '../common/event'
import BaseDefine from '../base/define'

interface State extends IformState {

}

interface Prop extends IformProp, IbasePropertyExtend, IbaseEventExpand, TextInputProperties {

}

const styles: IbaseStyleExtend = {


    styleMainText: {
        padding: 0
    }
};

export default class extends Component<Prop, State> implements IclassEvent {

    subscription: EmitterSubscription

    constructor(props: Prop) {
        super(props);


        var sValue = OperateForm.upFormValue(props.name, props.formDefaultValue != undefined ? props.formDefaultValue : '');

        OperateForm.inRegexField(props.name, props.formRegexCode);

        this.state = { currentValue: sValue };

        if (this.props.pSubscribe != undefined) {
            this.subscription = PlusCommonEvent.addListener(BaseDefine.upPlusDefine().eventSubscribeUpdate + this.props.pSubscribe, (data: IbaseDeviceEvent) => {
                //that.updateDataSource(data, that);
                if (data.eventValue != undefined) {
                    this.saveValue(data.eventValue);

                }

            });

        }

    }

    /**
     * 修改值
     * 
     * @param {string} sValue 
     */
    changeValue(sValue: string) {
        this.saveValue(sValue);

        if (this.props.onValueChange != undefined) {
            this.props.onValueChange(sValue);
        }




    }

    saveValue(sValue: string) {
        this.setState({ currentValue: sValue });
        OperateForm.inFormValue(this.props.name, sValue);
    }



    clearSubscription() {
        if (this.subscription) {
            this.subscription.remove();
        }

        return true;
    }

    componentWillUnmount() {
        this.clearSubscription();
    };


    render() {


        let sShowType = PlusHelperItem.upItemShowType(this.props.pShow, OperateForm.upFormType(this.props.name));

        if (sShowType === "hidden") {
            return null;
        }

        else if (sShowType === "book") {

            return (

                <PlusItemBook pText={this.state.currentValue}>
                </PlusItemBook>

            );

        }

        else {
            return (

                <TextInput value={this.state.currentValue} onChangeText={this.changeValue.bind(this)}
                    style={[styles.styleMainText, this.props.style]}
                    underlineColorAndroid="transparent"
                    autoCapitalize="none"

                    placeholder={this.props.placeholder}
                    secureTextEntry={this.props.secureTextEntry}
                    keyboardType={this.props.keyboardType}
                    multiline={this.props.multiline}
                    placeholderTextColor={this.props.placeholderTextColor}
                    maxLength={this.props.maxLength}
                >

                </TextInput>

            );
        }


    }


}