"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
    result["default"] = mod;
    return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
/* @flow */
const react_1 = __importStar(require("react"));
const ErrorBoundary_1 = __importDefault(require("components/hoc/ErrorBoundary"));
class ContactForm extends react_1.Component {
    constructor() {
        super(...arguments);
        this.state = {
            formType: 'ContactFormOnly',
            contactName: '',
            contactEmail: '',
            contactMessage: '',
            demoEmail: '',
            demoName: '',
            demoSurname: '',
            demoContactNumber: '',
            demoCompanyName: '',
            demoRole: '',
            isLoading: false,
            isSubmited: false,
        };
        this.onChange = (event) => {
            this.setState({ [event.target.id]: event.target.value });
        };
        this.onSubmitForm = () => __awaiter(this, void 0, void 0, function* () {
            const { contactName, contactEmail, contactMessage, demoName, demoSurname, demoContactNumber, demoCompanyName, demoRole, formType, demoEmail, } = this.state;
            let variables = {};
            if (formType === 'ContactFormOnly') {
                variables = {
                    email: contactEmail,
                    name: contactName,
                    message: contactMessage,
                    contactNumber: '',
                    role: '',
                    companyName: '',
                };
            }
            else {
                variables = {
                    email: demoEmail,
                    name: `${demoName} ${demoSurname}`,
                    message: '',
                    contactNumber: demoContactNumber,
                    role: demoRole,
                    companyName: demoCompanyName,
                };
            }
            if (variables.email === '') {
                return;
            }
            if (mixpanel) {
                mixpanel.track('Contact', Object.assign({}, variables));
            }
            this.setState({ isLoading: true });
            try {
                // await this.props.createGetInTouch({ variables });
                this.setState({ isLoading: false, isSubmited: true });
            }
            catch (error) {
                this.setState({ isLoading: false, isSubmited: false });
            }
        });
    }
    onChangeForm(formType) {
        this.setState({ formType });
    }
    render() {
        const { formType, contactName, contactEmail, contactMessage, demoName, demoSurname, demoContactNumber, demoCompanyName, demoRole, demoEmail, isLoading, isSubmited, } = this.state;
        return (react_1.default.createElement(ErrorBoundary_1.default, null,
            react_1.default.createElement("div", { className: "contact_form" },
                react_1.default.createElement("div", { className: "contact_tabs" },
                    react_1.default.createElement("ul", { className: "clearfix" },
                        react_1.default.createElement("li", { className: formType === 'ContactFormOnly' ? 'active' : '' },
                            react_1.default.createElement("a", { className: "contact-msg", href: "javascript:void(0);", onClick: () => this.onChangeForm('ContactFormOnly') }, "Send us a message")),
                        react_1.default.createElement("li", { className: formType === 'DemoFormOnly' ? 'active' : '' },
                            react_1.default.createElement("a", { className: "demo-message", href: "javascript:void(0);", onClick: () => this.onChangeForm('DemoFormOnly') }, "Request a demo")))),
                formType === 'ContactFormOnly' ? (react_1.default.createElement("div", { id: "ContactFormOnly" },
                    react_1.default.createElement("div", { className: "cols2 clearfix" },
                        react_1.default.createElement("div", { className: "cols" },
                            react_1.default.createElement("input", { type: "text", className: "form-control", id: "contactName", onChange: this.onChange, value: contactName, placeholder: `Name` })),
                        react_1.default.createElement("div", { className: "cols" },
                            react_1.default.createElement("input", { type: "email", id: "contactEmail", className: "form-control", onChange: this.onChange, value: contactEmail, placeholder: `Email` }))),
                    react_1.default.createElement("div", { className: "cols_full" },
                        react_1.default.createElement("textarea", { className: "form-control", id: "contactMessage", onChange: this.onChange, value: contactMessage, placeholder: `Message` }),
                        react_1.default.createElement("a", { className: "btn send_btn", onClick: this.onSubmitForm }, "Send"),
                        isLoading && (react_1.default.createElement("img", { className: "loading", src: require('images/loading.gif') })),
                        react_1.default.createElement("div", { className: "response-result" }, isSubmited && (react_1.default.createElement("p", null, "Good Job! We have got your request. We will contact you soon.")))))) : (react_1.default.createElement("div", { id: "DemoFormOnly" },
                    react_1.default.createElement("div", { className: "cols2 clearfix" },
                        react_1.default.createElement("div", { className: "cols" },
                            react_1.default.createElement("input", { type: "text", onChange: this.onChange, className: "form-control", id: "demoName", value: demoName, placeholder: `Name` })),
                        react_1.default.createElement("div", { className: "cols" },
                            react_1.default.createElement("input", { type: "text", id: "demoSurname", className: "form-control", onChange: this.onChange, value: demoSurname, placeholder: `Surname` }))),
                    react_1.default.createElement("div", { className: "cols2 clearfix" },
                        react_1.default.createElement("div", { className: "cols" },
                            react_1.default.createElement("input", { type: "text", className: "form-control", id: "demoContactNumber", onChange: this.onChange, value: demoContactNumber, placeholder: `Contact Number` })),
                        react_1.default.createElement("div", { className: "cols" },
                            react_1.default.createElement("input", { type: "text", id: "demoEmail", className: "form-control", onChange: this.onChange, value: demoEmail, placeholder: `Email` }))),
                    react_1.default.createElement("div", { className: "cols2 clearfix" },
                        react_1.default.createElement("div", { className: "cols" },
                            react_1.default.createElement("input", { type: "text", className: "form-control", id: "demoCompanyName", onChange: this.onChange, value: demoCompanyName, placeholder: `Company Name` })),
                        react_1.default.createElement("div", { className: "cols" },
                            react_1.default.createElement("input", { type: "text", id: "demoRole", onChange: this.onChange, className: "form-control", value: demoRole, placeholder: `Role` }))),
                    react_1.default.createElement("div", { className: "cols_full" },
                        react_1.default.createElement("a", { className: "btn send_btn", onClick: this.onSubmitForm }, "Send"),
                        isLoading && (react_1.default.createElement("img", { className: "loading", src: require('images/loading.gif') })),
                        react_1.default.createElement("div", { className: "response-result" }, isSubmited && (react_1.default.createElement("p", null, "Good Job! We have got your request. We will contact you soon.")))))))));
    }
}
exports.default = ContactForm;
//# sourceMappingURL=index.js.map