Kenneth's Picnic

I’ve just submitted my Chrome Experiment – JavaScript Fireworks.
http://js-fireworks.appspot.com/

This amuses me because it’s such an old-fashioned idea. A bit like snow on your website, it’s a very nineties theme and I suspect I’ll have a lot of ex-Geocities users asking me how to include it on their pages.

I’m particularly pleased with the TinyURL inclusion, just for the hell of it And I look forward to tracking the messages via Google Analytics.

It’s no revolution (some of those experiments are awesome), and it’s not very Chrome-specific. Firefox handles the canvas better now, and Safari is very fast. Should I use excanvas to support IE???
Anyways, I’m pleased with the effect.

Update (12 May 2009):
No response so far (snif). I saw some hits from California, and one message sent saying “Not Your Mother’s JavaScript” – which is the experiments’ tagline. Fingers still crossed.

Update (13 May 2009):
Some quick updates: IE support! Really shows off the awesome excanvas library. But it’s a bit slow. I’ve intentionally not reduced the activity in IE to show the performance difference. Also, changed the default message.
Also, allowed click events to bring up the window, so it’s a bit more useable.

Update (16 May 2009):

Added various controls to experiment with. Time and gravity controls are fun. Toyed with framerate and number of sparks sliders, but didn’t work out.

Update (21 May 2009):

Added credit for the font, which was a free font, BM Receipt, passed through Cufon Generator to get each point as a JavaScript array, then stripped back to remove the lines, leaving just the points.

I’ve been writing a JavaScript Mindmap.
It’s not finished, it’s not pretty.
But the code is there.
It’s also got very few dependancies: Mootools is used for dragging and the $ and $$ shortcuts. Also, excanvas gives IE canvas support.
I tried to make it use “good juju”, by using good semantics. Therefore, it just builds out HTML lists.

And it’s fairly easy to see how it works.

Not sure what to call it. Called it Mindmap, called it spidermap, called it js-mindmap again.
http://code.google.com/p/js-mindmap 

Demo:
http://kenneth.kufluk.com/google/js-mindmap/ 

Check it out. Suggest improvements. Bleat about bugs. Put me down for my poor coding styles. Or otherwise ignore it

Ok, what we learnt last night:

If you move your SWF onto another server (eg, using a caching server, CDN or similar), and have JavaScript in the page calling the SWF, then it will fail.

First step, we added a crossdomain.xml to the CDN server.  It made no difference, and was not requested by the SWF anyway.
Useful fact:  you can see flash requesting crossdomain.xml in Firebug.

Second step, we added “System.security.allowDomain(“http://www.xyz.com”)” to the Flash.
Useful fact:  check the “content-length” in the response headers to see when the new file has been deployed – it took more effort to deploy than expected, and this was a lifesaver as we nearly dismissed this option.

The second step worked.

Useful fact:  even though the JS files were served from the CDN too, they were executed within the page, and so were executing on a different domain to the Flash.

Useful fact:  SWFLiveconnect was irrelevant.  We already had set allowScriptAccess to always in the params.  We used ExternalInterface to make the function calls available to the JS.

Useful fact:  The Adobe docs refer to the method as HTML->SWF, not JavaScript->SWF.

Useful fact:  we tracked the problem to a definite JS->SWF issue using breakpoints in the JS using Firebug.  Brilliant.  The JS call to the Flash returned nothing – it failed silently, but stopped the function.  Correct behaviours would have been to return “undefined” and continue to the next line.

Final note:  Someone who understands HTML, CSS, JS and Flash is not your weakest tech link.  They probably know the most about the many technologies on the Internet.  So, give them some days to test before you roll out something new like this.  The architects and Java guys won’t follow it – give the HTMLers the time, as they’re on the front line.

I’ve added planets and stars to my sky when the sun sets. Best thing is, these are technically accurate. The sun follows the correct path across the sky and sets at the right time. The sky shows the view facing South from London.

(more…)

This is something I’ve seen a long time ago, but never actually had the script for.  If you’ve got a slow process in your loop, for example:

for (var i=0;i<jedarray .length;i++) {
     reallySlowFunction("bob", "ted", fredObj, jedArray[i]);
}

You can just throw the function off to my function be executed in its own little time, and your loop can carry on.

for (var i=0;i<jedArray.length;i++) {
     setAsync(reallySlowFunction, ["bob", "ted", fredObj, jedArray[i]] );
}

Much faster! (more…)