2

Displaying images using <p:graphicImage> as follows.

<p:graphicImage value="#{imageBean.image}" width="80" height="60">
    <f:param name="id" value="1"/>
    <f:param name="width" value="80"/>
    <f:param name="height" value="60"/>
</p:graphicImage>

The ImageBean looks like the following.

@Named
@ApplicationScoped
public class ImageBean {

    @Inject
    private Service service;

    public ImageBean () {}

    public StreamedContent getImage() throws IOException {
        FacesContext context = FacesContext.getCurrentInstance();

        if (context.getCurrentPhaseId() == PhaseId.RENDER_RESPONSE) {
            return new DefaultStreamedContent();
        } else {
            Map<String, String> requestParameterMap = context.getExternalContext().getRequestParameterMap();
            String id = requestParameterMap.get("id");
            String widthParam = requestParameterMap.get("width");
            String heightParam = requestParameterMap.get("height");

            int width = Utils.isNumber(widthParam) ? Integer.parseInt(widthParam) : -1;
            int height = Utils.isNumber(heightParam) ? Integer.parseInt(heightParam) : -1;

            byte[] bytes = Utils.isNumber(id) ? service.findImageById(Long.parseLong(id), width, height) : null;
            return bytes == null ? null : new DefaultStreamedContent(new ByteArrayInputStream(bytes));
        }
    }
}

The service.findImageById() method returns a byte[] obtained after resizing the given image according to the dimentions given.

This will display a thumb image after being resized on the server side according to the dimensions given.

<p:graphicImage> generates an image URL dynamically which is to be assigned to src of the generated <img> tag. This would look something like the following.

/ContextPath/javax.faces.resource/dynamiccontent.properties.xhtml?ln=primefaces&amp;v=5.3&amp;pfdrid=aAPHlxcQ2lcqfvzacYoCC6iUxLU1VVFp&amp;pfdrt=sc&amp;id=9&amp;height=100&amp;width=100&amp;pfdrid_c=true

Is it possible to open the original image in a new tab, when a thumb image is clicked so that it can correspond to the HTML something like the following?

<a href="show_original_image.php?id=1" target="_blank">
    <img src="show_thumb_image.php?id=1" width="80" height="60" style="border: 0px none;"/>
</a>

What would be the value of href of <a> and how it is to be assigned to href dynamically in the context of JSF / PrimeFaces?

Tiny
  • 27,221
  • 105
  • 339
  • 599
  • You could use a `servlet` to render the image and send the image-id by GET parameter, then use the service go get the byte[] and then have the servlet print the content – Esteban Rincon Jul 13 '16 at 22:31
  • I thought of that before posting but designing a Servlet every time a different set of images is needed is something not very maintenance-friendly. – Tiny Jul 14 '16 at 10:48
  • Is this helpful in solving your problem? http://stackoverflow.com/questions/39736390 Or do you need a PrimeFaces specific solution (hack/workaround)? – BalusC Oct 05 '16 at 14:19
  • 1
    @BalusC : That is undoubtedly helpful but currently I don't want to modify the existing project which has been using `` at many places since the beginning. I will take that for future projects, if any. – Tiny Oct 05 '16 at 14:26
  • 1
    Clear. Maybe I'll look if time allows me. – BalusC Oct 05 '16 at 14:28

0 Answers0