Load image path from node | Community
Skip to main content
J
Jakolcz
Level 3
October 16, 2015
Solved

Load image path from node

  • October 16, 2015
  • 2 replies
  • 3658 views

Hi,
I have image component with uploaded image in it and I need to get path to that image so I can output it somewhere else.

For example: I have following node: "/content/myproject/mysite/mypage/mysubpage/jcr:content/imgcomp/file/jcr:content" and I need to output this image to <img> tag in my page. What should I do to add this functionality to my code?

String path = properties.get("pathToNodes", "");      //get path to nodes i want to work with if(path.length() == 0){ out.println("Enter path to nodes"); return; } try{ Node node = resourceResolver.adaptTo(Session.class).getNode(path); NodeIterator iterator = node.getNodes(); String currentPath = currentPage.getPath(); String[] titles = new String[PER_PAGE]; String[] intros = new String[PER_PAGE]; String[] images = new String[PER_PAGE]; String[] links = new String[PER_PAGE]; int i = 0; for(int j = 0; iterator.hasNext(); j++){ /* We want to print only the content of nodes on one page. So if we are not reading the nodes we want we just skip them */ if(i < (pageNum*PER_PAGE)-PER_PAGE){ iterator.nextNode(); continue; /* If we've already read all the nodes we want we can break the for */ }else if(i > pageNum*PER_PAGE){ break; } Node tmpNode = iterator.nextNode(); String tmpPath = tmpNode.getPath(); if(tmpPath.contains("jcr:content")) continue; if(tmpPath.contains(currentPath)){ continue; } tmpNode = tmpNode.getNode("jcr:content"); String[] splitted = tmpPath.split("/"); for(int k = 4; j k splitted.length; k++){ links[i]+= "/"+splitted[k]; } links[i]+=".html"; titles[i] = tmpNode.getNode("ctitle").getProperty("text").getString(); intros[i] = tmpNode.getNode("intro clr").getProperty("text").getString(); i++; } }catch(Exception e){ log.error("Error during articles output. "+e.getMessage()); }

 

Thanks for any help

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Best answer by Ojjis

    Hello, this is an example of how the normal cq way of drawing an image from an image component looks like.
    I do not really undestand how and where you would have you above code but once you have the right node you could utilize this functionality in this way:

     

    <% //First of we want to get the resource at the correct path.. this should be the path of the imagecomponent node Resource res = resourceResolver.getResource("path of the image node"); //Then we use the standard CQ image class to create a new image from this resource Image image = New Image(res); //These are the things that the default image component would add to an image image.addCssClass(DropTarget.CSS_CLASS_PREFIX + "image"); image.loadStyleData(currentStyle); image.setSelector(".img"); image.setDoctype(Doctype.fromRequest(request)); //... do more things if you want %> <%-- When you want to draw the image on the page later on --%> <div class="myimagediv"> <% //Here we utilize the draw method of image and draws the image to the page image.draw(out); %> </div>

     

    The thing is that if you wanted to have that code and use it in a jsp page I would strongly reccomend that you implement a custom tag for this, alternatively you own handling java class for this that you could use to skip all that logic on the jsp level. It could then be that you get the image nodes from your own created class via:
     

    //Simple example of a java class handling the logic... <% MyClass myClass = new Myclass(INIT PARAMETERS HERE); for(Image image : myClass.getImages()){ %> <div class="imageClass"> <%= image.draw(out) %> </div> <% } %>

    I hope this helped you some..
    More information would be avaliable on this page : http://dev.day.com/docs/v5_1/html-resources/cq5_howto_website/ch01s13.html

    where they explain how you create an image component in CQ/AEM.

    Regards
    /Johan

    2 replies

    Ojjis
    OjjisAccepted solution
    Level 7
    October 16, 2015

    Hello, this is an example of how the normal cq way of drawing an image from an image component looks like.
    I do not really undestand how and where you would have you above code but once you have the right node you could utilize this functionality in this way:

     

    <% //First of we want to get the resource at the correct path.. this should be the path of the imagecomponent node Resource res = resourceResolver.getResource("path of the image node"); //Then we use the standard CQ image class to create a new image from this resource Image image = New Image(res); //These are the things that the default image component would add to an image image.addCssClass(DropTarget.CSS_CLASS_PREFIX + "image"); image.loadStyleData(currentStyle); image.setSelector(".img"); image.setDoctype(Doctype.fromRequest(request)); //... do more things if you want %> <%-- When you want to draw the image on the page later on --%> <div class="myimagediv"> <% //Here we utilize the draw method of image and draws the image to the page image.draw(out); %> </div>

     

    The thing is that if you wanted to have that code and use it in a jsp page I would strongly reccomend that you implement a custom tag for this, alternatively you own handling java class for this that you could use to skip all that logic on the jsp level. It could then be that you get the image nodes from your own created class via:
     

    //Simple example of a java class handling the logic... <% MyClass myClass = new Myclass(INIT PARAMETERS HERE); for(Image image : myClass.getImages()){ %> <div class="imageClass"> <%= image.draw(out) %> </div> <% } %>

    I hope this helped you some..
    More information would be avaliable on this page : http://dev.day.com/docs/v5_1/html-resources/cq5_howto_website/ch01s13.html

    where they explain how you create an image component in CQ/AEM.

    Regards
    /Johan

      smacdonald2008
      smacdonald2008
      Level 10
      October 16, 2015

      This article will help too. It talks about getting assets from the DAM and displaying the image:

      http://scottsdigitalcommunity.blogspot.ca/2013/08/creating-aem-dam-image-component.html

      Terms & ConditionsAccessibility statement

      Loading footer...