Thursday, November 29, 2007

Displaying a spinning wheel image during a Dynamic Faces Ajax transaction.

I am currently building a JSF application using Netbeans 6.0. For this project I use a wide range of Woodstock components and also the Dynamic Faces extension to ajaxify some of these . As some Ajax transactions may take some time to complete, I wanted to provide the user with some visual feedback that something is happening in the background.

So these are the steps you need to follow in order to display a spinning wheel gif while the client is waiting for the server response.

  • Visit the Ajax loading gif generator and create a gif. There are plenty of similar sites in the web.
  • And an image component to the web page. This must be initially hidden, so specify visibility: hidden in the style attribute of the image. I suggest this property over the display: [none/block], because the visibility property reserves the space occupied by a hidden component.
  • Create a Javascript function that toggles the image visibility and makes it visible.
    var showLoading=function(element) {
        var loadingImage = $(element);
        loadingImage.style.visibility = 'visible';
    }
    
    This function receives one string argument (the id of the image) and uses the prototype dollar function.
  • Now we need to call this method when the ajax transaction is initiated. This happens in the onClick event action method of a button or hyperlink component, by calling the DynaFaces.Tx.fire(...) function. So we just need to add a call to the showLoading function right before this.
  • The final step is to hide the image when the transaction completes. This can be done by adding the image component to the "re-render" list of components of the AjaxTransaction component. This is enough, because when the image component is re-rendered when the response is received, it uses the initial value of the visibility property, which is set to 'hidden'.

Thursday, November 15, 2007

Internationalizing Woodstock components

Project Woodstock offers a set of very useful JSF components, some of which are included by default in NetBeans 6.0. The labels, messages etc used by these components can be internationalized by following these steps:

  1. Create a new resource bundle properties file woodstock.properties. An existing one can be used, but it's better to keep things clean.
  2. Declare the bundle in web.xml.
    <context-param>
            <param-name>com.sun.webui.theme.THEME_RESOURCES</param-name>
            <param-value>my.package.woodstock</param-value>
    </context-param>
    Note that you must use the fully qualified name of the properties file (if it is placed in a package).
  3. The Woodstock Theme Doc pages include a list with all the key-value pairs for woodstock messages. You can override these in the new properties file.

Tuesday, November 13, 2007

Dynamic Faces and encoding problems

Dynamic Faces is part of the JSF extensions project, and it offers an easy way to ajaxify plain old JSF components. However, there is a problem (I would call it a bug) with international characters. Even if you specify UTF-8 as the encoding of the HTML/JSP page, the partial AJAX response is always in ISO-8859-1. This can be easily verified with the Netbeans HTTP monitor: under the Session tab, the value for the javax.faces.request.charset is UTF-8 before the request, and changes to ISO-8859-1, after the request. This results in lots of questionmarks or strange symbols in the page and it actually makes it impossible to use Dynamic Faces with an internationalized application.

The solution came from Matthias Unverzagt's comment in a number of blogs/forums, such as Hong's blog. Matthias suggests that the line

context.getExternalContext().setResponseCharacterEncoding("UTF-8");

needs to be added to the com.sun.faces.extensions.avatar.lifecycle.AsyncResponse's installOnOffResponse method.

This proved quite of a challenge for me, since it required recompilation of the jsf-extensions-dynamic-faces-0.1.jar, which was a bit tricky, as this jar appeared in a number of locations on my system:

  • ~/.netbeans/6.0beta2/config/org-netbeans-modules-visualweb-complib/installed-complibs/dynamicfaces02
  • ${netbeans_installation_dir}/visualweb1/modules/ext
The jars in these directories were different. The first directory also contained a jar with the sources, but NetBeans was using the jar from the second directory for my project.

So, here are the steps I followed (with NetBeans Beta2):

  1. I extracted jsf-extensions-dynamic-faces-0.1-sources.jar, found in the first directory above.
  2. I created a new Netbeans Java project with the extracted sources.
  3. In order to compile this project a number of libraries and jars had to be added to the project's classpath:
    • libraries: JSF 1.2, Web UI Components
    • jars el-api.jar, jsp-api.jar, servlet-api.jar, shale-remoting.jar
    The first 3 jars can be found in tomcat's lib directory, while the last one is located in ~/.netbeans/6.0beta2/config/org-netbeans-modules-visualweb-complib/installed-complibs/dynamicfaces02
  4. I opened the file AsyncResponse.java file, from the com.sun.faces.extensions.avatar.lifecycle package and added the line
    context.getExternalContext().setResponseCharacterEncoding("UTF-8");
    to the installOnOfResponse method's body. It probably doesn't matter where exactly you place this line; I added it as the second line of this method, right between the other two statements of this method.
  5. I extracted the jsf-extensions-dynamic-faces-0.1.jar file from the ${netbeans_installation_dir}/visualweb1/modules/ext directory and replaced the .class files in the lifecycle subdirectory with the ones I just compiled.
  6. That's all! I then recompiled and deployed my web application (so that the patched copy of jsf-extensions-dynamic-faces-0.1.jar would be used) and I was set.

Wednesday, November 7, 2007

Turning off the system beeper

This is the magic command that turns off the system beeper:

sudo rmmod pcspkr

And just for completence, this is how to turn it on again:

sudo modprobe pcspkr

Update (Thanks to the ArsGeek site.) This only works for the current session - the beeper is only muted till the next reboot. In order to make the beeper silent for ever, you need to add the following line to the file /etc/modprobe.d/blacklist:

blacklist pcspkr

Ubuntu: Connecting to a Windows shared network drive

I got a new PC at work and I made a clean installation of Ubuntu Gutsy Gibbon 7.10, so I had to make some configuration from scratch. This is a quick note about how I connected to our file server, using samba

From the Places menu, select Connect to server. From the window that appears, select Windows share in the Type drop-down. Then provide the server's IP in the Server field and the folder's name in the Folder field and you are done.