We followed this tutorial -> https://www.danklco.com/posts/2013/06/changing-cq-components-design-path.html to create a global design path solution for multiple components to share design which works perfect for classic UI design dialog.
public class GlobalDesignDialogTag extends BaseTag
{
/**
* Global design properties attribute name.
*/
public static final String GLOBAL_DESIGN_PROPERTIES_ATTRIBUTE_NAME = "globalDesignProperties";
private static final long serialVersionUID = 1L;
@Override public final int doEndTag()
{
final String
globalDesignPath =
getCurrentDesign().getPath() + "/" + JCR_CONTENT + "/" + getCurrentResource().getName();
EditContext editContext = getEditContext();
String currentDesignPath = getCurrentDesign().getPath() + "/jcr:content/default-page/par-main/secondary-nav";
if (WCMMode.fromRequest(getSlingRequest()) == WCMMode.DESIGN)
{
// Set the design dialog content path to be global design level instead of template
editContext.setContentPath(globalDesignPath);
}
if (AuthoringUIMode.fromRequest(getSlingRequest()).equals(AuthoringUIMode.TOUCH)) {
editContext.setContentPath(globalDesignPath);
}
final Resource globalDesignResource = getResourceResolver().getResource(globalDesignPath);
if (globalDesignResource != null)
{
// Set an attribute containing global design properties as ${currentStyle.propertyName} will still
// point to the default design dialog path under the template.
pageContext.setAttribute(GLOBAL_DESIGN_PROPERTIES_ATTRIBUTE_NAME,
globalDesignResource.adaptTo(ValueMap.class));
}
return EVAL_PAGE;
}
/**
* Gets the EditContext from the pageContext.
*
* @return The EditContext from the pageContext.
*/
private EditContext getEditContext()
{
return (EditContext) pageContext.getAttribute(DefineObjectsTag.DEFAULT_EDIT_CONTEXT_NAME);
}
/**
* Gets the current design from the pageContext.
*
* @return The current design from the pageContent.
*/
private Design getCurrentDesign()
{
if (pageContext.getAttribute(DefineObjectsTag.DEFAULT_CURRENT_DESIGN_NAME) != null)
{
return (Design) pageContext.getAttribute(DefineObjectsTag.DEFAULT_CURRENT_DESIGN_NAME);
}
return getCurrentResource().adaptTo(Design.class);
}
}
Now We need to to upgrade classic UI to touch UI which involves lots components upgrade, but we still wish to keep most core java code unchanged or as less change as possible.
But the above tutorial method editContext.setContentPath(globalDesignPath);
does not work with touch UI design dialog it seems...
Please see below image illustration
So what happened with the pink lines , in classic UI design dialog are expected behaviour, using editContext.setContentPath(globel)
it does save the design dialog secondary-nav node in the design template level.
But with the green lines, using the same code example above, triggled design dialog save from touch UI, editContext.setContentPath(globel)
it does not look like did anything ... it saved node under demo-site/jcr:content/default-page/par-main/secondary-nav
which is the page template level of design ... other secondary-nav component in different page design template will not able to access the properties.
Ideally, the touch UI design dialog should do what blue lines does... by saving the dialog, it should updated the demo-site/jcr:content/secondary-nav
node property
After investigation, I think the most suspicious line is editContext.setContentPath(globel)
, is it in touch UI, it has a new kinda of (EditContext)
object or API to save touch UI design dialog into the customized path?
Please suggest with code sample if possible.
Thanks