Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

How Do You Provide the Version Difference Function for Images in Custom Components?

Avatar

Level 2

Currently using CQ5.5.  

I've been asked to provide the diff functionality that OOB components have using the "Diff" button in the Version/Restore tab within the CQ Sidekick.

I've been able to add this feature for the text portions of our components, by using the DiffInfo and DiffService classes provided in CQ.  This has been accomplished by copying code from /libs/mcm/components/newsletter/footer/footer.jsp and adapting it for my custom components.

The OOB (out-of-the-box) Image component seems to provide diffs correctly when an image is deleted by appending the URL parameter, "cq_diffType=REMOVED", on the image source, which places an "X" across the image.  The diff also works when an image is added--but I can't say it's actually very reliable.

My question is how do I provide this feature for an image within my component?  

I tried copying the code from /libs/foundation/components/mobiletextimage/mobiletextimage.jsp for diff'ing an image, but it doesn't  work.  Actually, it doesn't appear to work in the original mobiletextimage component, so it may not be in how my component is coded.

Is the OOB Image component using the DiffService and DiffInfo classes to get this feature, or is there some other interface which I can use?  When I tried using DiffService and DiffInfo, the DiffInfo.getType() function always returned the value, DiffInfo.TYPE.SAME.

Any pointers to code, examples, or better documentation for DiffService and DiffInfo will be appreciated.

1 Accepted Solution

Avatar

Correct answer by
Level 10
4 Replies

Avatar

Correct answer by
Level 10

Avatar

Level 2

Yes, I'm importing:

com.day.cq.commons.DiffInfo and com.day.cq.commons.DiffService

After thinking about this a bit, I could use the information I get back from the DiffInfo.getContent() to determine if I have a difference, but I'm hoping that the DiffInfo.getType() would be correct and there would be someway to get an Image object with the cq_diffType parameter set when I call Image.draw().

Avatar

Level 2

I'll post my solution to this question.  If anyone has a better solution, I'd appreciate hearing about it.  

In the custom component's JSP file:

Image img = new Image(resource, "image"); // Handle diff of images DiffInfo diffInfo = resource.adaptTo(DiffInfo.class); if ( diffInfo != null ) { // Get previous image Image diffImg = (diffInfo.getContent() == null ? null : new Image(diffInfo.getContent(), "image")); final String currentImg = (img != null && img.getHref() != null ? img.getHref() : ""); final String previousImg = (diffImg != null && diffImg.getHref() != null ? diffImg.getHref() : ""); // Determine how image changed if (currentImg.isEmpty()) { if (!previousImg.isEmpty()) { img = diffImg; img.addCssClass("imageRemoved"); } } else { if ( ! currentImg.equals(previousImg) ) { if ( previousImg.length() == 0 ) { img.addCssClass("imageAdded"); } else { img.addCssClass("imageChanged"); } } else if ( img.getLastModified().compareTo(diffImg.getLastModified()) !=  0 ) { img.addCssClass("imageChanged"); } } } if (img != null) { ... %><%img.draw(out);%></img><% ... }

Along with this code add some new rules to the CSS for img.imageRemoved, img.imageAdded, and img.imageChanged to decorate your image correctly.

Avatar

Level 4

Hi Friend,

Use this 

request.getParameter(DiffService.REQUEST_PARAM_DIFF_TO); to get diff version and append to image path when diffInfo is not null.this will help you.