iOS 4.3 Geolocation in web apps

Update: problem solved(ish)! See below...

Not again you Apple monsters! Last time it was multi touch that you decided to take from us, this time it's geolocation. Upgrading my iPhone 3GS to iOS4.3 caused a mobile web app I'm working on to start throwing errors. Danged if I can figure out why. Here's what I know so far...

Calling navigator.geolocation.getCurrentPosition in mobile safari works fine - returning a normal position object. However, when added to the home screen and run as fullscreen app (using the apple-mobile-web-app-capable meta tag) it would not ask for permission to access geo features, but immediately fail returning the error:

Permission error; The operation couldn't be completed. (kCLErrorDomain error 1.)

Looks like a permission error to my professional eye. But why? Dunno. I made this test app, called "Geoful". If you could have a go and report back I'd be most grateful.
Read on for more »

“Elastic social graph”

www.color.com was released yesterday to great fan-fare: primarily thanks to the news they had secured 41 million dollars in funding (not a typo) for an app that let's you take and share photos with other poeple (a typo) in the nearby area.

The idea is, you're at a party and take a photo - and everyone there "gets it" - so it's like a photo album of the event without having to do any manual sharing or organising.

I like the concept, but mostly because I thought of it. Ok, no, I didn't think of it: but some time ago I spent a bit of effort trying to convince some fellow nerds to implement something similar. Sure, it was focused on chat instead of photos - but had a photo-sharing aspect. Like a geo-located chat room: a real life Habbo where you could extend or shrink the circle you were interested in, "elastically".
Read on for more »

Long jQuery fades eats CPU

While doing a little refreshing around these parts I noticed that the "fading bubbles" that I have were chewing up a ridiculous amount of CPU when the page loaded. I had 15 or so bubbles rigged to fade in verrrrrry slowly - over 20 seconds - after window.onload fired. I thought I must have had some crazy infinite loop or some such, but no... after whittling things down I ended up creating this test page:

jQuery long fade test

If you open up Activity Monitor and click the "big fade" button, the screen will slowly fade in (to background colour #bada55, naturally) and your CPU will say bye-bye. Similarly, if you fade in a bunch of items over a long time you'll see a pretty serious drain too.

I haven't gone looking over on the mailing lists to see if this is a "known issue", or started digging into the source, 'cause I'm a lil' pressed for time at the moment - but if you found this page while googlin' to fix your fading woes, I feel your pain and will tell you to do what I shoulda done: use CSS transitions!

Finally, while checking I used the correct spelling of "whittling" I found this statement on the official whittling website:

Welcome to the world of whittling, a hobby for some, an obsession for others, a joy for all.

I'm a fan of whittling and all, but that just seems like a logical fallacy to me.

Choose your own cache.manifest

I love the HTML5 cache manifest functionality more than the internet itself. It lets me carry my crazy proof-of-concepts around in my pocket - offline - to test out on the train to-and-fro the way-to-work.

The way it works is you add a link to a "manifest" file in the HTML tag. The browser sees the link, reads the file, and uses the information in it to know what to cache. The actual manifest is just a plain text file containing the relative path to every file in the project.

You usually only have a handful of files and so you kid yourself that you can flawlessly create your CACHE.MANIFEST manually. The problem is - the tiniest of typos and it fails. And it always fails. Because of your chronic poor spelling.
Read on for more »

IE6 Final Countdown

Microsoft hates IE6 as much as the rest of us. So they've made yet another "let's finally get rid of IE6" website. All our hopes and prayers lie with them. As a bonus, they also supply some code to display a banner at the top of websites when a user has IE6:

<!--[if lt IE 7]>
  <div style=' clear: both; height: 59px; padding:0 0 0 15px; position: relative;'>
  <a href="http://www.microsoft.com/windows/internet-explorer/default.aspx"><img src="http://www.ie6countdown.com/images/upgrade.jpg" border="0" height="42" width="820" alt="" /></a></div>
 <![endif]-->

It's a simple conditional comment that targets browsers under IE7. After studying the code for a while I realised that it was ripe for a little "standards-based refactoring".

Future-proofing the code

It's a great effort by the Microsoft guys - but in the interests of the web-at-large I've tweaked the code slightly to be a bit more future-proof:

<!--[if IE]>
  <div style=' clear: both; height: 59px; padding:0 0 0 15px; position: relative;'>
  <a href="http://www.mozilla.com/en-US/firefox/"><img src="http://www.ie6countdown.com/images/upgrade.jpg" border="0" height="42" width="820" alt="" /></a></div>
 <![endif]-->

Post that in the body of your site, and you should be good to go. They didn't put the original code on Github, so I don't know who to send the pull request to, but hopefully they'll get my email and update it with the changes...