'use strict';

import React from 'react';
import ReactNative from 'react-native';
import ImmutablePropTypes from 'react-immutable-proptypes';
import UserBrief from '../home/UserBrief';
// import Thumbs from './Thumbs';
// import SectionItem from './SectionItem';
// import NumberButton from './NumberButton';
const {
    View,
    Text,
    Image,
    TouchableOpacity,
    StyleSheet,
    Dimensions,
} = ReactNative;

export default class ReplyCell extends React.Component {

    static propTypes = {
        data: ImmutablePropTypes.contains({

            id: React.PropTypes.number,
            postId: React.PropTypes.number,
            createTime: React.PropTypes.number.isRequired,
            authorUid: React.PropTypes.number,

            // 帖子
            postInfo: ImmutablePropTypes.contains({
                title: React.PropTypes.string,
                type: React.PropTypes.string.isRequired,
            }),

            // 回复的内容
            blocks: ImmutablePropTypes.listOf(
                ImmutablePropTypes.contains({
                    commentId: React.PropTypes.number,
                    orderBy: React.PropTypes.number,
                    content: React.PropTypes.string,
                    templateKey: React.PropTypes.string.isRequired,
                })
            ),

            // 我的信息
            reply: ImmutablePropTypes.contains({
                headIcon: React.PropTypes.string,
                uid: React.PropTypes.number,
                name: React.PropTypes.string,
            }),

            // 被回复者信息
            replyTo: ImmutablePropTypes.contains({
                headIcon: React.PropTypes.string,
                uid: React.PropTypes.number,
                name: React.PropTypes.string,
            }),

            onPressAvatar: React.PropTypes.func,
            onPressReply: React.PropTypes.func,
            onPressPosts: React.PropTypes.func,

        }),

        // TODO 添加点击事件

    };

    constructor(props) {
        super(props);
    }

    render() {
        let data = this.props.data.toJS();
        let {
            id,
            postId,
            createTime,
            authorUid,
            postInfo,
            blocks,
            reply,
            replyTo,
        } = data;

        return (
            <View style={styles.container}>
                <View style={styles.topContainer}>
                    <UserBrief
                        avatar={reply.headIcon}
                        name={reply.name}
                        timeago={createTime.toString()}
                        // isOwner={isOwner}
                        onPressAvatar={() => {
                            this.props.onPressAvatar && this.props.onPressAvatar();
                        }}
                    />

                </View>

                <View style={styles.reply}>
                    <Text style={[styles.text,{fontSize:14}]}>
                    回复

                        <Text style={{color: '#4a90e2', fontSize: 14,}}
                        onPress={() => {
                            this.props.onPressReply && this.props.onPressReply();
                        }}
                        >
                         小草莓
                        </Text>



                    :如果你无法表单房间诶哦我就佛大发了瓦解偶发的拉萨减肥劳动局撒了附件二范德萨范德萨
                    </Text>
                </View>

                <View style={styles.lineInCell}/>

                <View style={styles.bottomContainer}>
                    <Text
                        style={[styles.text,{margin:15, fontSize: 18}]}
                        numberOfLines={1}
                        onPress={() => {
                            this.props.onPressPosts && this.props.onPressPosts();
                        }}
                    >
                    帖子：港南爱上米彩妆，看叫啥呢我发的是fdsafdsafdsafdasfd剪短发搜富哦为福建省的
                    </Text>
                </View>


            </View>


        );

    }
}

let styles = StyleSheet.create({
    container: {
        backgroundColor:'white',
        flexDirection:'column',
    },

    topContainer: {
        margin: 15,
    },

    reply: {
        // backgroundColor: 'red',
        marginLeft: 15,
        marginRight: 15,
    },

    text: {
        fontFamily: 'Helvetica Light',
    },


    bottomContainer: {
        backgroundColor:'white'
    },

    lineInCell: {
        height: 1,
        marginLeft: 15,
        marginTop: 15,
        // marginBottom: 15,
        backgroundColor: '#e0e0e0',
    },

    replyTouch: {
        backgroundColor: 'red',
        // padding: 0,
        width:80,
        height: 40,
    },
});