"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const Immutable = require("immutable");
const Moment = require("moment");
const core_1 = require("./core");
function format_int(num, length) {
    return (num / Math.pow(10, length)).toFixed(length).substr(2);
}
class Number extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = { value: props.value };
    }
    componentWillReceiveProps(new_props) {
        if (new_props.value != this.state.value)
            this.setState(Object.assign({}, this.state, { value: new_props.value })); //, () => this.call_cont(this.state.value))
    }
    componentWillMount() {
        this.call_cont(this.state.value);
    }
    call_cont(value) {
        this.props.cont(() => null)(value);
    }
    render() {
        return this.props.mode == "edit" ?
            React.createElement("input", { type: "number", value: this.state.value, onChange: e => {
                    let new_value = isNaN(e.currentTarget.valueAsNumber) ? 0 : e.currentTarget.valueAsNumber;
                    if (new_value == this.state.value)
                        return;
                    this.props.cont(() => null)(new_value);
                } })
            :
                React.createElement("span", null, this.state.value);
    }
}
exports.number = (mode, key, dbg) => function (value) {
    return core_1.make_C(ctxt => cont => React.createElement(Number, { kind: "number", debug_info: dbg, mode: mode, value: value, context: ctxt, cont: cont, key: key }));
};
class String extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = { value: props.value };
    }
    componentWillReceiveProps(new_props) {
        if (this.props.debug_info != undefined)
            console.log(`receiving props`, this.props.debug_info());
        if (new_props.value != this.state.value)
            this.setState(Object.assign({}, this.state, { value: new_props.value })); //, () => this.call_cont(new_props.value))
    }
    componentWillMount() {
        if (this.props.debug_info != undefined)
            console.log(`mounting`, this.props.debug_info());
        this.call_cont(this.state.value);
    }
    call_cont(value) {
        if (this.props.debug_info != undefined)
            console.log(`calling continuation`, this.props.debug_info());
        this.props.cont(() => null)(value);
    }
    render() {
        if (this.props.debug_info != undefined)
            console.log(`render`, this.props.debug_info());
        return this.props.mode == "edit" ? React.createElement("input", { type: this.props.type, value: this.state.value, onChange: e => {
                if (this.state.value == e.currentTarget.value)
                    return;
                this.call_cont(e.currentTarget.value);
            }, size: this.props.optional_parameters.size != undefined ? this.props.optional_parameters.size : undefined, disabled: this.props.optional_parameters.disabled != undefined && this.props.optional_parameters.disabled })
            :
                this.props.type == "text" ?
                    React.createElement("span", null, this.state.value)
                    : this.props.type == "tel" ?
                        React.createElement("a", { href: `tel:${this.state.value}` }, this.state.value)
                        : this.props.type == "email" ?
                            React.createElement("a", { href: `mailto:${this.state.value}` }, this.state.value)
                            : this.props.type == "url" ?
                                React.createElement("a", { href: this.state.value }, this.state.value)
                                : this.props.type == "password" ?
                                    React.createElement("span", null, Immutable.Repeat("*", this.state.value.length).join(""))
                                    :
                                        React.createElement("span", null, this.state.value);
    }
}
exports.string = (mode, type, key, dbg, optional_parameters) => function (value) {
    return core_1.make_C(ctxt => cont => React.createElement(String, { kind: "string", debug_info: dbg, type: type || "text", mode: mode, value: value, context: ctxt, cont: cont, key: key, optional_parameters: optional_parameters == undefined || optional_parameters == null ? {} : optional_parameters }));
};
class Bool extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = { value: props.value };
    }
    componentWillReceiveProps(new_props) {
        if (new_props.value != this.state.value)
            this.setState(Object.assign({}, this.state, { value: new_props.value })); //, () => this.call_cont(this.state.value))
    }
    componentWillMount() {
        this.call_cont(this.state.value);
    }
    call_cont(value) {
        this.props.cont(() => null)(value);
    }
    render() {
        return this.props.style == "fancy toggle" ?
            React.createElement("input", { type: "checkbox", className: "monadic-input-choices monadic-input-choices--switch", disabled: this.props.mode == "view", checked: this.state.value, onChange: e => this.props.cont(() => null)(e.currentTarget.checked) })
            : this.props.style == "plus/minus" ?
                React.createElement("input", { type: "checkbox", className: "monadic-input-choices monadic-input-choices--toggle", disabled: this.props.mode == "view", checked: this.state.value, onChange: e => this.props.cont(() => null)(e.currentTarget.checked) })
                :
                    React.createElement("input", { type: this.props.style, className: "monadic-input-choices monadic-input-choices--checkbox", disabled: this.props.mode == "view", checked: this.state.value, onChange: e => this.props.cont(() => null)(e.currentTarget.checked) });
    }
}
exports.bool = (mode, style, key, dbg) => function (value) {
    return core_1.make_C(ctxt => cont => React.createElement(Bool, { kind: "bool", debug_info: dbg, style: style, mode: mode, value: value, context: ctxt, cont: cont, key: key }));
};
class DateTime extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = { value: props.value };
    }
    componentWillReceiveProps(new_props) {
        if (new_props.value != this.state.value)
            this.setState(Object.assign({}, this.state, { value: new_props.value })); //, () => this.call_cont(this.state.value))
    }
    componentWillMount() {
        this.call_cont(this.state.value);
    }
    call_cont(value) {
        this.props.cont(() => null)(value);
    }
    render() {
        let item = this.state.value;
        let default_value = `${format_int(item.year(), 4)}-${format_int(item.month() + 1, 2)}-${format_int(item.date(), 2)}T${format_int(item.hours(), 2)}:${format_int(item.minutes(), 2)}`;
        return this.props.mode == "view" ?
            React.createElement("div", null, `${format_int(item.date(), 2)}/${format_int(item.month() + 1, 2)}/${format_int(item.year(), 4)}  ${format_int(item.hours(), 2)}:${format_int(item.minutes(), 2)}`)
            : React.createElement("input", { type: "datetime-local", value: default_value, onChange: (e) => this.call_cont(Moment.utc(e.currentTarget.value)) });
    }
}
exports.date_time = (mode, key, dbg) => function (value) {
    return core_1.make_C(ctxt => cont => React.createElement(DateTime, { kind: "date time", debug_info: dbg, mode: mode, value: value, context: ctxt, cont: cont, key: key }));
};
class DateOnly extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = { value: props.value };
    }
    componentWillReceiveProps(new_props) {
        if (new_props.value != this.state.value)
            this.setState(Object.assign({}, this.state, { value: new_props.value })); //, () => this.call_cont(this.state.value))
    }
    componentWillMount() {
        this.call_cont(this.state.value);
    }
    call_cont(value) {
        this.props.cont(() => null)(value);
    }
    render() {
        let item = this.state.value;
        let default_value = `${format_int(item.year(), 4)}-${format_int(item.month() + 1, 2)}-${format_int(item.date(), 2)}`;
        return this.props.mode == "view" ?
            React.createElement("div", null, `${format_int(item.date(), 2)}/${format_int(item.month() + 1, 2)}/${format_int(item.year(), 4)}`)
            : React.createElement("input", { type: "date", value: default_value, onChange: (e) => this.call_cont(Moment.utc(new Date(e.currentTarget.value)).startOf('d').add(12, 'h')) });
    }
}
exports.date = (mode, key, dbg) => function (value) {
    return core_1.make_C(ctxt => cont => React.createElement(DateOnly, { kind: "date", debug_info: dbg, mode: mode, value: value, context: ctxt, cont: cont, key: key }));
};
class Time extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = { value: props.value };
    }
    componentWillReceiveProps(new_props) {
        if (new_props.value != this.state.value)
            this.setState(Object.assign({}, this.state, { value: new_props.value })); //, () => this.call_cont(this.state.value))
    }
    componentWillMount() {
        this.call_cont(this.state.value);
    }
    call_cont(value) {
        this.props.cont(() => null)(value);
    }
    render() {
        let item = this.state.value;
        let default_value = `${format_int(item.hours(), 2)}:${format_int(item.minutes(), 2)}`;
        return this.props.mode == "view" ?
            React.createElement("div", null, default_value)
            : React.createElement("input", { type: "time", value: default_value, onChange: (e) => this.call_cont(Moment.utc(e.currentTarget.valueAsDate)) });
    }
}
exports.time = (mode, key, dbg) => function (value) {
    return core_1.make_C(ctxt => cont => React.createElement(Time, { kind: "time", debug_info: dbg, mode: mode, value: value, context: ctxt, cont: cont, key: key }));
};
//# sourceMappingURL=primitives.js.map