/*
 * 明星原创--资讯列表
 * create by 陈林 2016.12.14
 */

'use strict';

import React, {Component} from 'react';
import ReactNative, {
    View,
    Text,
    Image,
    ListView,
    StyleSheet,
    Dimensions,
    TouchableOpacity,
} from 'react-native';

//import SlicedImage from '../../../common/components/SlicedImage';
import BrandArticleCell from './BrandArticleCell';

export default class BrandArticleList extends Component {

    constructor(props) {
        super(props);

        this._renderRow = this._renderRow.bind(this);
        this._renderHeader = this._renderHeader.bind(this);

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

    }

    _renderHeader(){
        return(
                <Text style={styles.headerText}>相关资讯</Text>
            );
    }

    _renderRow(rowData, sectionID, rowID, highlightRow) {

                return (
                    <BrandArticleCell
                        // style={[styles.listContainer, customStyle]}
                        key={'row' + rowID}
                        rowID={rowID}
                        rowData={rowData}
                        // onPressProduct={this.props.onPressProduct}
                    />
                    
                );
    }

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

    render() {
        let {articleList} = this.props;

        return (
            <View style={styles.container}>

                <ListView
                    contentContainerStyle={styles.contentContainer}
                    dataSource={this.dataSource.cloneWithRows(articleList.toArray())}
                    renderRow={this._renderRow}
                    enableEmptySections = {true}
                    renderSeparator={this._renderSeparator}
                    //renderHeader={this._renderHeader}
                    />

            </View>
        );
    }
}

let {width, height} = Dimensions.get('window');
let rowWidth = Math.ceil(137.5 * width / 320);
let rowHeight = Math.ceil(254 * width / 320);
let rowMarginTop = Math.ceil(10 * width / 320);

let styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: 'white',
    },
    contentContainer: {
        flexWrap: 'wrap',
    },
    filterContainer: {

    },
    listContainer: {
        width: width / 2,
    },
    separator: {
        width,
        height: 20,
        backgroundColor: '#e0e0e0',
    },

    headerText:{
        width,
        marginLeft: 29,
        marginRight: 29,
        borderColor: '#e0e0e0',
        borderBottomWidth: 0,
        lineHeight: 36,
        fontSize: 30,
        color: '#b0b0b0',
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: "#ffffff",
    },
});