Retrieve the list name in a display template

Retrieve list name via REST.js

Type.registerNamespace('search.listname');

search.listname = function () {
    var itemInfo = {};
    var listInfo = {};

    var init = function (context, elmId) {
        // Store item info
        itemInfo[elmId] = {};
        itemInfo[elmId]["webUrl"] = context.CurrentItem.SPWebURL;
        itemInfo[elmId]["listId"] = context.CurrentItem.ListID;

        // Add an on post render callback, this will be excuted when all the results are rendered
        AddPostRenderCallback(context, function() {
            get(elmId);
        });
    },
    get = function (elmId) {
    	// Retrieve the item information
        var webUrl = itemInfo[elmId].webUrl;
        var listId = itemInfo[elmId].listId;

        if ($isEmptyString(webUrl) || $isEmptyString(listId)) {
            return;
        }

        // Remove brackets from guid
        if (listId.indexOf("{") > 0) {
            listId = listId.substring(listId.indexOf('{') + 1, listId.indexOf('}'));
        }

        // Check if the list object exists, if it exists, an Ajax call is already initiated or performed
        if (typeof listInfo[listId] !== "undefined") {
            // Check if the list name is retrieved
            if (typeof listInfo[listId]["Title"] !== "undefined") {
                // Write the list name to the listname element on the page
                quickRender(elmId, listId);
            } else {
            	// List name was not yet retrieved, set the list ID as class on the element
                setClass(elmId, listId);
            }
            return;
        } else {
        	// Ajax call not yet initiated, create a new object for the list ID
            listInfo[listId] = {};
            setClass(elmId, listId);
        }

        // Do a Ajax call to retrieve the list / library title
        (function (elmId, listId) {
            var request = new XMLHttpRequest();
            var restUrl = String.format("{0}/_api/Web/Lists(guid'{1}')?$select=Title'", webUrl, listId);
            request.open('GET', restUrl, true);
            request.setRequestHeader('Accept', 'application/json;odata=nometadata');
            request.setRequestHeader('Content-Type', 'application/json;odata=nometadata');
            request.onload = function (e) {
                if (request.readyState === 4) {
                    // Check if the get call was successful
                    if (request.status === 200) {
                        // List retrieved
                        var data = JSON.parse(request.response);
                        if (typeof data.Title !== "undefined") {
                            if ($isEmptyString(data.Title)) {
                                return;
                            }
                            // Store the list name
                            listInfo[listId]["Title"] = data.Title;
                        } else if (typeof data.d !== "undefined") {
                            if (typeof data.d.Title !== "undefined") {
                                if ($isEmptyString(data.d.Title)) {
                                    return;
                                }
                                // Store the list name
                                listInfo[listId]["Title"] = data.d.Title;
                            }
                        } else {
                            return;
                        }
                        // Render the list name
                        render(elmId, listId);
                    } else {
                        // No list found
                    }
                }
            };
            request.onerror = function (e) {
                // Catching errors
            };
            request.send(null);
        })(elmId, listId);
    },
    // Set the list ID as class name to the SPAN element
    setClass = function (elmId, listId) { 
        var elm = document.getElementById(elmId);
        if (!$isNull(elm)) {
            var listElm = elm.getElementsByClassName('listname')[0];
            if (!$isNull(listElm)) {
                // Write the list name to the page
                listElm.className = String.format('{0} {1}',listElm.className, listId);
            }
        }
    },
    // Write the document title to all elements with the same list ID
    render = function (elmId, listId) {
        var elms = document.getElementsByClassName(listId);
        if (!$isNull(elms)) {
            for (var i = 0; i < elms.length; i++) {
                elms[i].innerHTML = listInfo[listId].Title;
            }
        }
    },
    // Write the list name to the element
    quickRender = function (elmId, listId) {
        var elm = document.getElementById(elmId);
        if (!$isNull(elm)) {
            var listElm = elm.getElementsByClassName('listname')[0];
            if (!$isNull(listElm)) {
                // Write the list name to the page
                listElm.innerHTML = listInfo[listId].Title;
            }
        }
    };

    return {
        init: init
    };
}();