I am developing a simple breadcrumb component as my first Sightly component. I am really liking it. Even moving from a component perviously built JSTL component, the presentation code has gone from 46 lines to 8 lines.
I am extending WCMUse for the model logic e.g to build a list of trail items (pages).
I have a small requirement to show the trail title based on if specific properties exist e.g. navigation title, then page title, then page name.
I could approach this in two ways:
1. Return a list of pages (com.day.cq.wcm.api.Page) from the model (Java class) and use the view logic (JavaScript) to show one of the three properties.
breadcrumb-trail.js
trail.title = this.page.navigationTitle || this.page.title || this.page.name;
2. Let the model (Java class) create a trail item model that exposes a title property containing the logic to show navigation title, page title or name.
BreadcrumbTrailItem.java
public String getTitle() { if (StringUtils.IsNotEmpty(trailPage.getNavigationTitle())) { return trailPage.getNavigationTitle(); } else if (StringUtils.IsNotEmpty(trailPage.getTitle()) { return trailPage.getTitle(); } else { return trailPage.getName() } }
Solved! Go to Solution.
Views
Replies
Total Likes
To me in this case the Javascript is not really needed here.
And to avoid logic in too many places, you can create a data-sly-template that is used in many places, this then holds the logic to print the write name.
<template data-sly-template.pageTitle="${ @ page }>
<div>${ page.navigationTitle || page.title || page.name }</div>
</template>
Then you can call this via <li data-sly-call="${ pageTitle @ page = item.page}"></li>
Hope this helps.
Views
Replies
Total Likes
why not in just one expression?
${ yourvar.page.navigationTitle || yourvar.page.title || yourvar.page.name }
Views
Replies
Total Likes
Thanks Feike,
I wanted to avoid having logic in too many difference places in addition to the JavaScript and Java models. I guess I could remove the JavaScript file all together.
Is it normal to use a Java class model and a JavaScript model together, or should only one used of the other?
Views
Replies
Total Likes
To me in this case the Javascript is not really needed here.
And to avoid logic in too many places, you can create a data-sly-template that is used in many places, this then holds the logic to print the write name.
<template data-sly-template.pageTitle="${ @ page }>
<div>${ page.navigationTitle || page.title || page.name }</div>
</template>
Then you can call this via <li data-sly-call="${ pageTitle @ page = item.page}"></li>
Hope this helps.
Views
Replies
Total Likes
Views
Likes
Replies
Views
Likes
Replies
Views
Likes
Replies