'use strict';

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



export default class List extends Component {

    constructor(props) {
        super(props);

    }


    render() {
        let resource = this.props.resource;
        if (!resource) {
            return null;
        }
        return (
            <View style={styles.headerContent}>
                <Image style={styles.avatar} source={{uri:resource.avatar}}/>
                <View style={styles.headerRight}>
                    <Text style={styles.title}>{resource.name}</Text>
                    <Text style={styles.subTitle}>{resource.author_desc?resource.author_desc:''}</Text>
                </View>
            </View>
        );
    }
}

let {width, height} = Dimensions.get('window');

let styles = StyleSheet.create({
    headerContent: {
        height: 104,
        width: width,
        backgroundColor: 'white',
        flexDirection: 'row',
        borderColor: 'rgb(215, 215, 215)',
        borderTopWidth: 1,
    },
    avatar: {
        marginTop: 20,
        marginLeft: 15,
        width: 50,
        height: 50,
        borderRadius: 25,
        backgroundColor: 'gray',
    },
    headerRight: {
        marginTop: 24,
        marginLeft: 20,
        flexDirection: 'column',
        marginRight: 0,
        backgroundColor: 'white',
        height: 45,
        width: width - 100,
        justifyContent: 'space-between',
    },
    title: {
        fontSize: 16,
        color: 'rgb(83, 83, 83)',
        textAlign: 'left',
        width: width - 100,
    },
    subTitle: {
        fontSize: 13,
        color: 'rgb(215, 215, 215)',
        textAlign: 'left',
        width: width - 100,
    }
});