CQ5/AEM6/Sightly - Return custom type from Java Use-Api - aem

Question

Using JavaScript Use-Api I am able to create a custom object and return it to a html file. This feature allows me to create a list of custom objects, which can be used to create a menu or other complex list-like component.
Let's assume that I have following content structure:
/content
/project
/homepage
/contentpage1
/contentpage1.1
/contentpage1.2
/contentpage1.3 (hidden)
/contentpage2
/contentpage1.1 (hidden)
/contentpage1.2 (hidden)
/contentpage1.3 (hidden)
/contentpage3
/contentpage4
Menu should contains only first-level contentpages. Each menu item should have dropdown list with second-level contentpages, if they exist and are not hidden. I can do it in JavaScript with the following code:
"use strict";
use(function() {
function getMenuItems() {
var currentPageDepth = currentPage.getDepth();
var menuObjects = [];
if(currentPageDepth >= 3) {
var homePage = currentPage.getAbsoluteParent(2);
var list = homePage.listChildren();
while(list.hasNext()) {
var tempPage = list.next()
var customPageObject = createMenuItemObject(tempPage);
menuObjects.push(customPageObject);
}
}
return menuObjects;
}
function createMenuItemObject(page) {
// ...
// looking for any other properties of page or its children
// ...
return {page: page,
visibleChildrenExists: visibleChildrenExists(page)};
}
function visibleChildrenExists(page) {
var list = page.listChildren();
var visibleChildrenExists = false;
while(list.hasNext()) {
var subPage = list.next();
if(!subPage.isHideInNav()) {
visibleChildrenExists = true;
break;
}
}
return visibleChildrenExists;
}
return {
menuObjectsList: getMenuItems(),
};
}
HTML:
<headerComponent data-sly-use.headerComponentJS="headerComponent.js" data-sly-unwrap />
<menuItems data-sly-list.menuItem="${headerComponentJS.menuObjectsList}" data-sly-unwrap >
<li class='${menuItem.visibleChildrenExists ? "" : "direct"}' data-sly-test="${!menuItem.page.hideInNav}">
${menuItem.page.title}
<ul data-sly-test="${menuItem.visibleChildrenExists}" data-sly-list.submenuItem="${menuItem.page.listChildren}">
<li data-sly-test="${!submenuItem.hideInNav}">
${submenuItem.title}
</li>
</ul>
</li>
</menuItems>
Why do I want to use Java Use-Api? It's easier to operate on interfaces like Resource or Node. It looks like it does not work pretty well in JavaScript, but I need to have possibility to return custom objects with multiple properties.
The question is: is it even possible to do something similar using Java Use-Api? What do I have to return? I can't return a map, because it won't be possible to access its elements since it's not possible to pass a parameter to Java Use-Api method... Any suggestion?

Answer 1

It is possible to return maps using the java-use api see an example below:
Method in the Java class
//Return a map
public Map<String, String> getTestMap() {
//TODO some coding
Map<String,String> testMap = new HasMap<String,String>();
testMap.put("IDA", "test value");
testMap.put("IDB", "test value 2");
return testMap;
}
HTML code to access each element of the map:
<div data-sly-use.param="JavaClass">
<div data-sly-test.map="${param.testMap}">
<div class="pos">
<span class="classA">${map['IDA']}</span><br>
<span class="classB">${map['IDB']}</span>
</div>
</div>
</div>