'use strict';

import React from 'react';
import ReactNative from 'react-native';

const {
  StyleSheet,
  Text,
  View,
  Image,
  Dimensions,
  TouchableOpacity,
} = ReactNative;

export default class AllBrandListCell extends React.Component {
    constructor(props) {
      super(props);
    }

    render() {

		let name = this.props.rowData.brand_name;
		let is_hot = this.props.rowData.is_hot;
		let is_show_new = this.props.rowData.is_show_new;
		let brand_id = this.props.rowData.id;
		let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.brand","params":{"brand_id":"${brand_id}"}}`;
		return(
			<TouchableOpacity activeOpacity={0.5} onPress={() => {
				this.props.onPressSlideItem && this.props.onPressSlideItem(url);
			}}>
				<View style={styles.rowTitle}>
					<Text style={styles.rowText}>{name}</Text>
					{is_show_new=='Y'?<View style={styles.new}><Text style={styles.text}>NEW</Text></View>:null}
					{is_hot=='Y'?<View style={styles.hot}><Text style={styles.text}>HOT</Text></View>:null}
				</View>
			</TouchableOpacity>
		);
    }
};


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

let styles = StyleSheet.create({
	rowText: {
		textAlign: 'left',
		fontSize: 14,
		marginLeft:10,
	},
	rowTitle: {
		flexDirection: 'row',
		alignItems: 'center',
		height: 44,
		width,
		backgroundColor: 'white',
		borderBottomColor: '#e5e5e5',
		borderBottomWidth: 0.5,
        borderBottomLeftRadius: 10,
        borderBottomRightRadius: 20,
	},
	text: {
		textAlign: 'left',
		fontSize: 10,
		color: 'white',
    },
	hot: {
		alignItems: 'center',
		height: 15,
		width: 30,
		backgroundColor: 'red',
		marginLeft: 10,
		justifyContent: 'center',
		borderRadius: 30,
	},
	new: {
		alignItems: 'center',
		height: 15,
		width: 30,
		backgroundColor: 'green',
		marginLeft: 10,
		justifyContent: 'center',
		borderRadius: 50,
	},
});