/**
 * SMARTFORM
 * @todo save form user input
 */

if (typeof makeid == "undefined") {
    /**
     * unique id generator
     * @param length digit number string
     * @returns random string
     */
    var makeid = function (length: number) {
        var result = "";
        var characters = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
        var charactersLength = characters.length;
        for (var i = 0; i < length; i++) {
            result += characters.charAt(Math.floor(Math.random() * charactersLength));
        }

        return result;
    };
}

/**
 * Element Counter
 */
var Count = -1;
/**
 * Local Storage key
 */
var storageKey: String = location.pathname.replace(/\/$/s, "") + "/formField";
/**
 * Element Indexer
 */
var formField: object | Array<any>;
var formSaved = localStorage.getItem(storageKey.toString());
if (!formSaved) {
    formField = [];
} else {
    formField = JSON.parse(formSaved);
}
var uniqueid = makeid(5);

/**
 * check if running in browser
 */
var isBrowser = new Function("try {return this===window;}catch(e){ return false;}");

//console.log(`is browser : ${isBrowser()}`);
if (isBrowser()) {
    (function () {
        const isJqueryLoaded = typeof jQuery != "undefined";
        //console.log(`is jQuery loaded : ${isJqueryLoaded}`);
        if (isJqueryLoaded) {
            //console.log("Apply plugin smartform jQuery");

            (function ($) {
                $.fn.getIDName = function () {
                    //var native: HTMLElement = this;
                    /**
                     * @todo Adding attribute id if not have id
                     */
                    if (!$(this).attr("id") || $(this).attr("id") == "") {
                        try {
                            if (!(Count in formField)) {
                                /**
                                 * @todo ID generator 6 digit alphanumerics
                                 */
                                var id: string = Math.random().toString(20).substr(2, 6);
                                $(this).attr("id", id);
                                (<any>formField)[Count] = id;
                                localStorage.setItem(storageKey.toString(), JSON.stringify(formField));
                            } else {
                                $(this).attr("id", (<any>formField)[Count]);
                            }
                        } catch (error) {
                            console.error(error);
                            console.log(formField, typeof formField);
                        }
                        /**
                         * Increase index offset
                         */
                        Count++;
                    }
                    if ($(this).attr("aria-autovalue")) {
                        $(this).val(uniqueid);
                    }
                    return (
                        "[" +
                            location.pathname.replace(/\/$/, "") +
                            "/" +
                            $(this).prop("tagName") +
                            "/" +
                            $(this).attr("id") +
                            "/" +
                            $(this).attr("name") || "empty" + "]"
                    );
                };
                $.fn.has_attr = function (name: string) {
                    var attr = $(this).attr("name");
                    // For some browsers, `attr` is undefined; for others,
                    // `attr` is false.  Check for both.
                    return typeof attr !== "undefined" && attr !== false;
                };
                $.fn.smartForm = function () {
                    Count++;

                    if ($(this).attr("no-save")) {
                        return;
                    }
                    var t = $(this);
                    /**
                     * Is this element has select2 initialized ?
                     */
                    var is_select2 = $(this).data("select2");

                    //set indicator
                    t.attr("formsaver-integrity", uniqueid);

                    var item: string | number | boolean | symbol | object;
                    var key = t.getIDName().toString();
                    var type = $(this).attr("type");
                    // begin restoration
                    if (key) {
                        // checkbox input button
                        if (type === "checkbox") {
                            item = JSON.parse(localStorage.getItem(key));
                            if (item === null) {
                                return;
                            }
                            $(this).prop("checked", item);
                            return;
                        }
                        // radio input button
                        else if (type === "radio") {
                            item = localStorage.getItem(key) === "on";
                            $(this).prop("checked", item);
                            return;
                        }
                        // input text number, textarea, or select
                        else {
                            item = localStorage.getItem(key);

                            if (item === null || !item.toString().length) {
                                return;
                            }
                            $(this).val(item);
                        }
                        //console.log('load', type, key, item);
                    }
                };

                $.arrive = function (target, callback) {
                    if (target) {
                        $(target).bind("DOMNodeInserted", callback);
                    } else {
                        if (typeof callback == "function") {
                            $(document).bind("DOMNodeInserted", callback);
                        } else if (typeof target == "function") {
                            $(document).bind("DOMNodeInserted", target);
                        }
                    }
                };

                // bind to new elements
                $(document).bind("DOMNodeInserted", function () {
                    var t = $(this);
                    var val = localStorage.getItem(t.getIDName().toString());
                    var tag = t.prop("tagName");
                    var allowed = !t.attr("no-save") && t.attr("formsaver-integrity") && typeof tag != "undefined";

                    if (allowed && val) {
                        //console.log(tag, allowed && val);
                        switch (t.prop("tagName")) {
                            case "SELECT":
                            case "INPUT":
                            case "TEXTAREA":
                                t.val(val);
                                break;
                        }
                    }
                });

                // detach from removed elements
                $(document).bind("DOMNodeRemoved", function () {
                    var t = $(this);
                    var allowed = !t.attr("no-save") && t.attr("formsaver-integrity");
                    if (allowed) {
                        switch (t.prop("tagName")) {
                            case "SELECT":
                            case "INPUT":
                            case "TEXTAREA":
                                t.off("change");
                                break;
                        }
                    }
                });

                //save value to localstorage
                $(document).on("change", "select, input, textarea", function (e) {
                    var t = $(this);
                    var key = t.getIDName().toString();
                    var item = t.val();
                    var allowed = !t.attr("no-save") && t.attr("formsaver-integrity");
                    if (key && item !== "" && allowed) {
                        if (t.attr("type") == "checkbox") {
                            localStorage.setItem(key, t.is(":checked").toString());
                            console.log("save checkbox button ", $(this).offset());
                            return;
                        }
                        if (t.attr("type") == "radio" && t.attr("id")) {
                            $('[name="' + t.attr("name") + '"]').each(function (i, e) {
                                localStorage.setItem($(this).getIDName().toString(), "off");
                            });
                            setTimeout(() => {
                                localStorage.setItem(key, item.toString());
                                console.log("save radio button ", $(this).offset());
                            }, 500);
                            return;
                        }
                        localStorage.setItem(key, item.toString());
                        //console.log('save', key, localStorage.getItem(key));
                    }
                });

                $(document).on("focus", "input,textarea,select", function () {
                    var t = $(this);
                    t.getIDName();
                    var aria = t.attr("formsaver-integrity");
                    if (aria && aria != uniqueid) {
                        t.smartForm();
                        t.attr("formsaver-integrity", uniqueid);
                    }
                });
            })(jQuery);
        }
    })();
}