Echo websocket server using websocketd – as if by magic!

I stum­bled across this lit­tle gem the oth­er day – web­sock­etd – which turns any­thing that takes stan­­dard-in and stan­­dard-out into a web­sock­et serv­er! To build a dead sim­ple echo serv­er, fol­low these steps: fol­low the down­load instruc­tions here (don’t for­get to add it to your PATH) cre­ate a new con­sole appli­ca­tion in Visu­al Stu­dio …

Echo web­sock­et serv­er using web­sock­etd – as if by mag­ic!Read More »

Having fun with HTML5 – Simple painting app using Canvas

It feels like a lit­tle while since I last played around with the <can­vas> ele­ment, so I spent some time over the week­end and put togeth­er a sim­ple paint­ing app using the can­vas and here is the end result. Here’s some screen­shots:    Spray Tool One of the inter­est­ing things with this sim­ple paint­ing app …

Hav­ing fun with HTML5 – Sim­ple paint­ing app using Can­vasRead More »

Test your maths skills at the MathDOJO!

Anoth­er pro­duc­tive week­end bares fruit for anoth­er mini game! This time I’ve put togeth­er a dojo-themed mini game whose sole pur­pose is to test your abil­i­ty to do sim­ple (well, most­ly) arith­metic cal­cu­la­tions in your head and your tol­er­ance for my sense of humour (which is not so bad I hope ;-) ). Screen­shots Here’s …

Test your maths skills at the Math­DO­JO!Read More »

Creating a sticky note app with HTML5, CSS3 and Javascript

I saw this tuto­r­i­al the oth­er day, it’s cool but I fan­cied tak­ing it a step fur­ther and make it use­ful as an app rather than just a fan­cy way to show some struc­tured data on the screen. Here’s a list of the fea­tures which I want­ed to add: being able to edit the title …

Cre­at­ing a sticky note app with HTML5, CSS3 and JavascriptRead More »

Having fun with HTML5 — Canvas, part 5

In part 4, I put togeth­er the foun­da­tions for a mini shoot­ing game, with tar­gets mov­ing on the screen and you can ‘hit’ them by click­ing inside the tar­gets, etc. etc. I promised an update to make it feel more like a game, so here it is! Adding a back­ground The black back­ground was more …

Hav­ing fun with HTML5 — Can­vas, part 5Read More »

Having fun with HTML5 — Canvas, part 4

Fol­low­ing on from part 3 where we basi­cal­ly made a lit­tle app that lets you scrib­ble with HTML5’s can­vas ele­ment, let us push on and see what else we can achieve with the can­vas ele­ment. The log­i­cal next step would be to made ani­ma­tions, and give you a way to inter­act with the ani­ma­tion. So …

Hav­ing fun with HTML5 — Can­vas, part 4Read More »

Having fun with HTML5 — Canvas, part 3

Fol­low­ing on from part 2 where I wrote a sim­ple page with a can­vas area where you can scrib­ble, I thought I’d add a cou­ple of new fea­tures: abil­i­ty to show the image as PNG image so user can save it change the line cap change the line join change the shad­ow set­tings (colour, off­set, …

Hav­ing fun with HTML5 — Can­vas, part 3Read More »

Having fun with HTML5 — Canvas, part 2

Ear­li­er I explored some of the basic draw­ing meth­ods avail­able on the 2D con­text of the new can­vas ele­ment in HTML5, mov­ing on from there, I’ve put togeth­er anoth­er quick demo here (see image below) which lets the user scrib­ble inside the can­vas ele­ment. HTML The HTML for the page is sim­ple enough, the key …

Hav­ing fun with HTML5 — Can­vas, part 2Read More »

Having fun with HTML5 — Canvas, part 1

One of the cool new fea­tures intro­duced by HTML5 is the new <can­vas> tag, which defines an area for you to draw graph­ics on using javascript. Basics To cre­ate a can­vas ele­ment is as easy as insert­ing a <can­vas> tag like this: Typ­i­cal­ly you will give it an ID as you will need to look …

Hav­ing fun with HTML5 — Can­vas, part 1Read More »

Having fun with HTML5 — contenteditable attribute

As I go through the HTML5 spec, I find some use­ful new fea­ture just about every­where, and the new con­tente­d­itable attribute is cer­tain­ly one of those. It’s sup­port­ed by most ele­ments and pro­vides a sim­ple and yet effec­tive way for you to allow the users to edit user con­tents (blog posts for instance) inline as …

Hav­ing fun with HTML5 — con­tente­d­itable attributeRead More »

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.