import template from "./InputNumber.html";

class InputNumber {
    props = {
        defaultValue: Number,
        min: Number,
        max: Number,
        onChange: Function,
        value: Number,
        precision: Number,
        key: Number,
        step: Number,
        formatter: Function,
        parser: Function,
        disabled: Boolean,
    };

    state = {
        value: this.props.value || this.props.defaultValue,
        min: Number(this.props.min),
        max: Number(this.props.max),
        precision: Number(this.props.precision) || 0,
        key: Number(this.props.key),
        step: this.props.step || 1,
    };

    watch = {
        value: function (newVal) {
            this.setValue(newVal);
        },
        disabled: function (newVal) {
            if (newVal === undefined || newVal === "false" || newVal === "0") {
                this.state.disabled = false;
            } else if (
                newVal === "true" ||
                newVal === "1" ||
                newVal === "disabled"
            ) {
                this.state.disabled = true;
            }
        },
    };

    constructor() {
        this.inputElement = $element[0].querySelector("input");
        $element[0].removeAttribute("ng-class");
        $element[0].removeAttribute("value");
        $element[0].removeAttribute("formatter");
        $element[0].removeAttribute("parser");
        $element[0].removeAttribute("on-change");
        $element[0].removeAttribute("disabled");
    }

    multiply(num1, num2) {
        let baseNum = 0;
        try {
            baseNum += num1.toString().split(".")[1].length;
        } catch (e) {}
        try {
            baseNum += num2.toString().split(".")[1].length;
        } catch (e) {}
        return (
            (Number(num1.toString().replace(".", "")) *
                Number(num2.toString().replace(".", ""))) /
            Math.pow(10, baseNum)
        );
    }

    toFixed(value, number = 2) {
        return parseFloat(
            Math.floor(this.multiply(value, Math.pow(10, number))) /
                Math.pow(10, number)
        ).toFixed(number);
    }

    setValue(value) {
        if (this.props.parser({ value: value }) !== undefined) {
            value = this.props.parser({ value: value });
        }
        if (
            this.state.max !== null &&
            this.state.max !== undefined &&
            value !== "" &&
            value > this.state.max
        ) {
            value = this.state.max;
        }
        if (
            this.state.min !== null &&
            this.state.min !== undefined &&
            value !== "" &&
            value < this.state.min
        ) {
            value = this.state.min;
        }
        
        if (!/\d+/.test(value)) {
            this.state.value = "";
            value = "";
        }

        if (this.state.precision === 0 && value !== "") {
            value = parseInt(value);
        }
        if (this.state.precision > 0 && value !== "") {
            value = this.toFixed(value, this.state.precision);
        }
        if (this.props.formatter({ value: value }) !== undefined) {
            value = this.props.formatter({ value: value });
        }
        this.state.value = value;
        if (this.props.parser({ value: value || "" }) !== undefined) {
            value = this.props.parser({ value: value || "" });
        }
        this.props.onChange({ value: value });
    }

    sum(num1, num2) {
        return ((this.pow(num1) + this.pow(num2)) / this.pow(1)).toFixed(
            this.props.precision
        );
    }

    reduce(num1, num2) {
        return ((this.pow(num1) - this.pow(num2)) / this.pow(1)).toFixed(
            this.props.precision
        );
    }

    pow(number, baseNum) {
        let str = String(number);
        if (str.indexOf(".") !== -1) {
            return parseInt(str.replace(".", ""));
        } else {
            return number * Math.pow(10, baseNum || this.props.precision || 0);
        }
    }

    handleClick(type) {
        let value = null;
        if (!this.state.value) {
            value = 0;
        } else {
            value = this.state.value;
        }
        if (this.props.parser({ value: value || "" })) {
            value = this.props.parser({ value: value || "" });
        }
        if (type === "up") {
            this.setValue(this.sum(value, this.state.step));
        } else {
            this.setValue(this.reduce(value, this.state.step));
        }
    }

    handleClickInput(event) {
        this.state.inputEvent = event;
    }

    handleBlur(event) {
        this.setValue(event.target.value);
    }
}