DEfusion.org.uk

Update : JavaScript Image Cropper UI using Prototype v 1.2.2

Mon, 04 Jul 2011 19:28:08 +0000

Once again it’s been a long time since I released an update to the JavaScript Image Cropper UI, for reference v1.2.1 was released in 2009 and the previous version in 2006!

There was a comment recently basically saying that it “used to be great but is not supported as the last update was 2009”, which is quite far from the truth; as anyone who contacts me with a problem/question that I can replicate or help with can attest to. The long times between updates with the cropper are purely because the script is stable (thanks in no small part to building on top of stable & well maintained libraries) and continues to work for people who download it and I haven’t had reports of any issues that would require a new general release.

However I have received information from a few people noting that they were having some issues in IE9. Not having that at hand to test I could only go on the few 3rd party reports I had, but now I’ve managed to test in IE9 and have ensured all the examples work. This only required updating to the latest versions of prototype & script.aculo.us and no other changes.

So the 1.2.2 release contains no new code, only updated examples & the IE9 support notice (that you’ll probably need the latest versions of the libs for it to work). This post is more for the “I/its not dead” message.

Shrinking large background image bug in iPhone Safari

Fri, 19 Feb 2010 18:03:36 +0000

Updated: 22nd Feb 2010
I experienced a slightly odd bug in the latest version of mobile Safari on iPhone where it was shrinking large background images applied via CSS to fit within the confines of the screen. Not finding anyone else who has written about this problem I thought I’d share my findings.

Firstly a bit of background, the company I am working for at the moment recently released a real-time CSS editor (of sorts) which I built that allows customers to style their sites using nothing more than uploaded images and some UI controls - for more details on that you can see a video of it in action on this blog post and some of the amazing results that customers have been able to achieve with it.

Yesterday one customer reported an issue where a large background image (1800x2520) was being shrunk on the iPhone. I did quite a lot of investigation and to cut a long-ish story short I discovered that there is a tipping point where the total pixel-area of an image causes mobile Safari to resize the image. This tipping point appears to be at 2,000,001 pixels.

Read on for a bit more of a breakdown of my experiment results.

To debug this issue I looked at the pixel size of some of our larger background images that were working fine on the iPhone and then tried various sizes to see what the results were. My experiments are shown in the table below (in the order I performed them).

Width	Height	Pixel area	iPhone shrinks background
1400	1200	1,680,000	No
1200	1600	1,920,000	No
1200	1800	2,160,000	Yes
1200	1700	2,004,000	Yes
1200	1650	1,980,000	No
1200	1675	2,201,000	Yes
1200	1666	1,999,200	No
1666	1200	1,999,200	No
1667	1200	2,000,400	Yes
500	4000	2,000,000	No
500	4001	2,000,500	Yes

There were further tests in between but I won’t list them all for your sanity but my tests seems to say that it didn’t matter on the width or the height of the image just the total pixel area. E.g. a very wide image < 2,000,001 works just as a very high image does. At 2,000,001 pixels or larger they get shrunk. Note I didn’t get it right down to 2,000,001 pixels and this is just an educated guess that it is the actual tipping point. I’m going to submit this as a bug to Apple I’m not sure what is causing this but another guess of mine is that 2,000,000 is the maximum area that the renderer will handle/cache (you can see this in effect when you scroll around on mobile Safari how it re-draws the page) and so is getting enforced on the background image some how.

Update: 22nd Feb 2010

It seems I should have RTFMed. Apple got back to me with regards to the bug and pointed me at the Known iPhone OS Resource Limits in the Safari Web Content Guide which says:

The maximum size for decoded GIF, PNG, and TIFF images is 3 megapixels. That is, ensure that width * height <= 3 * 1024 * 1024. Note that the decoded size is far larger than the encoded size of an image.

The maximum decoded image size for JPEG is 32 megapixels using subsampling. JPEG images can be up to 32 megapixels due to subsampling, which allows JPEG images to decode to a size that has one sixteenth the number of pixels JPEG images larger than 2 megapixels are subsampled ”that is, decoded to a reduced size. JPEG subsampling allows the user to view images from the latest digital cameras.

Emphasis added.

No IE For You!

Sun, 01 Nov 2009 22:45:06 +0000

The title of this post was going to be:

If Microsoft Insist On Making It Nigh-on Impossible For Us To Test IE Effectively Then Why Do They Think We Should Bother Supporting It?

But I decided that was a bit too long, so I took inspiration from the soup kitchen chef instead, it’s more to the point.

Anyway the reason I’m back writing about adventures in IE testing land is I have a week of some horrid IE browser testing of my current, JavaScript heavy, project coming up if the first quick check through all versions of IE is anything to go by. Yes I know I should have been testing as I went along, but having to refresh 9 browsers with every change really kills my buzz (especially when 3 of those are IE).

So I did some initial browser testing last week and got zero issues in 6 browsers, but each version of IE threw up massive amounts of JavaScript errors – absolutely all over the place – and we all know how annoying debugging JS is in IE. This combined with my aging (and decidedly creaky) Windows XP Virtual Machine (running in Parallels on a Mac Pro with more than enough grunt to run multiple VM’s all at once) meant that tonight I decided to look for new alternatives (as multiple versions of IE on a single VM have never been great anyway).

So single VM images (as light and quick as possible) was my plan and I started to do some research, and found the following:

Microsoft handily supply a bevvy of Internet Explorer Application Compatibility VPC Image’s exactly for this situation. Score 1 Microsoft!
These are Virtual PC images, which is only available for Windows… but I found these instructions for converting them to run with either VMWare Fusion or VirtualBox. Score 1 Mac and the sweet, sweet people on the Internet

So I’m all set right? The steps aren’t that difficult and I choose to try VirtualBox as

I’ve tried VMWare Fusion before and wasn’t that keen.
I know that VMWare won’t run at the same time as parallels. A big minus there.
I’ve wanted to try VirtualBox for a while.

I do a few downloads, the conversion stuff and within the hour I have VirtualBox booting the image. It boots quickly and it’s nippy, I assume they’ve stripped Windows down to the bare bones with just enough to run IE properly - which is what I was going to try and do anyway. Windows says something about having to re-activate so I try, that fails but says I have 3 days so I figure that has to be due to the last step I haven’t completed, which I then do and reboot. Only to get the following:

WGA prompt
Follow instructions
Fail
Repeat steps 1 to 3 a couple more times
Search Google and find out that they’ve gone and restricted it to running in Virtual PC only. Microsoft FAIL. It’s in the EULA so I should have noticed it… Like I’m going to read every EULA put in front of my face.

Peter L who is the “Product Manager, Internet Explorer, Developer Division” has the following month and a half old update:

I've spent some time investigating this issue, and now understand that the VPC images used to work on other hosting environments, but with the latest release, don't any more. We have a better understanding of the issue now, and while we're looking for a solution, we don't have one right now. If you're using the VPC's, and they don't work any more, I encourage you to email me, with your name, how you're using them and the hosting environment that you're using.

I’ll drop him an email but I don’t expect to get a resolution any time soon.

So a couple of hours of work and I’m back to square one, the only positive thing I can take from this is VirtualBox seems quite fast and neither it nor Parallels have complained about the other. So I might try converting my Dev VM’s and setting up a new Multi-IE Windows VM on there.

But the big thing I take from this is that Microsoft don’t want you to play with them if you don’t own a Microsoft football. I quite honestly would be quite happy to do that, to never have to open IE again would suit me fine.

Unfortunately that would also mean commercial suicide for a web developer who works on public facing sites.

Update : JavaScript Image Cropper UI using Prototype v 1.2.1

Tue, 06 Oct 2009 19:45:16 +0000

It’s been a long time since I released an update to the JavaScript Image Cropper UI (for reference v1.2.0 was released on 30th Oct 2006!).

However it is still going strong and a couple of things prompted me to release this update to bring it to v1.2.1.

The first thing was Tom Hirashima ~~(sorry Tom, wasn’t sure if you have a site you want me to link to)~~ sent me an email last week with an update to the code to allow it to work with the latest versions of Prototype & script.aculo.us out of the box (1.6.1.0 & 1.8.2 respectively). Although the last time I tried the cropper with the latest versions of them both it worked fine, you just had to change the bundles that script.aculo.us included, Tom has made some further changes. This is a good thing as for the past couple of years I’ve pretty much been out of the prototype & script.aculo.us loop having moved to MooTools and now jQuery (which I hated at first, but that’s another story).

The second thing was that the cropper was mentioned (and my how old does this site design look to me now) in the latest (and as usual excellent) Railscast, Cropping Images.

As a part of integrating Tom’s changes I decided to tackle a load of bugs from the bug list to try and reduce the list so I can keep on top of it better going forward (a long list of open bugs is never conducive to getting any of them fixed).

Here’s a full list of the changes:

Added support for latest versions of Prototype & script.aculo.us (1.6.1.0 & 1.8.2 respectively). Changes provided by Tom Hirashima.
No-longer package prototype & script.aculo.us with the release
Changed tests to use google ajax libraries API to load prototype & script.aculo.us
Added option to not auto include the cropper CSS file
#00008 - Fixed bug: Dynamic include of cropper CSS expected cropper.js and failed when using cropper.uncompressed.js
#00028 - Fixed bug: Doesn’t work with latest script.aculo.us - Fix by Tom Hirashima
#00030 - Fixed bug: Doesn’t work in Firefox 3.5 (CSS include issue)
#00007 - Fixed bug: onEndCrop isn’t called when moving with keys
#00011 - Fixed bug: The image that is to be cropped does not show in IE6.0 – included CSS fix
Tidied up source code & fixed issues that jslint found so it will compress better

Finally as usual, please use the bug reporting link or discussion list mentioned on JavaScript Image Cropper UI code page rather than leaving comments to report bugs.

Head over to the JavaScript Image Cropper UI code page for download and documentation.

Where to Start With, open to all & new feature

Mon, 13 Jul 2009 21:16:07 +0000

Just a very quick post to let you all know that my community-driven music recommendation site Where to Start With has just left private beta. Not only that but we have launched what we think is a killer new feature, there is a lot more detail (and a screencast) in the blog post over at our Where to Start With blog.

Introducing: My New F1-Focused Site F1Heat.com

Mon, 23 Mar 2009 01:07:08 +0000

I have been thinking about writing articles on F1 on my here for quite a while, as I have found myself getting more and more interested by the sport (as of writing it is currently less 4 days, 1 hour and around 10 minutes before the start of the 2009 season and I can’t wait!) and getting more involved on F1 sites, with comments etc. I have also started to notice that in quite a lot of places that I would like to write more than short comments (I don’t like to read essays in comments, so I try not to leave them too) but also I feel that I have more to add with original articles of my own.

So I’m going to give it a whirl, it might be rubbish - but lets hope not.

However instead of posting on this site under an F1 category I decided to start a new site entirely dedicated to my F1 musings, to keep it separate from all the techy stuff I write here, so behold F1heat.com.

Introducing: Wheretostartwith.com – Community Powered Music Recommendations

Fri, 06 Mar 2009 18:52:38 +0000

I’d like to introduce to you my brand new site Where to Start With, which I have been working on in my spare time for a while (more on this in future posts).

The elevator pitch for Where to Start With goes like this:

Where to Start With helps you when you’re trying out new bands and artists by providing community-powered recommendations written by die hard fans.

If that new band you want to try has 10 CD’s out, then Where to Start With will give youâ€¦ well, where to start with them!

The whole idea behind this site came from a need me and my friend found ourselves having; many times we would hear a song or read about a band that sounded interesting but then when we did go to try that band we would find they had a handful of releases out already. Where is the best place to start with them? Traditionally unless you got a specific recommendation for an album you would just try the lucky dip approach and hope you found a winner. If you got lucky you might have just found your new favourite band, however if you picked a rotten egg you may dismiss your potential new favourite band based on your opinion of one of their poorer releases.

A personal example was when I was recommended to listen to Porcupine Tree and given one song to try. That song was awesome, however Porcupine Tree have a massive back-catalogue (9 albums, 6 live/compilation albums and 4 EPs) and from trying a few releases out I found that they are very diverse and I still haven’t managed to get into them, although from that initial song I really wish I could. What I really needed was a guide to tell me where to actually start with Porcupine Tree, for example something that said “for starting out with Porcupine Tree what you really need to buy first is their album X”.

This is how Where to Start With was born and also basically how it works – each band or artist will have an article about them which gives a short history/description of the band and each of their main releases (e.g. Albums & E.P.’s) with a little description. Any user can add these articles and each article is in the wiki-style, e.g. anyone can edit the descriptions to add new information and fix mistakes etc.

The real core of the site comes into play w_hen people start adding their opinions_ on artists, once again anyone can do this, but it is better for people who are currently fans of the artist to add their opinion. Each opinion includes a rating, a recommendation (more on those later) and a personal comment on each of the albums for the artist. We then take these opinions and produce an article that gives you recommendations on where to start with the artist, what to try after that and even sometimes what to avoid.

What makes this different to other sites?

Well, whereas other sites, software and services may give you reviews, the most popular or most listened to albums those may not necessarily be the best releases to start off with a new artist.

For instance Reefs debut album “Replenish” is absolutely amazing and one of my all time favourite albums, however pretty much anyone interested in starting with Reef would be best advised to start with their second album “Glow”, which is much more accessible in general. Another clear example would be Nirvana, I personally hardly ever listen to Nirvana’s “Nevermind” album any more (as I know all of Nirvana’s albums inside and out, every cough and guitar string noise included) and I would rate “In Utero” as my favourite album however “Nevermind” obviously would be the album I would recommend anyone new to Nirvana should start out with.

But going further than that after you have tried the “essential” release Where to Start With helps you with which release to follow the essential release with, a wildcard album and even sometimes what to avoid - these can be really difficult to determine from the other methods.

About the recommendations.

Each Where to Start With article can have the following recommendations for each release to help guide you:

Essential: The the first release to try, the best introduction to the artist.
Follow with: The next release to try after the essential release.
Also recommended: Another good release to try.
Wildcard: A release that may not be “the norm” for the artist but still could be interesting. If you try the essential release and weren’t so keen this should be different enough to be worth a try.
Avoid: Yes, some users will also tell you what to avoid.

The votes of each person on each release are added up to ensure that each article has one of each of the above recommendations (where applicable) and the more opinions that are added the better the recommendations become. You also have access to personal comments of each person who gave their opinion to give you a better insight into why they voted how they voted. And finally, just in case there is a close call between releases you can also see the breakdown of the votes for each release.

Sounds great, how do I get started?

Well we’re currently in private beta and have been running with a small handful of users for the past couple of weeks but are accepting applications to the beta and adding new users on a daily basis. The reason we’re currently in private beta is to ensure that the platform is solid and discover any issues, we’re not sure how long this will take but we obviously want to be out of beta as soon as possible. We also have setup a dedicated blog for Where to Start With which you can follow if you want to be kept up to date with progress of the beta and other new things (as we’re not finished adding features yet).

It’s working for me already!

Even with the small handful of users in the initial phase of the private beta I’ve already found one new band who I would have probably a) never heard of and b) not known where to start with without the site. There is more on this in the post It’s working for us on our blog.

So give it a whirl, and do get in touch to give us your thoughts etc.

A Nice Rebuttal To The Hulu Situation

Fri, 20 Feb 2009 00:46:02 +0000

Just to get you up to speed if you don’t know what Hulu is and what situation is before I get to the rebuttal I found today:

Hulu is a (US only) website which allows you to stream TV shows (in pretty good quality) to your computer via Flash, it has deals with some of the major US TV companies and has shows added very shortly after they are originally aired and seem to stay available online for a long time (e.g. much more than the 7 days you get with the iPlayer). You get very few advert interruptions, roughly 4 or 5 for a program that would run an hour on TV, and the adverts generally only last around 15 seconds or so, aiming to take the amount of time that you would normally spend fast forwarding through 3+ minutes worth of adverts if you recorded a program on your PVR.

It really is a top-notch user experience and it is the kind of thing that could really take off big, and from what I’ve seen of other services is the closest thing in to my In an ideal world thoughts when I wrote about the BBC iPlayer over a year ago.

boxee is a wonderful-looking piece of media centre software (which by the way is going to be running on my next media centre when I get round to doing that) that not only allows you to play media on your machine or from DVD’s etc. but also connects to some popular TV streaming websites – such as the BBC iPlayer, Hulu and more.

The “situation” is that Hulu has been forced by the content providers to not support boxee any more, their blog post on the situation and boxee’s thoughts on the situation are both well worth reading (basic I think they both boil down to neither party, Hulu & boxee, wanted this to happen but the TV companies forced the issue).

So that’s the situation, and it has not being received very well (see the 400+ comments on the boxee blog for a start).

I personally don’t understand it, I assume that the TV companies don’t pay Hulu to support their distribution costs - so it probably costs them next to nothing – but will probably be currently providing them less revenue than traditional broadcasting. However why they see a difference between using a piece of software to make getting TV programs onto your TV a little bit easier than using a browser on the same machine really makes no sense.

This is the kind of thing that leads people to fall back to other almost-as-frictionless means of getting the same content we currently have available, which of course currently means torrents. And that is what the rebuttal on lifehacker basically says and shows you what to do if you were so inclined.

My guess is this whole situtation thing is because the media companies are currently doing deals with set-top box companies to make hardware to do the same thing as the boxee/hulu combination, but obviously with more control, more revenue for them and probably more adverts, more restrictions and a less polished user experience.

Quick Link: Dead simple task scheduling in Rails

Sat, 14 Feb 2009 11:23:04 +0000

I’ve just come across this post on dead simple task scheduling in Rails by the guys at intridea. It looks like a really nifty way to setup scheduled tasks in your Rails app, previously I had my tasks in rake files which I would then hit with cron.

While that is working perfectly adequately for my current setup it does have one downside, when I setup a new server I will have to setup the crontab file too. With this method when I deploy my app my scheduled tasks would get deployed and be running out of the box. Nice.

Customer Satisfaction Tip From The Dentist – Empathise with your customers situation

Fri, 13 Feb 2009 18:38:29 +0000

Yesterday I went for a root canal. I wasn’t entirely sure what the process involved and somewhere in the past I had gotten it into my head that a root canal could possibly be quite unpleasant. However I have never really had much of a problem with going to the dentist or having work done on my teeth so I wasn’t worried (much), but I can imagine that others might not be so lucky.

I had been referred to a dentist that specialises in doing root canals, so this was my first visit to this dentist and he did a few things that showed he really empathised with his customer.

When I arrived one of the first things that the receptionist asked me to do was to pick a music CD from a list of 100, which seemed a little strange but I didn’t ask any questions.

What the dentist did when I entered his room really showed me that he empathised with people who had to undergo this (hour long) treatment. It included the following:

He spent about 5 minutes explaining the procedure in detail with me, explaining what each step would entail and what the goals of each step were and answered any questions clearly.
When he was giving me the injection to numb my mouth he gave me extra just to make sure - as my tooth had been causing me some pain before hand.
And here’s the big one. As I couldn’t do anything for the hour I was there, except sit still, the music “CD” I’d chosen from the list turned out to actually be a music DVD which he played on a plasma screen on the ceiling directly above me.

How considerate is that? Now I couldn’t hear it all the time, but most of the time I could, and in any case it gave me something to help pass the time and to think about/concentrate on during the hour I couldn’t do or say anything. If I’d know that’s what the choice of music was for I’d have spent a little longer looking at the list.

I don’t know if other dentists do this, as I have been with my dentist my entire life, or if this one came up with it all by himself, but either way it shows that he empathised with the customer and their situation by doing a few small things that made the process easier for me (and in turn probably easier on him too).