Saturday, February 26, 2011

We'll be extending an Ext.Panel object from Sencha Touch to create an iPad signature pad. When you click submit it will tie in to the server-side PHP script in this post. It works pretty well, though there are many ways that it could be enhanced.

This and the next post will demonstrate how to draw on a canvas and then save the file on a server using PHP. Here is the very simple server side code:

The next post will be the slightly more complicated front-end code. This was particularly designed for a Sencha Touch iPad app that will allow people to sign with their finger. It has some flaws, but the basics are pretty reusable and good!

Tuesday, February 8, 2011

While looking at this awesome list of browser support for EcmaScript 5 features. I decided to time the difference between using Date.now(), a static method to access the current timestamp, and new Date().getTime(), the previous way to get a current timestamp in JavasScript.

Saturday, February 5, 2011

So I'm working on this really sweet HTML5 monster game, where you get to draw your own 8-bit style monsters and fight them against one another. So far I've only got a tiny bit of the monster creation part up and running. Don't worry I'll throw the whole thing up on on github when I'm done.

Anyway, one of the problems I ran into with the canvas was how to keep people's drawings within the predefined lines. The canvas is 500px wide and it's a 20x20 square of 25px blocks.

That will draw some simple lines every 25px. Now how about keeping between the lines. It's simple. We just need to round our x, y to the nearest 25px, like so, that way it will always start inside one of our blocks. Then we'll actually be drawing 24px blocks to fit inside the lines completely.

Tuesday, February 1, 2011

iScroll is pretty neat. It was created by cubiq as an attempt to create a workaround for position: fixed on iOS. Sencha Touch has a much more complete solution, but as a simple solution iScroll works fairly well.

This could be a great time to rant about how mobile safari is the new IE6, and how having to use JavaScript to fix issues that have already been fixed on the web for a long time is ridiculous. (Seriously, just let position: fixed work as long as the viewport and zoom-levels are set properly.)

And it all seems pretty good with one additional problem. It seems that the screen gets nudged down just a little bit when you select things, so I had to add this one bit of JavaScript to bring it back to the top after the we choose our item from the select box.