“the j stands for Jester”
about me | research blog | wordpress plugins | jQuery plugins

29 July, 2011

jQuery Clear-on-Focus Plugin

A small jQuery plugin I wrote which I thought I would make public. Instead of using <label> elements for each of your form’s fields, use the input’s value attribute to set the label. Clear-on-focus will then take care of clearing the value when a user clicks or focuses the field. If they leave the field blank, the original message is reset back. Also works correctly for password fields. Example usage:

<input type="text" name="username" value="Enter username" class="clear-on-focus" />
<input type="text" name="password" value="Enter password" class="clear-on-focus password" />

Link: github repository

16 December, 2010

jQuery Tiler Plugin

A new plugin I’m in the process of creating, for neatly tiling boxes of different dimensions into a grid.

If you have ever created tiled a layout by floating a bunch of boxes together, you may have noticed that when these boxes have different dimensions ( heights/widths) you end up with a lot of space and an altogther un-neat layout (Figure A):

Figure A: Floating of different-sized blocks leaves a lot of white space.

Figure B: By using the jquery-tiler plugin our boxes are now neatly stacked

The tiler plugin fixes this by greedily inserting each box into the column which is “shortest”, resulting in something like that in Figure B.

Note how the order of the boxes has changed. To me this is acceptable, but more importantly it is somewhat unavoidable (as someone wise used to tell me, “you have to break eggs if you want to make an omelette”).

Note that in this scenario all boxes are forced into fixed column widths. There is also some support for varying widths (i.e. preserving the width of each box) however it is far from complete. Will implement this when I have some more time (and a few more brain waves).

Anyway if you want to try it out, the git repository is here: http://github.com/johnjcamilleri/jquery-tiler

6 November, 2010

Fuzzy string matching in MySQL using Levenshtein Distance stored function

Searching for fuzzy string matching methods will return various algorithms and various implementations of them.

I found this MySQL implementation of Levenshtein Distance to be adequate for my needs, and using this handy MySQL stored function makes it super as to use in queries without having to create temporary search-optimised tables or performing post-processing in another language (eg PHP).

Just install the functions in your database, and use like so:

SELECT * FROM users ORDER BY levenshtein_distance(users.name, 'john')

20 October, 2010

Symphony CMS Extension — Backend Language Switcher

Just published my first extension for Symphony CMS: Backend Language Switcher

It’s basically a small backend utility to allow users to switch the language in which they view the backend. This is especially useful when used together with the Multilingual Field extension.

Check out the official extension thread and the GitHub repository.

28 September, 2010

jQuery Autoscale Plugin

This simple plugin basically takes a source and a target element (could be the same element) and shrinks the font-size in the target when the length of the content in the source increases.

Demo

Download

jQuery Spincrement Plugin

This is my first jQuery plugin!

It basically takes an element (divtd etc) containing a number and increments up or down to that value.

Demo

Download

A new project – Old Antonians Network

A project I’ve been working on the past few months is finally online, although there are plenty more features to come in the near future. It’s a niche social network for alumni of my old secondary school San Anton (in Malta) — or Old Antonians — hence the Old Antonians Network. It’s based loosely on LinkedIn, ie promoting professional networking rather than sharing photos and harvesing virtual crops, and it’s the first project of mine using the CakePHP framework. It’s a closed network so you won’t really be able to see any of it, but I wanted to link to it to perhaps bump it up on Google!

3 September, 2010

Goodbye GoDaddy, hello VPS.NET

So, I have finally made the move off GoDaddy shared hosting. While their stuff works and is admittedly cheap, I knew the perofmance was a bit crappy and in general just grew tired of the company. Their management panel is horrible, even though I’d gotten used to it after all these years. In addition I always found their advertising a bit offensive (I don’t need sexy women to convince me to buy their stuff) and in general too American. Using them just makes me feel cheap.

So I searched a while for a good-looking VPS solution, and found VPS.NET. Their focus on scalabilty is super, you can start out with minimal resources and then add as you go, without having to reprovision anything. I’d also read really good things about their customer service, and decided to take the plunge.

It’s still very early days, but so far I’m loving them. Everything was very fast to set up (minutes), support was very prompt and I have all the flexibiltiy I want and a really good price. As time goes by we’ll see if things remain this good.. well, just the fact that I’m already off GoDaddy is a huge relief!

25 July, 2010

Enabling compression with GoDaddy Shared Hosting

Compression of HTML, CSS and JavaScript is quite important for improving your site’s speed and should always be used.

Of you will find that all you need to do is add a line similar to the following to your .htaccess file:

AddOutputFilterByType DEFLATE text/html text/plain text/css text/xml application/x-javascript text/javascript application/javascript
Source: StackOverflow

However, if you’re on a GoDaddy shared hosting account you may have realised that this doesn’t work. GoDaddy’s help page recommends that you paste this code in all your PHP pages:

<?php if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) ob_start("ob_gzhandler"); else ob_start(); ?>

That’s fine, but from my understanding this will not cache your CSS or JavaScript. However, I found a solution here here, which involves some .htaccess trickery to compress all your CSS and JavaScript files automatically. Enjoy!

26 February, 2010

How to unescape HTML entities in JavaScript

This is one of those routine web development things which you assume is inbuilt, but actually proves quite tedious to find a nice solution to.

Specifically, I am talking about converting something like &#39; to ‘ or &amp; to & directly in Javscript.
This function does exactly that! Note how it adds a function to the prototype for String, so is called in the following way:

"Hello Jos&eacute;".unescapeHtml()

Find the code here: paul schreiber » Blog Archive » JavaScript: how to unescape HTML entities.

Newer Posts »