Hello All,
I am trying to replicate similar functionality (notification Popup) as in Facebook. I have made one Vaadin portlet which have recent Alerts and Activities post on that from our site. I want to show this portlet into popup dialog box for which I have place a button on the dock bar, clicking on this button will display pop up with small dialogue box just below it. To make it work I have created a hook and modified the dockbar jsp and I have also modified dockbar.js, I have added new object into dockbar.js, please have a look at the below code. I am using Alloy UI plugin to make Ajax request and get the portlet, very similar fashion how liferay gets the popup dialog when we click on Add → More.
I was able to get this popup working, if I embedded it any out of box Liferay portlet eg, Login portlet, My Communities, Current Users etc or any Portlet made up of only JSP. But when I try to call Vaadin portlet it does not work. Help me to know what I am doing wrong, Is it not possible to place Vaadin portlet out side body below the portal dock bar? When I call this portlet in the back end I can see the call made to render_portlet.jsp and it also makes call to vaadin portlet, but for some reasons it does not gets displayed into the dialogue box, the same portlet when deployed into body, it works fine
dockbar.js
var addNotification = A.one(‘#’ + instance._namespace + ‘addNotification’);
if (addNotification) {
addNotification.on(
‘click’,
function(event) {
Liferay.Dockbar.addContent.hide();
if (!Liferay.Dockbar.addNotification) {
var setAddNotificationUI = function(visible) {
var body = A.getBody();
body.toggleClass(‘lfr-has-sidebar’, visible);
};
instance.addUnderlay(
{
after: {
render: function(event) {
setAddNotificationUI(true);
}
},
className: ‘add-notification’,
io: {
after: {
success: Liferay.Dockbar._loadAddNotification
},
data: {
doAsUserId: themeDisplay.getDoAsUserIdEncoded(),
p_l_id: themeDisplay.getPlid(),
p_p_id: ‘Myportlet _INSTANCE_6Fq9’,
p_p_state: ‘exclusive’
},
uri: themeDisplay.getPathMain() + ‘/portal/render_portlet’
},
name: ‘addNotification’,
width: ‘255px’,
left: ‘148px’
}
);
Liferay.Dockbar.addNotification.after(
‘visibleChange’,
function(event) {
if (event.newVal) {
Liferay.Util.focusFormField(‘#layout_configuration_content’);
}
setAddNotificationUI(event.newVal);
}
);
}
else {
Liferay.Dockbar.addNotification.show();
}
Liferay.Dockbar.addNotification.focus();
}
);
}