'use strict';

import React, {Component} from 'react';
import ReactNative, {
    View,
    Text,
    StyleSheet,
    Dimensions,
} from 'react-native';
import Immutable, {Map} from 'immutable';
import TimeNumber from './PBTimeNumber';

export default class PBTimeForNow extends Component {

    constructor(props) {
        super(props);
    }

    render() {
        let {
            time,
            tickTimeOut,
            tickHour,
            tickMinute,
            tickSecond,
            lastNowTime,
        } = this.props;

        let colorStyle = {color: '#d30018'};
        if (lastNowTime) {
            return(
                <View style={[styles.rowContainerFocus,{justifyContent: 'center'}]}>
                    <Text style={[colorStyle,{fontSize: 13, fontWeight: 'bold'}]}>{time} 抢购中</Text>
                </View>
            );
        }else {
            return (
                <View style={styles.rowContainerFocus}>
                    <Text style={[colorStyle,{fontSize: 13, marginTop:15, fontWeight:'bold'}]}>{time} 抢购中</Text>
                    {tickTimeOut ? null :
                        <View style={styles.tickTimeContainer}>
                            <Text style={[colorStyle,{fontSize: 10}]}>剩余:</Text>
                            <TimeNumber text={tickHour} />
                            <TimeNumber text={tickMinute} />
                            <TimeNumber text={tickSecond} />
                        </View>}
                </View>
            );
        }
    }
}

let {width, height} = Dimensions.get('window');
let backgroundHeight = 61;
let rowContainerFocusWidth = Math.ceil((294 * width) / 750);

let styles = StyleSheet.create({
    rowContainerFocus: {
        flexDirection: 'column',
        alignItems: 'center',
        width: rowContainerFocusWidth,
        height: backgroundHeight,
        backgroundColor:'white',
    },
    tickTimeContainer: {
        alignItems: 'center',
        justifyContent: 'center',
        flexDirection: 'row',
    },
});