In Techno

New UI development framework from Alfresco

People involved in the Alfresco community are familiar with the new UI development framework from Alfresco, called Aikau. This new framework need to fulfil its promise to make the UI development in Alfresco Share easier and be more tolerant to future upgrades and code changes. Aikau is not completely build from scratch. Aikau makes use of the Dojo JavaScript toolkit and the Spring Surf MVC model. Important to note is that Aikau is not tied to one specific JavaScript framework. Alfresco Share is using YUI framework but it does not mean that you cannot use jQuery.

The core of Dojo consist of dojo-widgets and also Aikau makes use of this concept. These widgets (or components) can be wired (or hooked) together via events. Here is an example of how you can wire to an existing event:

var fctSearchRes = widgetUtils.findObject(model.jsonModel, "id", "FCTSRCH_SEARCH_RESULT");
fctSearchRes.config.widgetsBelow = [ {
    name : "alfresco/renderers/Property",
    config : {
        propertyToRender : "mimetype"

Basically, with Aikau you can develop you own interface from scratch in which you are building complete new pages. The other option is to build modules on top of Alfresco Share with the use of the extension mechanism in Surf. If you build on top of Alfresco Share you need to beware that the widget you are implementing is depending of the context. The above sample code wires into the faceted result page and provides the mimetype field.

Let’s say you want to show the tags on the result page. There are some existing tag renders you can select from, which are alfresco/renderers/Tags or alfresco/renderers/ReadOnlyTag. Replacing the widget with a tag renderer will unfortunately not solve it. Although the JSON that is used to build the search result page provides the tag metadata field.

In this specific example you need to be careful of the context in which you want to place a widget. The tags renderer requires a different JSON structure that only exists within the document library context. For this reason, the gray UI element in which the tags are displayed is not available on the faceted search page. To display the tags in a similar way as done within the document library requires more customization then only wiring a widget with some additional configurations. This makes the Aikau framework less easy than one had expected.

  • Rick de Rooij
    Rick de Rooij Digital Transformation Consultant
Recent Posts

Start typing and press Enter to search