I don’t know if you have seen the latest news, but Nuxeo is now a certified content source for Liferay. We usually talk a lot about CMIS in the ECM world, but there is also the OpenSocial alternative. It’s not doing the same thing at all, but it is definitely another nice way to integrate the two applications. Usually more widespread in the portal world, it’s available both in Liferay and Nuxeo. So today I’m going to show you how to create and share an OpenSocial gadget from Nuxeo into a Liferay portlet. Follow the guide below and/or just check out the video recording I did.
Creating the Gadget
If you are used to creating OpenSocial gadgets, this is a piece of cake. If not, we have a nice wizard for you in Nuxeo IDE. Let’s run the Automation Gadget Wizard. It gives you all the necessary code to add an OpenSocial gadget that will use the Content Automation API to communicate with Nuxeo.
If you open the JavaScript file, you’ll see that everything has been laid down for you. The sample is actually calling the Document.PageProvider operation with a bunch of predefined parameters like the number of documents per page, the query ran to get those documents, the properties you’d like to display, etc. So the first example that comes to my mind is a gadget that lists every document of a specific type that I defined in Studio. Let’s take the contract management template as example. It’s available in the Templates menu of Nuxeo Studio, along with a bunch of other cool templates. In this project there is a type of document called contract. I want to display all of them with their specific metadata in my gadget.
In that case all we need to do is to replace Document by Contract in the query parameter like this:
java "select * from Contract where ecm:mixinType != 'HiddenInNavigation'"
And modify the displayColumn:
javascript displayColumns: [ {type: 'builtin', field: 'icon'}, {type: 'builtin', field: 'titleWithLink', label: 'Title'}, {type: 'date', field: 'contract:sent_date', label: 'Sent Date'}, {type: 'text', field: 'contract:type', label: 'Type'} ],
And now I’ve done a custom OpenSocial gadget that fetches the documents I want and displays the metadata that I chose, with pagination. But why is it displaying this table? This code is in the XML file of your gadget. This file contains all the required XML metadata for your gadget a well as the HTML and JavaScript code constituting it. If you are familiar with gadget code, you might be surprised to see some tags like this:
[xhtml] <#include “default-documentlist-layout.ftl”/> [/xhtml]
This is because inside Nuxeo, we use a FreeMarker template with WebEngine to generate the content of the gadget. And why would we do that? There’s a bunch of reasons that you can find on the documentation, but to summarize, it brings better reusability, so you can easily share resources between gadgets. You also have access to a lot of useful variables, like the client and server URLs and the context path of Nuxeo Webapp.
Taking a look at default-documentlist-layout.ftl, you’ll see there is a div waiting to be filled in with the document list. This will occur during the callback of the content automation async request, thanks to the embedded JavaScripts default-automation-request.js and default-documentlist-display.js.
Now the good thing about OpenSocial is that, if developed properly with no local dependencies, your gadgets don’t have to stay in your application. They can go in other OpenSocial containers, like the Liferay Portal.
Sharing the Gadget with Liferay
Sharing a gadget from one app to another is a common requirement when dealing with OpenSocial stuff. Depending on which app you are working with, it can get fairly complicated. The good news is that it’s not so hard to share a gadget from Nuxeo to Liferay. We’ve already dealt with most of the OAuth part in Nuxeo. You just need to create a new consumer in the Admin center. The goal of this consumer is to share a secret between Liferay and Nuxeo so that one user can authenticate to Nuxeo from Liferay using a special key. Take a look at the screencast to get an idea on how to do it.
Notice that you don’t have to take care of the users. Everything is managed via OAuth. That makes it a bit simpler to use than CMIS, where you have to have the exact same users on both Liferay and Nuxeo. This is, of course, a no-brainer when you use a directory for your users and groups.
Going Deeper into the Gadget Code
What we did here was really simple. There are many other things you could do since you can call operation chains or simple operations from a gadget. And you should know that with the Nuxeo IDE, it’s dead easy to create new operations.