## @param title:title=Expand Title|type=string|required=false|desc=Title for the text to expand|default=Click here to expand...
##
## Check for a blank first parameter
##
#if ($paramtitle && $paramtitle.length() > 0)
#set ($expandtitle = $paramtitle)
#elseif ($param0 && $param0.length() > 0)
#set ($expandtitle = $param0)
#else
#set ($expandtitle = "Click here to expand...")
#end
#set ($toggleId = $action.random)
#set ($imagePath = "${bootstrap.webAppContextPath}/images/icons")
#set ($imageRight = "$imagePath/arrow_right.png")
#set ($imageDown = "$imagePath/arrow_down.png")
##
## Toggle body div and icon when expander clicked or the user hits enter.
##
<script type="text/javascript">
new Image().src = "$imageDown";
function expandmacroExpand(eventee,clickee) {
var expander = jQuery(clickee),
expanderImage = jQuery(".expand-control-image", expander),
expanderContent = expander.next(),
e = eventee;
if (e.type == "mouseup" || (e.type == "keyup" && e.keyCode == 13)) {
if (!expander.hasClass("on")) {
expanderImage.attr("src", "$imageDown").attr("alt", "Open");
expanderContent.fadeIn("fast").removeClass("expand-hidden");
expander.addClass("on");
} else {
expander.removeClass("on");
expanderContent.fadeOut("fast").addClass("expand-hidden");
expanderImage.attr("src", "$imageRight").attr("alt", "Closed");
}
};
};
</script>
<style type="text/css">
@media all {
.expand-content { margin-left: 20px; }
.expand-control-icon { display: inline-block; width: 20px; }
}
@media screen {
.expand-hidden { display: none; }
.expand-control { cursor: pointer; text-decoration: none; }
.expander-image, .expand-control-text { vertical-align: middle; text-decoration:none; }
}
@media print {
.expand-content { display: block !important; }
}
</style>
##
## Display
##
<div id="expander-$toggleId" class="expand-control" onmouseup="expandmacroExpand(event,this)" onkeyup="expandmacroExpand(event,this)" tabindex="0"><span class="expand-control-icon"><img class="expand-control-image" src="$imageRight"></span><span class="expand-control-text">$generalUtil.htmlEncode($expandtitle)</span></div>
<div class="expand-content expand-hidden">$!body</div>
The updated
{expand}macro code is available on CAC.
HTML export is tracked in
CONF-21315.