import { ApiService } from "../util/apiService.js";

ko.components.register('ko-autocomplete', {
    viewModel: function (params) {
        var self = this;
        self.type = params.type;
        self.template = "none";
        self.controlName = ko.observable(params.name);
        self.parentForm = params.parent;
        self.params = params;
        self.getData = function (term) {
            var model = {
                searchKey: term
            };
            if (_h.isNullOrEmpty(term) || term === "") {
                self.list.removeAll();
                return;
            }
            ApiService.request(
                {
                    url: "/api/dynamicdocument/getaccountcodeautocomplete",
                    data: model,
                    success: function (data) {
                        self.list.removeAll();
                        if (_h.any(data)) {
                            for (var i = 0; i < data.length; i++) {
                                if (self.selectedItems().length > 0) {
                                    var val = data[i].value;
                                    var result = self.selectedItems().filter(function (obj) {
                                        return obj.value === val;
                                    })[0];
                                    if (_h.isNullOrEmpty(result))
                                        self.list.push(data[i]);
                                } else {
                                    self.list.push(data[i]);
                                }
                            }
                            self.showMenu(true);
                        } else {
                            self.showMenu(false);
                        }
                    },
                    error: function (data) {
                    }
                });
        };
        self.showMenu = ko.observable(false);
        if (ko.isObservable(params.value)) {
            self.value = params.value;
        }
        else {
            self.value = ko.observable(params.value);
        }
        self.selectedItems = ko.observableArray();
        if (params["values"] && params.values().length > 0) {
            for (var j = 0; j < params.values().length; j++) {
                self.selectedItems.push(params.values()[j]);
            }
        }
        self.list = ko.observableArray();
        self.placeHolder = _h.getLocalizedText("codePlaceholder");
        self.toggleFocus = function (model, e) {
            if (self.parentForm["setActiveFocus"]) {
                var name = $(e.currentTarget).attr("name");
                self.parentForm.setActiveFocus(name);
            }
        };
        self.removeSelectedItem = function (item) {
            self.selectedItems.remove(item);
            self.list.unshift(item);
            self.value(undefined);
            self.parentForm
                .onSelectAutocomplete(self.controlName(), self.selectedItems());

        }
        self.onDblClick = function () {
            if (self.list().length > 0) {
                self.showMenu(!self.showMenu());
            }
            if (self.list().length === 0) {
                self.showMenu(false);
            }
        };
        self.onKeypress = function (model, evt) {
            var charCode = (evt.which) ? evt.which : evt.keyCode;
            if (charCode === 13) {
                setTimeout(
                    function () {
                        self.getData(self.value());
                    },
                    100);
            } else {
                if (self.type !== "multi") {
                    if (!$(evt.target).val()) {
                        self.parentForm
                            .onSelectAutocomplete(self.controlName(), undefined);
                    }
                } else {
                    if ($(evt.target).val() && $(evt.target).val().length > 1) {
                        $(evt.target).css("width", (($(evt.target).val().length * 7) + 4) + "px");
                    }
                    else if ($(evt.target).val() && $(evt.target).val().length === 1) {
                        $(evt.target).css("width", "20px");
                    } else if (!$(evt.target).val() && !self.value()) {
                        $(evt.target).css("width", "");
                    }
                }
            }
        };
        self.onSelectItem = function (item) {
            switch (self.type) {
                case "multi":
                    self.selectedItems.push(item);
                    self.value(undefined);
                    self.parentForm
                        .onSelectAutocomplete(self.controlName(), self.selectedItems());
                    break;
                default:
                    self.value(item.text);
                    self.parentForm
                        .onSelectAutocomplete(self.controlName(), item.value, item);
                    self.showMenu(false);
                    if (self.parentForm.resetAfterSelect)
                        self.value(undefined);
                    break;
            }
            self.list.remove(item);
        };
        self.onInputFocus = function (x, e) {
            var input = $(e.target).find(".autocom-textbox");
            if (input)
                $(input).focus();
        }
    },
    template: "<!-- ko template: { name: 'autocomplete-component-t' } --><!-- /ko -->"
});

