AEM 65 - Add Path Column to Assets Search Results

Goal

Add Path column to Assets search results console

Demo | Package Install | Github


Product

Extension

Solution

1) Login to CRXDE Lite (http://localhost:4502/crx/de), create folder /apps/eaem-add-path-column-in-search-results

2) Create node /apps/eaem-add-path-column-in-search-results/clientlib of type cq:ClientLibraryFolder, add String property categories with value cq.gui.common.admin.searchpanel, String[] property dependencies with value lodash

3) Create file (nt:file) /apps/eaem-add-path-column-in-search-results/clientlib/js.txt, add

                        add-path-column.js

4) Create file (nt:file) /apps/eaem-add-path-column-in-search-results/clientlib/add-path-column.js, add the following code

(function ($, $document) {
    var FOUNDATION_CONTENT_LOADED = "foundation-contentloaded",
        GRANITE_OMNI_SEARCH_RESULT = "#granite-omnisearch-result",
        EAEM_SEARCH_PATH_COLUMN = "eaem-search-path-column",
        EAEM_SEARCH_PATH_COLUMN_HEADER = "Path",
        ROW_SELECTOR = "tr.foundation-collection-item",
        GRANITE_OMNI_SEARCH_CONTENT = ".granite-omnisearch-content";

    $document.on(FOUNDATION_CONTENT_LOADED, GRANITE_OMNI_SEARCH_CONTENT, function(event){
        _.defer(function(){
            handleContentLoad(event);
        });
    });

    function handleContentLoad(event){
        var layout = $(GRANITE_OMNI_SEARCH_RESULT).data("foundationLayout");

        if(!layout || (layout.layoutId !== "list")){
            return;
        }

        addColumnHeaders();

        fillColumnData();
    }

    function fillColumnData(){
        var $fui = $(window).adaptTo("foundation-ui");

        $fui.wait();

        $(ROW_SELECTOR).each(function(index, item){
            itemHandler($(item) );
        });

        function itemHandler($row){
            if(!_.isEmpty($row.find("[" + EAEM_SEARCH_PATH_COLUMN + "]"))){
                return;
            }

            if(_.isEmpty($row.find("td.foundation-collection-item-title"))){
                return;
            }

            var itemPath = $row.data("foundation-collection-item-id");

            $row.find("td:last").before(getListCellHtml(itemPath));
        }

        $fui.clearWait();
    }

    function getListCellHtml(colValue){
        return '<td is="coral-table-cell" ' + EAEM_SEARCH_PATH_COLUMN + ' >' + colValue + '</td>';
    }

    function addColumnHeaders(){
        if(checkIFHeadersAdded()){
            return;
        }

        var $container = $(GRANITE_OMNI_SEARCH_CONTENT),
            $headRow = $container.find("thead > tr");

        $headRow.append(getTableHeader(EAEM_SEARCH_PATH_COLUMN_HEADER));
    }

    function getTableHeader(colText) {
        return '<th is="coral-table-headercell" ' + EAEM_SEARCH_PATH_COLUMN + ' >' + colText + '</th>';
    }

    function checkIFHeadersAdded(){
        return !_.isEmpty($(GRANITE_OMNI_SEARCH_CONTENT).find("tr").find("[" + EAEM_SEARCH_PATH_COLUMN + "]"));
    }
})(jQuery, jQuery(document));