AEM 64 - Touch UI show Project specific Workflow Models in Assets Toolbar Create action

Goal

Show project specific workflow models in the dialog activated by Create -> Workflow action of Assets toolbar. Tee full list of workflows (Product and Project) are still available from Timeline -> Start workflow dropdown

Demo | Package Install | Github


Assets Toolbar Start Workflow



Timeline Start Workflow (Product)

Solution

1) Login to CRXDE Lite, create folder (nt:folder) /apps/eaem-touchui-show-custom-wfs-in-start-wf

2) Create clientlib (type cq:ClientLibraryFolder) /apps/eaem-touchui-show-custom-wfs-in-start-wf/clientlib and set property categories of String type to dam.gui.actions.coral and dependencies String[] to lodash

3) Create file ( type nt:file ) /apps/eaem-touchui-show-custom-wfs-in-start-wf/clientlib/js.txt, add the following

show-custom-wfs.js

4) Create file (type nt:file) /apps/eaem-touchui-show-custom-wfs-in-start-wf/clientlib/show-custom-wfs.js, add the following code. #3 with prefix value set to EAEM, the dropdown shows all models having name starting with EAEM

(function ($, $document) {
    var WORKFLOW_DIALOG_CLASS = "cq-common-admin-timeline-toolbar-actions-workflow",
        SHOW_MODELS_WITH_PREFIX = "EAEM";

    $document.on('foundation-contentloaded', handleWorkflowList);

    function handleWorkflowList(event){
        var $target = $(event.target);

        if(!$target.hasClass(WORKFLOW_DIALOG_CLASS)){
            return;
        }

        var $wfSelect = $target.find("coral-select");

        if(_.isEmpty($wfSelect)){
            return;
        }

        _.each($wfSelect[0].items.getAll(), function(item){
            if(canShow(item.innerText)){
                return;
            }

            item.remove();
        })
    }

    function canShow(text){
        if(_.isEmpty(text)){
            return true;
        }

        return (text.trim().indexOf(SHOW_MODELS_WITH_PREFIX) == 0);
    }
}(jQuery, jQuery(document), Granite.author));