vivespos-landing/modules/backend/widgets/table/assets/js/table.helper.search.js

/*
 * Search helper for the table widget.
 * Implements searching within the table.
 */
+function ($) { "use strict";

    // NAMESPACE CHECK
    // ============================

    if ($.wn.table === undefined)
        throw new Error("The $.wn.table namespace is not defined. Make sure that the table.js script is loaded.");

    if ($.wn.table.helper === undefined)
        $.wn.table.helper = {}

    // SEARCH CLASS DEFINITION
    // ============================

    var Search = function(tableObj) {
        // Reference to the table object
        this.tableObj = tableObj

        // The search form element
        this.searchForm = null
        this.searchInput = null

        // Timer used for tracking input changes
        this.inputTrackTimer = null

        // Event handlers

        // Active search query
        this.activeQuery = null

        this.isActive = false

        this.init()
    };

    Search.prototype.init = function() {
    }

    Search.prototype.dispose = function() {
        // Remove the reference to the table object
        this.tableObj = null
        this.searchForm = null
        this.searchInput = null
    }

    Search.prototype.buildSearchForm = function() {
        if (!this.searchEnabled())
            return

        var el = this.tableObj.getElement(),
            toolbar = this.tableObj.getToolbar(),
            searchForm = toolbar.querySelector('.table-search')

        if (!searchForm) {
            this.searchForm = $($('[data-table-toolbar-search]', el).html()).appendTo(toolbar).get(0)
            this.searchInput = $('.table-search-input', this.searchForm).get(0)
        }
    }

    Search.prototype.getQuery = function() {
        return $.trim(this.activeQuery)
    }

    Search.prototype.hasQuery = function() {
        return this.searchEnabled() && $.trim(this.activeQuery).length > 0
    }

    Search.prototype.searchEnabled = function() {
        return this.tableObj.options.searching
    }

    Search.prototype.getSearchableColumns = function() {
        const columns = [];

        this.tableObj.options.columns.forEach(function(column) {
            if (column.type === 'checkbox') {
                return;
            }

            if (!column.searchable) {
                return;
            }

            columns.push(column.key);
        });

        return columns;
    }

    Search.prototype.performSearch = function(query, onSuccess) {
        var isDirty = this.activeQuery != query

        this.activeQuery = query

        if (isDirty) {
            this.tableObj.updateDataTable(onSuccess)
        }
    }

    // EVENT HANDLERS
    // ============================

    Search.prototype.onKeydown = function(ev) {
        // The navigation object uses the table's keydown handler
        // and doesn't register own handler.

        // Tab pressed
        if (ev.key === 'Tab') {
            this.onClick(ev)
            return
        }

        if (!this.isActive) {
            return
        }

        var self = this
        this.inputTrackTimer = window.setTimeout(function() {
            self.performSearch(self.searchInput.value)
        }, 300)
    }

    Search.prototype.onClick = function(ev) {
        var target = this.tableObj.getEventTarget(ev, 'INPUT')
        this.isActive = target && $(target).hasClass('table-search-input')
    }

    $.wn.table.helper.search = Search;

}(window.jQuery);