A lot of development has been going on lately on updating the UI framework for Alfresco Share and it has been named as the Aikau. The concept of Aikau lies in the fact that it is totally reliant on Surf. So let’s explore and see what Aikau is in depth.
What is Aikau?
Aikau is basically a method of creating new Surf pages or components that are comprised of atomic widgets. Now the widgets over here are referenced in a JSON model that can be either defined as a document in the Alfresco repository or in the JavaScript controller of a WebScript. The widget so available is an AMD module that makes reference to its own HTML and CSS and the i18n resources. Surf will make sure that all the available resources, when referenced by the widget, are imported into the page loaded by the browser in the JSON model.
The widgets are decoupled on the subscription communication as well as on the event frameworks such that the widgets can be configured that is added or removed in a lucid fashion at any moment within the JSON model. It allows easy configurations and at the same time it takes care that there are no missing reference errors. The widgets are designed with the sole purpose of implementing a single piece of function and at the same time be capable enough to define the JSON models of the child widgets ensuring reusability.
Aikau Goals:
Aikau basically aims at providing a library of widgets that can assemble with ease in the web application for accessing the Alfresco repository. It has nothing to do with the replacement of Share but it suffices to the need to drift away from its original implementation based on Surf paradigms of pages, web scripts towards a more easily configurable and reusable solution catering to rapid development.
Aikau is primarily based on Dojo library and the main goals of Aikau are listed as below:
- 1. To provide perfectly fine-grained widgets that encapsulate all the functions, behavior and styling.
- 2. Make the unit testing of the widgets simple and ease across all the browsers.
- 3. Diminish the complexity of the pages that were built around Surf by eliminating Page, template, and component configurations and replacing the same with JSON model in the JavaScript controller of a single web page.
- 4. Ability to build pages dynamically both for and within the running UI and render the same without the need to restart the server.
- 5. To give a solid foundation on which customers and business partners can build their own solutions.
How does Aikau work?
Aikau is powered by Surf and it uses the Dojo AMD loader and the widget templating abilities to give a foundation for dynamic dependency analysis. Each and every JSON model is thoroughly analyzed for AMD modules and then further these modules are analyzed for the modules dependent on them. This process is repeated until a smooth dependency layer has been build for that page. To minimize the amount of analysis and multiply the performance level the surf caches module dependency relationships and page dependencies ensure each and every segment.
Aikau Concepts:
The main concepts are:
- Modules
- Pub/Sub
- Services
Modules
Aikau uses the concept of decomposing the solution into small and reusable components referred to as widgets. It is completely functionally independent so that it can be easily tested as a single atomic unit (since it is highly essential). You can define a widget as a black box and write tests to check how it behaves after certain configurations. You need not write the full integration tests. So you need to be crystal clear of the dependencies while declaring it during the creation of Aikau widget.
A simple example is as follow:
define(['dojo/_base/declare',
'dijit/_WidgetBase',
'dijit/_TemplatedMixin',
'dojo/text!./templates/MyWidget.html',
'alfresco/core/Core'],
function(declare, _WidgetBase, _TemplatedMixin, template, AlfCore) {
return declare([_WidgetBase, _TemplatedMixin, AlfCore], {
i18nRequirements: [{i18nFile: './i18n/MyWidget.properties'}],
cssRequirements: [{cssFile:'./css/MyWidget.css'}],
templateString: template,
postCreate: function() {
// TODO Put your code here
}
});
});
The entire code (any JavaScript you want) have to go into the postCreate function.
The define function instructs the AMD loader what modules to load, the declare function creates the JavaScript class and the postCreate functions are called when an instance of the class is created.
To make it possible for a page to be easily customized it is necessary for the widgets to be completely decoupled from each other and here enters the concept of publication/subscription model.
Publication/Subscription
Without a pinch of doubt, it would be much easier to implement a solution which holds fixed references between the widgets. But the same scenario will complicate and put a constraint what a third party could do to a certain page.
Aikau widgets communicate with each other using the pub/sub model i.e by publishing requests on topics and then subscribing and responding to the requests that has been published. To constrain the communication between subset of widgets it is possible to define a scope. This allows a single group of widgets that share a common topic to communicate with one another without bearing an impact another group.
A pub/sub-scope is defined on a widget by setting the “pubSubScope” attribute to a string value. This same value is prefixed on all the published topics and only the prefixed topics with that value are subscribed to. The “pubSubScope” attribute has attributes passed from the parent to the child widget and the child widget will have the same scope unless specially configured.
I've consolidated Aikau education references into a single Wiki page: https://t.co/5wfsbr2d9I #alfresco
— Dave Draper (@_DaveDraper) May 27, 2016
Services
The widgets are also decoupled from data, hence it allows a widget to work with multiple data sources. And all the data should be accessed via a service. Services in Aikau can be viewed as a glue that helps in binding the page together. The services can cater to myriad roles as well as handling XHR requests. The “alfresco/services/DialogService” is used for creation and management of modal dialogs. Another vital role of service is to make asynchronous (XHR) requests to access data from the Alfresco Repository. The widget will publish a request for some data on a topic and if a service exists for the same it will subscribe and the data will be retrieved from the Alfresco repository and return it to the widget.
On an ending note, I would like to emphasize that Aikau is just a way to pack HTML, CSS, and JavaScript into reusable modules. It is not a new critical language but a new concept of carrying out web development with several advantages like extensibility, reuse, customization and a lot more. So explore Aikau and find out what more is in the store that could benefit you.
Reference: Alfresco Community, Alfresco Docs
Pratyush Kumar
