'use strict';

import React from 'react';
import ReactNative from 'react-native';
import LikeCell from './LikeCell';
import LoadMoreIndicator from '../../../common/components/LoadMoreIndicator';

const {
    View,
    Text,
    ListView,
    StyleSheet,
    Platform,
    Dimensions,
} = ReactNative;

export default class LikeMessage extends React.Component {
    static propTypes = {

    }

    constructor(props) {
        super(props);

        this._renderRow = this._renderRow.bind(this);
        this._renderSeparator = this._renderSeparator.bind(this);
        this.dataSource = new ListView.DataSource({
            rowHasChanged: (r1, r2) => !Immutable.is(r1, r2),
        });
    }

    _renderSeparator(sectionID, rowID, adjacentRowHighlighted) {
        return (
            <View key={'separator' + sectionID + rowID} style={styles.separator}/>
        );
    }

    _renderRow(rowData, sectionID, rowID, highlightRow) {
        return (
            <LikeCell
                key={sectionID + rowID}
                data={rowData}
                onPressPost={this.props.onPressPost}
                onPressAvatar={this.props.onPressAvatar}
            />
        );
    }

    render() {
        let {list, endReached, isLoadingMore, isFetching} = this.props;
        return (
            <View style={styles.container}>
                <ListView
                    ref={(c) => {
                        this.listView = c;
                    }}
                    dataSource={this.dataSource.cloneWithRows(list.toArray())}
                    renderRow={this._renderRow}
                    renderSeparator={this._renderSeparator}
                    enableEmptySections={true}
                    enablePullToRefresh={false}
                    onEndReached={() => {
                        this.props.onEndReached && this.props.onEndReached();
                    }}
                    renderFooter={()=>{
                        if (endReached) {
                            return <LoadMoreIndicator
                                    isVisible={true}
                                    text={'暂无更多'}
                                />
                        } else {
                            return <LoadMoreIndicator
                                    isVisible={isLoadingMore}
                                    animating={isFetching}
                                />
                        }
                    }}
                />
            </View>
        )
    }
}

let styles = StyleSheet.create({
    container: {
        flex: 1,
    },
    separator: {
        height: 0.5,
        backgroundColor: '#e0e0e0',
    },
});