Awesome Image Evolution

Posted by Dustin on May 29, 2008 under Web Development, Websphere Commerce | Read the First Comment

So a while back, and by a while I mean about 3 months or so ago Marketing decided they’d like to show some eye catching images on some of the products on two of our sites…lucky me I got this task and at the time accomplished this the only way I could think of (and I’m not sure why it’s the only thing I could think of). What I did was use Field 4 as a place holder for a phrase/word that would trigger an image to be shown if a proper word/phrase was in that field. The code looked quite similar to the following:

<wcbase:useBean id="product" classname="com.ibm.commerce.catalog.beans.ProductDataBean" scope="request" />
 
<c:if test "${product.field4 == 'blah'}">
     <img src="blah"/>
</c:if>

While functional and handy for keeping any rougue phrases from triggering a false image this is not ideal, especially when your marketing group keeps adding more and more images to display…I think now we are up to around 8.
So about a month or so ago Phil got a task to add yet another image and while consulting about it we decided it would be better to change the code so that there weren’t so many if’s in our code. So we chaged it to the following:

<wcbase:useBean id="product" classname="com.ibm.commerce.catalog.beans.ProductDataBean" scope="request" />
 
<c:if test="${product.field4 != ''}">
     <img src="<c:out value="${jspStoreImgDir}${product.field4}"/>.jpg" alt="<c:out value="${product.field4}"/>" />
</c:if>

This is much better because it allows us to put any value in field4 and then the code will strip that value and slap a .jpg on the end, so as long as we have a value.jpg image it will show up. However we did find a bug in this, apparently if you have had a value in field4 and deleted said value it confuses the code and websphere will still look for a .jpg image which of course is nowhere to be found, and if viewed in the wrong browser (ie IE) a missing image will appear (funny how missing images can appear). So recently we’ve changed this code yet again and this time I think we nailed it, have a look:

<wcbase:useBean id="product" classname="com.ibm.commerce.catalog.beans.ProductDataBean" scope="request" />
 
<c:if test="${!empty product.field4}">
     <img src="<c:out value="${jspStoreImgDir}${product.field4}"/>.jpg" alt="<c:out value="${product.field4}"/>" />
</c:if>

The empty seems to ignore any previously entered values and focus on the fact that the field is empty and not so much look for a null value.

THE END