'use strict';

import React from 'react';
import ReactNative from 'react-native';
const {
    Component,
} = React;

const {
    StyleSheet,
    TouchableOpacity,
    Text,
} = ReactNative;

export default class Day extends Component {
    render() {
        let {date, status, disabled, onDayPress, width, belongWeek, first, last} = this.props;
        let onPress, textColor, backColor;

        if (disabled) {
            status = 'disabled';
            onPress = null;
        } else {
            onPress = () => {
                onDayPress({
                    date,
                    belongWeek,
                });
            }
        }

        let borderTopLeftRadius = first ? 5 : 0;
        let borderBottomLeftRadius = first ? 5 : 0;
        let borderTopRightRadius = last ? 5 : 0;
        let borderBottomRightRadius = last ? 5 : 0;

        switch (status) {
            case 'disabled':
                backColor = this.props.dayDisabledBackColor;
                textColor = this.props.dayDisabledTextColor;
                break;

            case 'common':
                backColor = this.props.dayCommonBackColor;
                textColor = this.props.dayCommonTextColor;
                break;

            case 'selected':
                backColor = this.props.daySelectedBackColor;
                textColor = this.props.daySelectedTextColor;
                break;

            case 'inRange':
                backColor = this.props.dayInRangeBackColor;
                textColor = this.props.dayInRangeTextColor;
                break;
        }

        return (
            <TouchableOpacity
                activeOpacity={disabled ? 1 : 1}
                style={[styles.common, {backgroundColor: backColor, width: Math.floor(width / 8), height: width / 12, borderTopLeftRadius, borderBottomLeftRadius,borderTopRightRadius, borderBottomRightRadius}]}
                onPress={onPress}>
                <Text style={{color: textColor}}>{date.getDate()}</Text>
            </TouchableOpacity>
        );
    }
}

const styles = StyleSheet.create({
    common: {
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: 'white',
    }
});