Thursday, January 24, 2013

Sprite Image - A bite on CSS

In my recent task related to application themes I came across a term - "sprite image". In my limited vocabulary and literacy of css it was challenging to interpret what an image with blocks of multiple images meant,was it a doodle by user experience team?

This is how a sample sprite image looks like (apple's sprite):


After some discussions I figured out the image was production ready and should be used by the theme css!With some reading/google it actually turned out to be an interesting concept to club all image in one and make them visible in parts in css using background positioning. Let me dig in more details - with a disclaimer that this post would be very basic introduction, not for pros.

Per w3school.com definition-
"An image sprite is a collection of images put into a single image.
A web page with many images can take a long time to load and generates multiple server requests.
Using image sprites will reduce the number of server requests and save bandwidth."

If you look at css examples using the sprite image, you would find code like -
.app-nav ul li a:hover {
background: transparent url('sprites-img.png') -3px -597px no-repeat;
}
Where '-3px -597px' is position of the image that should be extracted.

So the next challenge is how to interpret the background position?
If you have paid tools like Photoshop or Adobe firework, the task gets quite simple. Being a newbie to CSS and no access to these paid tool I was looking for something more handy(free?) to do this work for me.
Thanks to few conversations in stackoverflow.com, I came across this online graphics tool - spritecow.com which would tell you the exact position of the image needed. It's slow but its online and its free so I am not complaining! You need to be on latest browser versions to use this tool but its quite useful.
So once the position of images are known its time to get on css skills and use the sprite image.

Other online tool is spriteme.com which I discovered from this very detailed blog. Haven't used it much as I didn't really need to create sprite image, but it can be helpful if you plan to build your own sprite image.

Happy coding!

Friday, August 3, 2012

REST APIs served twice on port 80( via IIS/AJP Connector)


Few months back I faced an interesting issue related to REST APIs. When REST APIs were fired on port 80(via IIS, ajp connector), they were being served twice by the server. However when it was fired on port 8080(hit Tomcat directly via HTTP 1.1 connector), it got invoked just once. I verified using HTTP inspection tool that client was sending a single request to server and so was IIS.

The REST API framework was based on Apache CXF so I posted the question on their forum to check if they had any clue on what was going wrong.
Didn't get much help from that so after all analysis,troubleshooting and reading online forums, this is what it turned out to be-

For each API HTTP request Apache CXF sent back an extra packet of response which unfortunately did not adhere to the IIS connector's (AJP) protocol. This threw an exception in connector code which blocked the response midway.After it recovered from the exception it ignored(no rollback) the previous response and re-fired the same API request again which worked - hence we had two invocation of the server code but client got a single response based on second invocation. This proved hazardous for create APIs as second response was mostly unique constraint errors.

I noticed that this issue was reported as a conenctor bug a while back, as its expected to handle these failures more gracefully - https://issues.apache.org/bugzilla/show_bug.cgi?id=48826. When I picked up the attached dll in this bug it didn't work for me, there were more exceptions thrown.
I was then looking through CXF code to find source of extra packet of response but that didn't turn out to be easy .. also got in touch with CXF team and they asked me to switch to simple HTTP proxy setup as they have seen quite a few issues with AJP!!

However when I pick up the latest dll from here http://apache.mirrors.tds.net//tomcat/tomcat-connectors/jk/binaries/windows, the problem goes away and everything gets normal. Looks like this bug is address in the version 1.2.37

So finally updating the IIS connector resolved the bug for me and saved my APIs from crashing!

Thursday, May 12, 2011

JUnit 4.0 - Creating a TestSuite

I recently enrolled in a study group Test Driven Development using JUnit 4.0 at diycomputerscience.com. The first activity of this week (Week 2) was create a test suiteusing @RunWith annotation.
@RunWith is an annotation provided by JUnit 4 to allow test to be executed using custom runner. For example, Spring framework provided a custom runner SpringJUnit4ClassRunner.java, to execute test in Spring Test Framework context.
To create a TestSuite, we can use the built-in runner provided by JUnit Suite.java , which expects a list of test classes to be executed.

Sample code to create TestSuite

Monday, January 24, 2011

Agony with Dates, Timezone and Java Date Utilities

Am not a guru when it comes to dealing with dates and timezone and it just got worse when I was dealing with Java Library to get done with a date related task. Job was to display current date in IST (India) timezone. As it may sound to be quite simple, it did give me few sweaty hours with my system on EST timezone. Let's talk code:

public class DateConversionTest {  
public static void main(String[] args) {
  Calendar cal = Calendar.getInstance();
  DateFormat dateFormat = new SimpleDateFormat();
  dateFormat.setTimeZone(TimeZone.getTimeZone("Asia/Calcutta"));

  //L1: Convert date to IST timezone 
  String dateString = dateFormat.format(cal.getTime());
  System.out.println(dateString);

  //L2: Use parse method to get Date object, as advised by java.util.Date
  try{
      System.out.println("Date using parse method: "+

                              dateFormat.parse(dateString));
  }catch (ParseException e) { 
       e.printStackTrace();
  }

  //L3: Use date constructor

   System.out.println("Date using constructor: " +new Date(dateString));
  }
}

SimpleDateFormat provides the capability to convert date to particular timezone. I could have used Calendar for it, but let me get to it later why I opted out . The string "dateString" from DateFormat(//L1) provided the correct date in IST timezone. I had a mandate of returning "Date" object so the next step was to convert this to a Date object.
I looked up the javadoc and the constructor of java.util.Date with String parameter was deprecated and said "Deprecated. As of JDK version 1.1, replaced by DateFormat.parse(String s)."
As per the doc, I used the alternative but to my surprise the above method returned back my system date in EST timezone(look at output for details). Instead of using DateFormat I tried to replace the program with Calendar object but Calendar.getTime() would also return date in my system timezone inspite of converted dated already provided to it. This was the reason I did not use it in my test code.
After much of experiments, I tried to use the date constructor with String parameter(//L3) which finally returned the expected date in IST as stored in "dateString" object.

Output:
String date from formatter: 1/25/11 2:35 AM
Date using parse method: Mon Jan 24 16:05:00 EST 2011
Date using constructor: Tue Jan 25 02:35:00 EST 2011


Why should a deprecated constructor work as expected and DateFormat worked so strangely?
With my research it looked like DateFormat.parse internally works using Calendar object which returns date (Calendar.getTime()) based on the timezone of the JVM. (TimeZone.getDefault()). If I alter this, I get date in expected timezone. Note, JavaDoc does state that it returns date in UTC format but it always return in default timezone of JVM.
When a certain date is already provided by developer, shouldn't this auto conversion avoided by Java? I would like to hear how other developers would solve it in more effective way as it clearly doesn't leave me satisfied.

Tuesday, January 11, 2011

Library to validate Phone Numbers

Recently came across this article in server side that talks about libphonenumber, which is library to validate international phone numbers. Java and Javascript libraries looks promising and can be quite useful in building applications.

http://code.google.com/p/libphonenumber/

One of the direct use case I can think of is when we have to send notifications from application to mobile device. It would help to have this validation handy when users feed in their numbers to the applications.

Twilio developers can also be excited about this as they can build more reliable voice and sms application.

Happy playing with libphonenumber.

Sunday, August 15, 2010

Allz well till it glows green ..

Often when I start developing something, I have a strong urge to jump on coding with some primitive design in mind. I guess it's natural human urge to get something working and show it to the world, "Yay! See.. I can!". "Oh! Really", says the reviewer. He thinks of the weirdest possible scenario and says, now tell me how in this world will you support that. Quickest answer which just bubbles out -"This is not the requirement!" and I hear the reply I detest "We are agile, requirements will change tomorrow, do you want to change the entire design for that?".
Huh, and thus I start rethinking and start changing some design, just to realize that now to support that weird stuff, I broke the basic requirement and the day I realize that, am too far into the new thing. So even with quick development; starts the last minute cramping to get things in and at the end of the day I hear the howling - "Just get the damn thing done!!"
Most developers go through this dilemma, especially when we have to develop in "agile" mode and the need to re factor urges the day we put in the first cut.
Now, how I learned to handle it. Having hit with such situations couple of times I finally decided to "grow up" and "get smart" at handling my changes. And nothing could help me more than a simple step of just putting in unit test for my code. I had read about it in school and understood the concept but never really got time to explore it.There is never ever enough time to code, where the heck could I find time to write unit test. But now, I decided, let me take some more time and reveal only when I have unit test green for basic required use case. The fun of feedback process starts, but now I have a mechanism to know that I am not breaking the basic requirement in my ambitious goal to handle all scenario's in my design.
I have defined my 'limus test' and till my test glow green I am ready to incorporate all feedback. This has given me amazing flexibility in my development process and is helping me getting "agile". Have also been reading about "TDD-Test Driven Development", but haven't yet got to the stage of writing test before I start development. That would be an ideal world and would make me a happy developer.