Adobe Experience Manager

Adobe Experience Manager

ANNOUNCEMENT: Service Pack 2 for Experience Manager 6.0 now available
  • -

Adobe Experience Manager (AEM) 6.0 Service Pack 2 (SP2) is now generally available.

It is recommended that all users of AEM 6.0 install SP2.

Some of the key highlights of the service pack include:

• The built-in repository (Apache Jackrabbit Oak) is updated to version 1.0.9. The update contains various performance improvements - particular around search and disk space usage.
• Numerous improvements to the Touch-optimized UI, based on customer feedback.
• Added support for JBoss Application Server 7.2 (EAP 6.1.0).

For more information about SP2, including download information, see the AEM 6.0 Service Pack 2 Release Notes.

February 04, 2015
Get information about html5smartimage
Tags: CQ
Jakolcz asked... 05:17 AM | August 21, 2013

I'm creating component with html5smartimage and few fields for aditional info. How can I get information(especially URL) about the image? I know how to access pathfield/textfield info but I don't know how to get html5smartimage info.
This is my html5smartimage

Thanks for any help.

Solved

03:43 AM

OK, I finally solved this... It was so simple that I should slap myself... The solution is this

String imgPath = properties.get("imageReference", "");

Thank all of you guys for trying to help me.

Answers

05:38 AM

Have you checked the widget api ? There you can search for the class: Class CQ.html5.form.SmartImage

http://dev.day.com/docs/en/cq/5-6/widgets-api/output/CQ.html5.form.SmartImage.html


Theres quite a lot of info about it there if it is info about the xtype you are looking for.
Regards
Johan

06:04 AM

Thanks for the response. But how can I work with this class? I've tried to use it in my component code but it doesn't work...

<%
CQ.html5.form.SmartImage image = properties.get("image", "");
out.println("debug: "+image.getHeight());
%>

but I get this error

CQ.html5.form.SmartImage cannot be resolved to a type

How should I use it?

08:51 AM

Ah ok, didnt really understand what you wanted to do.

Take a look at this. They are using a smartimage xtype for the logo example there:
http://dev.day.com/docs/en/cq/current/howto/website.html

 

<%@include file="/libs/foundation/global.jsp"%><%
%><%@ page import="com.day.text.Text,
                   com.day.cq.wcm.foundation.Image,
                   com.day.cq.commons.Doctype" %><%
    /* obtain the path for home */
    long absParent = currentStyle.get("absParent", 2L);
    String home = Text.getAbsoluteParent(currentPage.getPath(), (int) absParent);
    /* obtain the image */
    Resource res = currentStyle.getDefiningResource("imageReference");
    if (res == null) {
        res = currentStyle.getDefiningResource("image");
    }
    /* if no image use text link, otherwise draw the image */
    %>
<a href="<%= home %>.html"><%
    if (res == null) {
        %>Home<%
    } else {
        Image img = new Image(res);
        img.setItemName(Image.NN_FILE, "image");
        img.setItemName(Image.PN_REFERENCE, "imageReference");
        img.setSelector("img");
        img.setDoctype(Doctype.fromRequest(request));
        img.setAlt("Home");
        img.draw(out);
    }
    %></a>

As you can see they have only used some of the different methods that the Image class have here.
For a full list of what to do with it you can take a look at:

http://dev.day.com/docs/en/cq/current/javadoc/com/day/cq/wcm/foundation/Image.html

/Johan

08:41 AM

We can get Image info using

(1) properties.get("image/fileReference","");

(2) Image image = new Image(resource);

image.getFileReference();

check for more com.day.cq.wcm.foundation.Image

 

Note:

  1. CQ.html5.form.SmartImage image = properties.get("image", ""); -- you are not allowed to use widgets API as Java code

​you can use listeners and properties to get value using JS 

09:59 AM

The Adaptive Image component is similar... some hints about how it works is here:

http://dev.day.com/docs/en/cq/current/developing/mobile/responsive.html#Understanding%20the%20Adaptive%20Image%20Component%20Servlet

 

scott

03:04 AM

Ojjis wrote...

Ah ok, didnt really understand what you wanted to do.

Take a look at this. They are using a smartimage xtype for the logo example there:
http://dev.day.com/docs/en/cq/current/howto/website.html

 


 
  1. <%@include file="/libs/foundation/global.jsp"%><%
  2. %><%@ page import="com.day.text.Text,
  3. com.day.cq.wcm.foundation.Image,
  4. com.day.cq.commons.Doctype" %><%
  5. /* obtain the path for home */
  6. long absParent = currentStyle.get("absParent", 2L);
  7. String home = Text.getAbsoluteParent(currentPage.getPath(), (int) absParent);
  8. /* obtain the image */
  9. Resource res = currentStyle.getDefiningResource("imageReference");
  10. if (res == null) {
  11. res = currentStyle.getDefiningResource("image");
  12. }
  13. /* if no image use text link, otherwise draw the image */
  14. %>
  15. <a href="<%= home %>.html"><%
  16. if (res == null) {
  17. %>Home<%
  18. } else {
  19. Image img = new Image(res);
  20. img.setItemName(Image.NN_FILE, "image");
  21. img.setItemName(Image.PN_REFERENCE, "imageReference");
  22. img.setSelector("img");
  23. img.setDoctype(Doctype.fromRequest(request));
  24. img.setAlt("Home");
  25. img.draw(out);
  26. }
  27. %></a>

As you can see they have only used some of the different methods that the Image class have here.
For a full list of what to do with it you can take a look at:

http://dev.day.com/docs/en/cq/current/javadoc/com/day/cq/wcm/foundation/Image.html

/Johan

 

Thank you! But now I have much simplier problem... I can't get the Resource. I'm trying to do it like this
 

<%
String propImage = properties.get("image/imageReference", "error");
out.println("propImage: "+propImage); //prints "error"
Resource rsrc = resourceResolver.getResource(propImage);
Resource res = currentStyle.getDefiningResource("imageReference");
if(rsrc != null)
    log.info("rsrc: "+rsrc.getPath());
else
    log.info("rsrc = null");    //this is in log
if(res != null)
    log.info("res "+res.getPath());
else
    log.info("res = null");     //this in log
%>

I have my html5smartimage set just like it's shown here: http://dev.day.com/docs/en/cq/current/howto/website.html which means

04:37 AM

Ok. Here is how you can get it, This is purely based on the standard image component and it's jsp from CQ in which you use the settings:

<%
Image image = new Image(resource);
image.addCssClass(DropTarget.CSS_CLASS_PREFIX + "image");
image.loadStyleData(currentStyle);
image.setSelector(".img"); // use image script
image.setDoctype(Doctype.fromRequest(request));
if (!currentDesign.equals(resourceDesign)) {
    image.setSuffix(currentDesign.getId());
}

//Then you can get the path of the actual image like this
//results in eg. /content/dam/mystuff/Images/mypicture.jpg
String imagePath = (String) image.getFileReference();

%>

The image.getFileReference method is inherited from com.day.cq.commons.DownloadResource which has loads of other methods as well if you want to get more info about the image/file. Just browse through the documentation

Good luck :)