How to show images uploaded by uploadr plugin in Grails

Question

I am new in Grails. I am using uploadr plugin to upload images. Upload images works fine. My images successfully uploaded in my directory.

Now I want to show these images also in my show.gsp file. But I don't have any idea about it. Here is my uploadr tag :

<uploadr:add name="fileupload" path="C:/Users/Shreshtt/workspace/groovypublish/grails-app/uploader" direction="up" maxVisible="8" unsupported="/uploadr/upload/warning" rating="true" voting="true" colorPicker="true" maxSize="0" />

See this demo also ..

How can I show these images in my view page also. Please help.

Answer 1

You should use a path in your app like this:

<uploadr:add name="ComonUp10" path="uploadFile/"  direction="up" maxVisible="8" unsupported="/my/controller/action" rating="true" voting="true" colorPicker="true" maxSize="204800000" />

here uploadFile/ will be a folder inside web-app directory in your grails application.

and then you will be able to see already uploaded files as:

<% def path = new File("uploadFile/") %>
<uploadr:add name="mySecondUploadr" path="${path}" direction="up" maxVisible="5" unsupported="${createLink(plugin: 'uploadr', controller: 'upload', action: 'warning')}">
<% path.listFiles().each { file -> %>
    <uploadr:file name="${file.name}">
        <uploadr:fileSize>${file.size()}</uploadr:fileSize>
        <uploadr:fileModified>${file.lastModified()}</uploadr:fileModified>
        <uploadr:fileId>myId-${RandomStringUtils.random(32, true, true)}</uploadr:fileId>
    </uploadr:file>
<% } %>
</uploadr:add>

And for showing images uploaded in that directory without uploadr, you can add image tags on your GSP pages as:

<img class="" src="${resource(dir:'uploadFile',file:'your-image.jpg')}"  />

You can add images in a each loop and have them one my one like:

<g:each in="imageContainingList" var="oneRowObject">
   <img class="" src='${resource(dir:"uploadFile", file:"${oneRowObject.imageFile}.jpg")}'  />

</g:each>

Or if you want to list all images in uploadFile folder then you can try:

You have to collect all your image names within your controller, pass them to the view and show them using the grails image tag.

To collect all your image names you need the path to your grails app:

def showImageGalleryControllerFunction(){
    def imageDir = grailsAttributes.getApplicationContext().getResource("/uploadFile/").getFile().toString()

   //Collect image names

    def images = []
    new File(imageDir).eachFileMatch (~/.*.png/) { file ->
        images << file.getName()
    }

   [images:images]
}

and in your showImageGalleryControllerFunction.gsp file:

<g:each in="${images}" var="image">
    <g:img dir="images" file="$image" />
</g:each>