Custard Slice birthday cake

Posted: December 17th, 2010 | Author: Foamcow | Filed under: Food, General | | No Comments »

Custard Slice birthday cake

Originally uploaded by foamcow

Death to wasp scum

Posted: October 6th, 2010 | Author: Foamcow | Filed under: Drunken Ranting, General, Humour, Social Comment | | 2 Comments »

I had a minor problem with a wasp infestation during the summer so I went to the local Homebase to get something to deal with it.

No problems there. I forgot all about it to be honest.

Just now though, I received and email from Homebase asking me to review my recent purchases. Curious as to what it was I may have recently bought from Homebase I took a closer look.

They wanted me to review the can of Wasp killer and the tub of Ant powder I’d bought in the summer.

Well, after a prompt from a Tweeter, I obliged.

–
Death to Wasp Scum.

With a can of wasp spray in my left hand and the ant powder in my right, I had a glimpse of what it felt like to be Hitler.

I didn’t like it, but it had to be done.

I approached the wasps at dusk to catch them unawares. Creeping up on their stronghold I let rip with the can of spray, deploying choking death directly into the wasp nest’s entrance. And but few seconds later I heard many tiny, buzzy coughs coming from inside.

Unfortunately they must have had some special suits or had developed a resistance because within 30 seconds I was being pursued by what was probably in excess of 1000 rather annoyed, coughing wasps.

I did a pretty good job keeping ahead of them but eventually I started to flag and they caught up with me. Once I’d endured a couple of hundred stings I found it very hard to keep up the pace and they brought me down.

Not to give up without a fight I chose this moment to deploy the powder – at the very least it might provide a smokescreen so I could effect a getaway. Alas, the wind took the puff of noxious powder straight into my face.

It was shortly after this point that I must have passed out as I woke up a couple of days later in hospital. It’s ok though, I was back home within a week or so and all the wasps were dead. Got them! Great product!

**** 4 stars

The Waspinator.

–

Hope I win the 100,000 Nectar points on offer but I somehow doubt it.

Football, Football, Football!!!!

Posted: June 11th, 2010 | Author: Foamcow | Filed under: General | Tags: comedy, football, football football football football football, soccer, world cup | 1 Comment »

I think Mitchell and Webb got it about right.

How To Create a Facebook Style Password Field with jQuery

Posted: May 20th, 2010 | Author: Foamcow | Filed under: design, General, How to | Tags: code, forms, jquery, tip, tutorial | No Comments »

Note: This is a pretty old demo I made for someone on a forum somewhere. Since there is never one way to skin a cat I may well do it slightly differently if I did it today.

OK. Facebook, and probably many other sites, employ a method by which they put a form field’s label inside the field itself. This is no biggie, and quite easy to accomplish but what about password fields. By default, in every browser I can think of, the password field type is masked – that is to say the characters you enter are hidden by asterisks or bullet points. This presents a problem since if you shift your label into the field it will be masked.

The solution, therefore, is to change the fieldtype to a plain text field before putting the label into it, then switching to a password field when the user enters something.

Why can’t you just make it a plain text field to start with?

For users that are browsing with agents that don’t use Javascript or those that have just blocked it, the password field must still be a password field – so it has to start out that way and be changed by Javascript.

Where my method beats Facebook’s is that if you empty the password field and leave it, the label is restored. Facebook’s effort leaves it blank.

The Code

Let’s start with a simple login form.

<form action="#" method="get" accept-charset="utf-8">
	<p><label>Password</label><input type="password" name="password" id="password" /<p>

	<p><<input type="submit" value="Continue"></p><
</form>

There, told you it was simple.

Now a little sprinking of jQuery. (of course you’ve already included the jQuery library)

$(function(){

	// first we remove label tags from dom
	$('#password').siblings('label').remove();

	// then we add a faux-label inside the field (there's a neater way to do this)
	$('#password').replaceWith('<input type="text" name="password" id="password" value="Password" />');

    // capture the initial click and bind a custom function to it
    $('#password').bind('click',fieldcheck);

	function fieldcheck(el){
		if($(this).attr('type')=='text'){
			$(this).val('');
			$(this).replaceWith('<input type="password" name="password" id="password" />')
			$('#password').focus();
			$('#password').bind('blur',fieldcheck);

		}

		if($(this).attr('type')=='password'){
			if($(this).val()==''){
				$('#password').replaceWith('<input type="text" name="password" id="password" value="Password" />');
				$('#password').bind('click',fieldcheck);
			}
		}
	}

});

And there you have it. A neat, degradeable and, I hope, accessible method to tidy up a password field.

There are a few ways you could improve or expand this, the obvious being to create the text field and faux-label dynamically rather than hardcoding it as I have done for this example.

Lovely lock design

Posted: May 6th, 2010 | Author: Foamcow | Filed under: General | Tags: clever, design, lock, simple. | No Comments »

You can sometimes tell great design because it is blindingly obvious, simple yet clever and will make you say “ah yes, of course!”

I should add, this is nothing to do with me. I saw a link to it pop up on Twitter but there is no other information such as who designed it.