import * as React from "react";
import {Platform, StyleProp, Text, TextStyle, TouchableOpacity, View} from "react-native";
import {utils} from '@yoronsoft/js-utils';
import {IProps} from "./text";
import app from "../../app";
import {loggerConfig} from "../config";

const BasicText: React.FC<IProps> = (props) => {
    const css = app.themeCss.get();
    //  时间戳
    const [timer, setTimer] = React.useState<number>(new Date().getTime());
    //  是否是debug
    const isDebug = typeof props.isDebug === 'boolean' ? props.isDebug : false;
    //  logger
    const logger = loggerConfig('Text', isDebug);
    //  不可点击时长
    const notPressTimer = Math.ceil(props.notPressTimer ? Number(props.notPressTimer) : 300);
    //  是否可以连续点击
    const hasContinuousClick = typeof props.hasContinuousClick === 'boolean' ? props.hasContinuousClick : false;
    //  默认样式
    const defaultCss: StyleProp<TextStyle> = {color: css.font.color, fontSize: 14, lineHeight: 20};
    if (Platform.OS === 'android') defaultCss.fontFamily = 'lucida grande, tahoma, verdana, arial, sans-serif';
    //  操作样式
    const styleCss: StyleProp<TextStyle> = {};
    if (props.color) styleCss.color = props.color;
    if (props.size) styleCss.fontSize = Number(props.size);
    if (props.width) styleCss.width = props.width;
    if (props.height) styleCss.height = props.height;
    if (props.weight) styleCss.fontWeight = props.weight;
    if (props.lineHeight) styleCss.lineHeight = Number(props.lineHeight);
    if (props.textAlign) styleCss.textAlign = props.textAlign;
    if (props.t) styleCss.marginTop = props.t;
    if (props.b) styleCss.marginBottom = props.b;
    if (props.l) styleCss.marginLeft = props.l;
    if (props.r) styleCss.marginRight = props.r;
    if (props.p) styleCss.padding = props.p;
    if (props.pv) styleCss.paddingVertical = props.pv;
    if (props.ph) styleCss.paddingHorizontal = props.ph;
    if (props.pt) styleCss.paddingTop = props.pt;
    if (props.pb) styleCss.paddingBottom = props.pb;
    if (props.pl) styleCss.paddingLeft = props.pl;
    if (props.pr) styleCss.paddingRight = props.pr;
    if (props.m) styleCss.margin = props.m;
    if (props.mv) styleCss.marginVertical = props.mv;
    if (props.mh) styleCss.marginHorizontal = props.mh;
    if (props.mt) styleCss.marginTop = props.mt;
    if (props.mb) styleCss.marginBottom = props.mb;
    if (props.ml) styleCss.marginLeft = props.ml;
    if (props.mr) styleCss.marginRight = props.mr;

    logger.log('props', props);
    logger.log('style', styleCss);

    //  内容view
    let contentView = <View/>;
    /**
     * text 文本显示
     */
    if (props.text) {
        const text = props.text.toString();
        contentView = <Text style={[defaultCss, props.style ?? {}, styleCss]}
                            allowFontScaling={false}
                            selectable={props.isSelectable}>{text}</Text>;
        //  小数点替换
        if (props.line) {
            const width = props.width ? props.width : css.width - 30;
            contentView = <Text style={[defaultCss, {width}, props.style ?? {}, styleCss]}
                                allowFontScaling={false}
                                numberOfLines={Number(props.line)}
                                selectable={props.isSelectable}>{text}</Text>;
        }
        /**
         * 纯文本输出
         */
        if (props.hasText) return contentView;
    }
    /**
     * children 多内容
     */
    if (props.children) {
        const style = [props.style ?? {}, styleCss];
        //  判断有点击时间添加不可点击样式
        if (typeof props.onPress === 'function' || typeof props.onLongPress === "function") style.push(props.notPressStyle ?? {});
        contentView = <View style={style}>{props.children}</View>;
    }
    /**
     * 是否存在点击事件
     */
    if (typeof props.onPress === 'function' || typeof props.onLongPress === "function") {
        /**
         * 获取 flex
         * 当style设置了flex，TouchableOpacity也需要设置flex
         */
        let flex = 0, propsStyle: any = props.style;
        const getFlex = (data) => {
            let result;
            for (let name in data) {
                if (name !== 'flex') continue;
                result = data[name];
            }
            return result;
        }
        if (utils.isArray(propsStyle)) {
            propsStyle.map((item) => {
                const data = getFlex(item);
                if (data) flex = data;
            })
        } else flex = getFlex(propsStyle);
        const styleFlex = flex ? {flex: flex} : undefined;
        return <TouchableOpacity
            style={styleFlex} activeOpacity={0.9}
            onPress={(event) => {
                if (!hasContinuousClick) {
                    const time = new Date().getTime();
                    if (timer > time) return;
                    setTimer(time + notPressTimer);
                }
                if (typeof props.onPress === "function") props.onPress(event);
            }}
            onLongPress={event => {
                if (typeof props.onLongPress === "function") props.onLongPress(event);
            }}
        >
            {contentView}
        </TouchableOpacity>
    }

    return contentView
}

export default BasicText