For a fun new project, Fivetwelve have launched a brand new URL shortener.

Introducing ftw.gd – the URL shortener with a fun twist.

If you’re familiar with the technical babble of “leet speak”, with slang such as “ftw”, you will like ftw.gd. It’s a great new URL shortener that is free for everyone to use for sharing short links on sites such as Facebook and Twitter. It also has a bit of a fun twist on it.

So the next time you need to shorten a URL for your tweets, give ftw.gd a try.

Again, this is more a note to myself, but I find the best function to preload images with jQuery is the following:

jQuery.preloadImages = function() {
     for(var i = 0; i<arguments.length; i++)
    {
          jQuery("<img>").attr("src", arguments[i]);
    }
}

This accepts X amount of arguments and can be called like the following:

$.preloadImages("/static/img/loadinganimation.gif", "/static/img/throbber.gif");

Why would you want to do this? Simple – if you’re using any “loading animations” on your site, with animated GIFs, you may find that on first activation on certain browsers the GIF is missing. If you preload it using a function like this one, your problem is solved.

Credit to this function goes to bloggingdeveloper.com.

This is more a note to myself than anything, but I hope this can be a use of other developers looking to regex validate UK Postcodes. This validates all postcodes including London ones fine. Here’s the code:

^([A-PR-UWYZ0-9][A-HK-Y0-9][AEHMNPRTVXY0-9]?[ABEHMNPRVWXY0-9]? {1,2}[0-9][ABD-HJLN-UW-Z]{2}|GIR 0AA)$

Here’s an example as a CodeIgniter form validation callback, which you could use by calling callback_is_valid_uk_postcode in your form validation code. The logic is obviously transferable, though.

		/**
		 * CALLBACK - determine if the provided postcode is valid.
		 *
		 * @param string $postcode
		 * @return bool TRUE if valid, FALSE otherwise
		 * @author George Edwards
		 */
		function is_valid_uk_postcode($postcode) {
			$pattern = "/^([A-PR-UWYZ0-9][A-HK-Y0-9][AEHMNPRTVXY0-9]?[ABEHMNPRVWXY0-9]? {1,2}[0-9][ABD-HJLN-UW-Z]{2}|GIR 0AA)$/"

			if (preg_match($pattern, $postcode)) {
				return TRUE;
			}

			$this->validation->set_message('is_valid_uk_postcode', 'That is not a valid %s.');
			return FALSE;
		}

Credit to writing this material goes to regexlib.com.

So I thought I would break away from the usual “very technical” programming tutorials and today write something that bears a bit more relevance to the average UK household – broadband ISPs.

This subject is something I feel quite strongly about, as I’m obviously just not an everyday Internet user. Occasionally I game online, I regularly stream HD media via services such as iPlayer and I’m always browsing countless pages as well as maintaining websites via services such as FTP. Therefore I feel a reliable broadband service is pretty much the bread and butter for me – almost as important as something like running water and electricity. So forgive me if this article waffles on a bit.

Therefore I felt it appropriate that I draw peoples attention to a company that doesn’t always get brought to most peoples attention on the TV or in newspapers and so on. Admittedly, they aren’t as well known as the likes of BT, Virgin, Sky, Tiscali or TalkTalk, but what they lack in reputation they sure as hell do make up for in service. That company is Eclipse Internet – quite easily the UK’s best broadband supplier. And here’s why.

A Comparison

Obviously I can’t spout off a claim as big as saying that Eclipse are #1 ISP in the UK without some circumstantial evidence, so I’ll do my best to back it up. Let’s compare them to another very well known ISP who sadly I have (very unpleasant and rubbish) dealings with – Sky. I’m not even going to link to them because quite frankly why would they deserve a back link from me? They are simply a shocking company. Let me explain.

I’m writing this blog post from home, and where I live I lodge with a great family who sadly use Sky broadband. Obviously, the choice of ISP isn’t up to me here. I have lodged here for a little over a year now and in that time I have noted just how pathetic Sky broadband are in the provision of their ADSL service. On the other hand, for a client of mine who’s network I manage I happily use Eclipse Internet for their Internet connection.

The first problem I had with Sky is the speed. Despite us living under a mile from the exchange, and apparently our line being capable of full 8mbps ADSL speeds, the router was only syncingat 2272kbps – which is around 2mb. Obviously, this is bad because if you’re paying for an 8mb service and getting 2mb, then you’re only getting a quarter of what you pay. So naturally at this point we got in touch with Sky and reported the problem to them. We got nowhere, beyond the arbitrary diagnosis process of the indian call centre personnel – which came down to the following:

1. Checking the lights on the router
2. Turning the router off for (insert seconds here) and then back on
3. Plugging the router into your main BT socket
4. Switching around microfilters
5. Scanning for viruses/spyware/malware on your computer
6. Ensuring you have no P2P applications running on your computer.

Once all this failed, it was just a case of ticket tennis – and bouncing between departments whilst racking up a ludicrous phone bill calling their stupid 0870 numbers. We’d even get the usual promises of phone calls back from various engineers – but still nothing. Obviously as I work in IT I knew this wasn’t good enough. It’s just laziness and lack of dedication to the customer. The problem wasn’t hard to fix. In the end, months went by until I managed to convince them that the line stabilisation process hadn’t originally completed successfully and we needed to undergo another one. This could be identified by looking up the SNR/noise margin and other stats off the router. Once I managed to convince Sky of this, an engineer instigated this immediately and within a week our router was syncing at the full 8mbps. Why should I have to do this? What kind of pathetic company relies on their customers to diagnose faults for them?

So now with a connection that is syncing at the full 8mbps, you’d think everything would be honky dory but sadly this isn’t the case, as some Sky customers would agree. The speed issues weren’t exactly improved because Sky seem to have a slight issue with overcrowding. Their contention must be something like 1000 customers fighting for 1 connection because anytime between the hours of 4pm and 12am, any day of the week, the Internet is literally unusable. This may sound like an exaggeration, but I kid you not. You can expect being a customer of Sky that in peak times, your download speeds will drop to about 0.30mbps, at best, with severe latency.

Forget online gaming – it will take about 3-5 seconds before your actions will register with other players – the lag is horrendous. Forget watching videos on YouTube or streaming TV shows on BBC iPlayer. Hell, forget even being able to browse normal Internet pages – as I can get that done ten times as fast on my iPhone with my O2 3G connection. It plainly and simply is – completely unusable at any time, unless you are nocturnal and are online in the middle of the night, or you don’t have a job and spend all day online gaming. But who is/does?

Admittedly, I’ll give Sky some credit. In the middle of the night you can expect some decent figures. You can download stuff at around 800-900KB/sec at 3am, but sadly in the real world only 0.05% of their users are awake at this time – so it’s going to be quicker.

To conclude on Sky, I’ll wrap up and give you one simple warning. Avoid. If you want to use your Internet connection at any normal hour of the day, don’t even bother with them. They are simply the worst company I have ever dealt with for service and support, and their broadband is completely unusable.

So what about Eclipse?

Now that’s over with, let me compare to Eclipse. I fear this section of the blog entry will be much much shorter as there is little to say about them, apart from they are simply staggering.

So what is so great? I think it mainly comes down to support. Compare Eclipse to the likes of Sky/AOL/BT – what stands out the most is dedicated, friendly, helpful support personnel who are in UK based call centres. If you ring Eclipse, they will answer within literally a few seconds, and you’re straight away talking to someone who is willing to help you and you get that pleasant impression that they want to help you as much as they can. They are also incredibly knowledgeable.

For my previously mentioned client who’s network I manage, I occasionally have to ring up Eclipse because of little concerns on the line. A couple of weeks ago I noticed that peak speeds had dropped to around 300KB/sec downstream. Compared to Sky, you’d think that heaven! But with Eclipse I knew that this wasn’t the norm, as usually we’d expect to be getting around 600-800KB/sec all day long.

The support chap at the other end was as usual – completely amazing. The first thing he looked at was the status of the  local exchange, and he informed me that upgrades were currently being performed, so this may have temporary impact on the speed of the connection. He then looked at the stats of the line, including the SNR and noise margin and so on – where he looked at what Sky so crucially overlooked – whether the line needed to restabilise. He checked how long the connection from the router to the exchange had been up, and in what quantities. He politely explained to me that as the exchange upgrades would require another line stabilisation, that the router should be up as long as possible as any sustained drops in the connection would result in a slower overall sync speed. Ring any alarm bells? This is how ADSL support should work – knowledgeable, well trained and helpful staff. For pete’s sake – take note, Sky.

It didn’t really stop their, I went on to ask him that in the best interests of my client, what are the alternatives in their area for a faster Internet connection – such as ADSL2/21CN/SDSL and so on. I just wanted an answer in layman’s terms – is there a fast alternative without breaking the bank. To which he replied that he wasn’t sure, but would I mind holding as he’d go and check with his more experienced colleagues in the office for a definitive answer. Awesome! How many other support people would just leave it with a simple “no no no Mr Edwards you must pay us £xxxx” and so on. This is why with Eclipse you can be sure that the support people want to help you.

Conclusion

So I think I’ll sum it up – already at nearly 1500 words, this is quite a comprehensive comparison. So I’ll finish with a simple conclusion: If you want broadband that works at less than 4% of the speed you pay for the majority of the time, with rubbish, foreign, clueless and sometimes abusive support staff, use Sky Broadband.

On the other hand if you want broadband that just… “works”  with excellent, friendly, helpful and knowledgeable staff to help you out in the very rare event you have problems, go with Eclipse. I can categorically say that in my experience Eclipse Internet are the best UK Broadband ISP by far.

In a web app I’m developing at the moment, the primary database in use is an instance of Microsoft SQL Server 2005 Express. This works OK with the CodeIgniter/PHP front-end. Obviously, if I had the choice, I would be using MySQL but in the real world sometimes this isn’t possible. And MSSQL is working great with simultaneous connections from the PHP app and MS Access.

I hit a point where I also wanted to access a MySQL database as well. This is easier than you think to configure, and worked first time with me without any stress or hair pulling.

To save you having to read through all the following detailed examples, the basic concept is as follows:

1. Add a new config array to the $db array in config/database.php.
2. Name this array whatever you like, and configure it as normal with the usual CI elements/options. E.g. $db['other_db'].
3. Create a member variable in your models/wherever you want to access the new setup. Name it something like var $other_db;.
4. Load the database into the member variable, using $this->other_db = $this->load->database('other_db', TRUE);.
5. Reference the new member variable just like you would with CodeIgniter’s own $this->db object.

Configure database.php

First thing you’ll need to do is let CodeIgniter know of your multiple database setup in the config/database.php file. Mine looks a bit like this.

// $db['default'] config array will hold the default db settings - in my case, for the MSSQL server
$db['default']['hostname'] = "SQLSERVERADDRESS\SQLEXPRESS";
$db['default']['username'] = "sa"; // or a different account
$db['default']['password'] = "secr3tsqlpassw0rd";
$db['default']['database'] = "yourdbname";
$db['default']['dbdriver'] = "mssql"; // obviously this is platform dependent
$db['default']['dbprefix'] = "";
$db['default']['pconnect'] = TRUE;
$db['default']['db_debug'] = TRUE;
$db['default']['cache_on'] = FALSE;
$db['default']['cachedir'] = "";
$db['default']['char_set'] = "utf8";
$db['default']['dbcollat'] = "utf8_general_ci";

// for the secondary db server, $db['mysql'] will hold the config. you could name this anything you like, e.g. $db['secondary_db'], or however you see fit
$db['mysql']['hostname'] = "localhost";
$db['mysql']['username'] = "root";
$db['mysql']['password'] = "secr3tmysqlpassw0rd";
$db['mysql']['database'] = "other";
$db['mysql']['dbdriver'] = "mysqli"; // in this case, i'm using the MySQL Improved class to access the MySQL server
$db['mysql']['dbprefix'] = "";
$db['mysql']['pconnect'] = TRUE;
$db['mysql']['db_debug'] = TRUE;
$db['mysql']['cache_on'] = FALSE;
$db['mysql']['cachedir'] = "";
$db['mysql']['char_set'] = "utf8";
$db['mysql']['dbcollat'] = "utf8_general_ci";

Load the non-default database config in your models

So if you followed the above, you have two database configurations. You have default as per the first array, and mysql, as per the second (or whatever you chose to name it).

The next bit is simple. In your models, you can access the default database server just by using ordinary ActiveRecord calls such as $this->db->get('users');, but how do you access your secondary database?

Simple, just use the $this->load->database(); method, and plug in the name of your additional database config from the database.php config file. This will load the driver to this database, so you’ll want to do this in your models, and assign it to a member variable.

Working through an example below, I created a brand new model to do this, with a member variable. This model was then used just for connecting to the MySQL database. So here’s an example that accesses a table of UK postcodes.

<?php

	class Mysql_model extends Model {

		// We'll access the MySQL db from this app which is primarily MSSQL based. Create the member variable.
		var $mysql;

		function Mysql_model() {
			parent::Model();

			$this->mysql = $this->load->database('mysql', TRUE); // Load the db, and assign to the member var.
		}

		/**
		 * Accepts an outfield/regional British postcode, and returns the data associated with it.
		 *
		 * @param string $postcode The outfield UK postcode. E.g. SY21, NW1, HR6, RG19, CF37, KT1, etc...
		 * @return array Of postcode data, bool FALSE otherwise
		 * @author George Edwards
		 */
		function get($postcode) {
                        // Now we can refer to this database server with $this->mysql.
			$this->mysql->select('town, county')->where('postcode', $postcode)->from('uk_postcodes')->limit(1);

			$query = $this->mysql->get();

			if ($query->num_rows() === 1) {
				// Do we have 1 result, as we expected? Return it as an array.
				return $query->row_array();
			}

			// Otherwise, we'll return FALSE.
			return FALSE;

		}
	}

/* End of file mysql_model.php */
/* Location: ./application/models/mysql_model.php */

Have fun with CodeIgniter! Any questions? Leave me a comment.

One thing that I’ve seen lots of people ask questions about is how to reliably pause or sleep execution of Javascript code. There are a variety of solutions, however none seem to be reliable as Javascript cannot really handle this functionality, except if you use setTimeout, which is no good if you just want to not consider any events, and you just want a bog standard sleep like PHP has. With jQuery, the need is reduced a little bit because you can use event callbacks to delay execution of the script until certain events have completed.

But what if you need to implement this and you need it to be reliable? What if you just have to delay execution for x number of seconds? Here’s a very simple way I came up with.

Use PHP

Think about it – PHP has the sleep(); function which works like a charm for delaying execution. So why not just combine the two? If we create a PHP page to handle an incoming Javascript request, sleep(); execution for a given number of seconds, then return output to Javascript, this pauses execution.

PHP code

OK so let’s first make a PHP page. Call it sleep.php and use the following code.

<?php

	// Do we have a duration time?
	if (isset($_GET['duration']) && is_numeric($_GET['duration'])) {
		$duration = $_GET['duration'];
	} else {
		// If not, just say 1 second.
		$duration = 1;
	}

	sleep($duration);

	echo "ok";

?>

All we do here is expect a GET variable of duration. If it’s there, and it’s numeric, we’ll sleep to it’s value. Then when sleep is finished, we’ll echo back “ok” to the browser. You can test this functionality by just performing a direct request to it and passing ?duration=5 for a five second pause, for example.

The Javascript

Now we can just create an ordinary HTML page with our Javascript in. We can create a function called js_sleep() for example that handles our callback for us.

// Our pause function.
function js_sleep(duration) {
	if (duration == undefined || isNaN(duration)) {
		duration = 1;
	}

	$.ajax({
		url: 'http://path-to/sleep.php',
		type: 'GET',
		data: {duration: duration},
		success: function(response) {
			if (response == "ok") {
				alert('Timer finished');
			}
		}
	})
}

With that code there we can quite easily call it in our Javascript code as js_sleep(3) to create a pause of three seconds anywhere. Obviously you’d probably want to modify that code to return true; or nothing at all, rather than alert.

Problems with this method

Although this works great and isn’t too hard to implement, the biggest problem is that the request will usually be a little bit longer, as the user’s browser has to perform the callback to the server and wait for the response. Testing on Firebug, I discovered that it usually adds about 100-300ms to the request.

EasySlider is an awesome quick and easy jQuery plugin to get things sliding with ease. I’ve used it on a clients site and found it very easy and versatile. There are plenty of options and customisations such as varying speed, pause length, repetition and so on.

There was one thing I noticed, however, that wasn’t customisable. A simple pause facility when someone hovers their cursor over the EasySlider object. I know from experience that putting something on a continuous loop is great to add a bit of movement to the page, but is no good if the user can’t stop it while they’re reading the content of the slide.

After a quick look online, it seemed as though no-one else has done it. So I put on the wellies and began wading through the code to add this functionality myself.

Adding the option

The first thing I wanted to do, was make it optional. Some times people may not want to use this functionality, so it’s best to configure it as a boolean parameter passed on instantiation of the plugin class. We’ll configure a default to false, so that the out-of-box behaviour is continuous sliding. Find the EasySlider plugin file, locate the defaults object, and modify it as I have done here.

// default configuration properties
var defaults = {
prevId: 		'prevBtn',
prevText: 		'Previous',
nextId: 		'nextBtn',
nextText: 		'Next',
controlsShow:	true,
controlsBefore:	'',
controlsAfter:	'',
controlsFade:	true,
firstId: 		'firstBtn',
firstText: 		'First',
firstShow:		false,
lastId: 		'lastBtn',
lastText: 		'Last',
lastShow:		false,
vertical:		false,
speed: 			800,
auto:			false,
pause:			2000,
continuous:		false,
numeric: 		false,
numericId: 		'controls',
allControls:	false,
// added by George Edwards. When user hovers over control, doesn't animate
hoverPause:		false
};

Now when people instantiate the plugin, the following code can be used to trigger the hoverPause functionality:

$('#slider').easySlider({
    speed: 200,
    auto: true,
    continuous: true,
    pause: 4000,
    allControls: true,
    // Trigger the pause on hover functionality
    hoverPause: true
});

Creating the functionality

OK so now we have a configurable option, it’s time to build up the functionality. We need to detect when someone begins to hover over the object, and when their mouse stops hovering over the object. Fortunately, jQuery has the .hover() event that is fired when a DOM element is hovered over, along with a callback for when the element loses it’s hover state.

We can make use of this in this situation, but we’ll also need to keep track of the hover state when the plugin tries to begin the slide transition. So we just create an object property that stores a boolean value, and change it using the .hover() event. Take a look at the following code:

		// We'll need this member variable to store a current hover state
		var mouseOver = false;

		// Handle mouse over of div
		obj.hover(function(){
			mouseOver = true;
		}, function(){
			mouseOver = false;
		});

So here we’ve got our member variable that is set depending on the hover state. We bind the .hover() event to the obj object, as the EasySlider code assigns this from the $(this) DOM element, being the slider div. Now our code is handling the hover state correctly.

The next stage is to delay the slide animation/transition. For this, find the animate() function in the plugin and insert the following to the top of the functon code:

			function animate(dir,clicked){

				// If the mouse is over the object, bail animation.
				if (options.hoverPause == true && mouseOver == true) {
					return;
				}

Pretty simple, or what? This simple if statement says – if we have enabled hoverPause functionality for this instance of the plugin (options.hoverPause == true), AND if the user is hovering over the slider element (mouseOver == true) then return out of the animate function without animating.

I hope this very simple improvement to this fantastic plugin can be of use to other developers looking to add pause/hover functionality.