AEM 6560 - Sites Editor Asset Finder set Default Folder

Goal

Sites pages loaded for editing show the assets in /content/dam root by default. This post is for setting the path to a specific project folder...

Demo | Package Install | Github

Solution

1) Add a client library to add editor hook. Login to CRXDE Lite (http://localhost:4502/crx/de), create folder /apps/eaem-asset-finder-default-folder

2) Create node /apps/eaem-asset-finder-default-folder/clientlib of type cq:ClientLibraryFolder, add String[] property categories with value [cq.authoring.editor.hook.assetfinder], String[] property dependencies with value lodash.

3) Create file (nt:file) /apps/eaem-asset-finder-default-folder/clientlib/js.txt, add

                        default-folder.js

4) Create file (nt:file) /apps/eaem-asset-finder-default-folder/clientlib/default-folder.js, add the following code

(function ($, $document, author) {
    var self = {},
        IMAGES_FINDER = "Images",
        PATH_FIELD = "foundation-autocomplete[name='assetfilter_image_path']",
        DEFAULT_FOLDER = '/content/dam/we-retail';

    var searchPath = self.searchRoot,
        imageServlet = '/bin/wcm/contentfinder/asset/view.html',
        itemResourceType = 'cq/gui/components/authoring/assetfinder/asset';

    self.loadAssets = function (query, lowerLimit, upperLimit) {
        if(_.isEmpty(searchPath)){
            searchPath = DEFAULT_FOLDER;
            $(PATH_FIELD)[0]._input.value = DEFAULT_FOLDER;
        }

        var param = {
            '_dc': new Date().getTime(),
            'query': query.concat("order:\"-jcr:content/jcr:lastModified\" "),
            'mimeType': 'image',
            'itemResourceType': itemResourceType,
            'limit': lowerLimit + ".." + upperLimit,
            '_charset_': 'utf-8'
        };

        return $.ajax({
            type: 'GET',
            dataType: 'html',
            url: Granite.HTTP.externalize(imageServlet) + searchPath,
            data: param
        });
    };

    self.setSearchPath = function (spath) {
        searchPath = spath;
    };

    author.ui.assetFinder.register(IMAGES_FINDER, self);
}(jQuery, jQuery(document), Granite.author));