Skip to main content

smartsprite to generate sprite automatically

I am a lazy person and like to automate things that can be automated. We had all our sprites hand written earlier and the problem with that approach is that it was append only. Every time you have to add a new image the developer would add it at the end but if I asked to remove an image then they would give me a look like what the heck I am talking about, they would give weeks estimate to go and fix coordinates in each and every place those images were used. Net net this seems like something that should not be that hard to automate and thats where smartsprite came to rescue. A very very handy tool to automatically generate your sprite and biggest benefit is that its non-intrusive and you can start small and keep cleaning your old code and convert to this mode as and when you change that part of code.   This is the link to the tool http://csssprites.org/

So all you need to do is add some comments at the top of  your existing css
/** sprite: kpSmartSprite; sprite-image: url('../images/kpSmartSprite-${md5}.png'); sprite-layout: vertical; */

and then the css rule where you add image reference you have to add the comment

.t-add {
        background-image: url("../images/add.png") !important;  /** sprite-ref: kpSmartSprite;  sprite-alignment: left;  sprite-margin-bottom:6px;*/
}

So you can keep adding these tags. Now you can use an ant target to generate your sprite. The tool will generate the sprite image and will also change you css file to add the coordinates.


    <target name="sprite-images" description="Creates a sprite using smartsprite by reading smart sprite annotations">
        <taskdef resource="smartsprites.xml">
          <classpath>
            <fileset dir="${thirdParty}/tools/smartsprites-0.2.8/lib">
              <include name="*.jar" />
            </fileset>
          </classpath>
        </taskdef>
        <smartsprites rootdir="${war.path}/css"
                      documentrootdir=""
                      outputdir="${war.path}/css-sprite"
                      cssfileencoding="UTF-8"
                      cssfilesuffix=""
                      loglevel="INFO"
                      spritepngdepth="AUTO"
                      spritepngie6="false" />
               <move todir="${war.path}/css" failonerror="no">
            <fileset dir="${war.path}/css-sprite" />
        </move>
</target>

Comments

Popular posts from this blog

RabbitMQ java clients for beginners

Here is a sample of a consumer and producer example for RabbitMQ. The steps are
Download ErlangDownload Rabbit MQ ServerDownload Rabbit MQ Java client jarsCompile and run the below two class and you are done.
This sample create a Durable Exchange, Queue and a Message. You will have to start the consumer first before you start the for the first time.

For more information on AMQP, Exchanges, Queues, read this excellent tutorial
http://blogs.digitar.com/jjww/2009/01/rabbits-and-warrens/

+++++++++++++++++RabbitMQProducer.java+++++++++++++++++++++++++++
import com.rabbitmq.client.Connection; import com.rabbitmq.client.Channel; import com.rabbitmq.client.*; public class RabbitMQProducer { public static void main(String []args) throws Exception { ConnectionFactory factory = new ConnectionFactory(); factory.setUsername("guest"); factory.setPassword("guest"); factory.setVirtualHost("/"); factory.setHost("127.0.0.1"); factory.setPort(5672); Conne…

What a rocky start to labor day weekend

Woke up by earthquake at 7:00 AM in morning and then couldn't get to sleep. I took a bath, made my tea and started checking emails and saw that after last night deployment three storage node out of 100s of nodes were running into Full GC. What was special about the 3 nodes was that each one was in a different Data centre but it was named same app02.  This got me curious I asked the node to be taken out of rotation and take a heap dump.  Yesterday night a new release has happened and I had upgraded spymemcached library version as new relic now natively supports instrumentation on it so it was a suspect. And the hunch was a bullseye, the heap dump clearly showed it taking 1.3G and full GCs were taking 6 sec but not claiming anything.



I have a quartz job in each jvm that takes a thread dump every 5 minutes and saves last 300 of them, checking few of them quickly showed a common thread among all 3 data centres. It seems there was a long running job that was trying to replicate pending…

Email slavery

It seems I have become an EmailSlave. The first half of the day is spent in just answering to emails. There are so many emails where I am copied but I need not be. There are many emails  where its a 1-2 page email and somewhere down someone says @KP please answer this.  So it seems daily my work schedule is:
Signin to newrelic and check anomalies for 15 min. Check emails related production exception report and yes there are a ton of these report daily. Need a better tool here as this model is not scalable. I need to reduce the incoming data at me to only see relevant data like what newrelic does. May be I need to create a webapp out of these emails.Check emails for next few minutes before team callsDo team callsThen again back to checking emails until a I have taken a best shot at answering everyone waiting for my reply.Attend team meetings on Tue/Thu
Being an architect and coder at heart I don't feel satisfied at end of the day if there is nothing tangible getting done at the end.…