'use strict';

import React, {Component} from 'react';

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

export default class HeadTitleCell extends Component{


	constructor(props) {
	  super(props);
	}


	render() {

		let {title, moreUrl} = this.props;

		return (
			<View style={styles.container}>
				<Text style={styles.headerText}>{title}</Text>
				{
					(moreUrl && moreUrl != "") ?
						<TouchableOpacity 
							activeOpacity={1} 
							style={styles.headerMoreContainer}
							onPress={() => {this.props.onPressTitleMore && this.props.onPressTitleMore(moreUrl, 0)}}
						>
							<Image source={require("../../images/btn_more_n.png")}/>
						</TouchableOpacity>
					: null
				}
			</View>
        );
	}

};

let {width, height} = Dimensions.get('window');
// const DEVICE_WIDTH_RATIO = width / 320;


let styles = StyleSheet.create({

	container: {
        width: width,
		height: 40,
        backgroundColor: '#f0f0f0',
        flexDirection: 'row',
		justifyContent: 'center',
		alignItems: 'center',
    },


    headerText:{
		fontSize: 16,
		color: '#444444',
		textAlign: 'center',
		fontWeight: 'bold',
	},

	headerMoreContainer:{
		position: 'absolute',
		top: 0,
		right: 10,
		width: 40,
		height: 40,
		justifyContent: 'center',
		alignItems: 'center',
	},

});