Create new RichFaces Documentation Jira issue
This will launch the RichFaces Jira page - to complete your feedback please login if needed, and submit the Jira.
JBoss.orgCommunity Documentation
In the previous chapter we have discussed how to create Navigation Trees that represent "Shelves - Albums" hierarchy. Now it is time to upload images.
The <rich:fileUpload> component in the Photo Album application uses the embedded Flash module that adds extra functionality to the component:
Multiple files choosing;
Definition of permitted file types in the "Open File" dialog window;
A number of additional client-side object properties.
The code for the <rich:fileUpload> is contained in the "/includes/fileUpload/fileUploader.xhtml" page:
...
<rich:fileUpload
allowFlash="true" maxFilesQuantity="100" autoclear="true"
fileUploadListener="#{fileUploadManager.listener}" id="fileUpload"
disabled="#{model.selectedAlbum == null}"
immediateUpload="false" acceptedTypes="jpg,jpeg">
<a4j:support event="onuploadcomplete" reRender="filesPanel, treeform" actionListener="#{fileWrapper.setComplete(true)}"/>
<a4j:support event="onfileuploadcomplete" />
</rich:fileUpload>
...
The "allowFlash" attribute set to "true" enables the Flash module.
The "acceptedTypes" attribute specifies "jpg", "jpeg" as the permitted file types you can upload.
The "fileUploadListener" attribute
represents the action listener method listener() of the FileUploadManager
class that is notified after file is uploaded.
This method makes the main job on the upload:
...
public void listener(UploadEvent event) throws Exception {
UploadItem item = event.getUploadItem();
Image image = constructImage(item);
try {
extractMetadata(item, image);
} catch (Exception e1) {
addError(item, image, Constants.FILE_PROCESSING_ERROR);
return;
}
image.setAlbum(model.getSelectedAlbum());
if(image.getAlbum() == null){
addError(item, image, Constants.NO_ALBUM_TO_DOWNLOAD_ERROR);
return;
}
try{
if(imageAction.isImageWithThisPathExist(image)){
image.setPath(generateNewPath(image.getPath()));
}
imageAction.addImage(image);
}catch(Exception e){
addError(item, image, Constants.IMAGE_SAVING_ERROR);
return;
}
if(!fileManager.addImage(image.getFullPath(), item.getFile().getPath())){
addError(item, image, Constants.FILE_SAVE_ERROR);
return;
}
fileWrapper.getFiles().add(image);
Events.instance().raiseEvent(Constants.IMAGE_ADDED_EVENT, image);
item.getFile().delete();
}
...
The listener() method is called at server side after every file uploaded
and server saves these files in a temporary folder or in RAM depending on configuration.
In the Photo Album application the uploaded files are stored in the temporary folder
because the value of the createTempFile parameter is set to true.
See the code from the web.xml descriptor:
...
<filter>
<filter-name>Seam Filter</filter-name>
<filter-class>org.jboss.seam.servlet.SeamFilter</filter-class>
<init-param>
<param-name>createTempFiles</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>maxRequestSize</param-name>
<param-value>20000000</param-value>
</init-param>
</filter>
...
The listener() method creates an Image object
and extracts all image metadata such as Camera name, Image size, etc.
It performs scaling of an image and saves six different image's dimensions in order to create thumbnails.
After that the photo is added into the database
the temporary file is removed.
Visit following pages at RichFaces Live Demo for more information, examples and sources on the components used in the application and described in this chapter:
FileUpload page for the <rich:fileUpload> component;
AjaxSupport for the <a4j:support> component.