Ed Silverton

Avoiding jqPlot Memory Leaks

I’ve run into some problems when re-plotting data in jqPlot where it’s creating huge memory leaks.

To get around this I’ve put my charts into a container div and when re-plotting I use:

$(‘.jqPlot’).remove();

which clears the charts from memory entirely.

I then recreate the chart divs like so:

$(‘#plotContainer’).append(‘<div class=”jqPlot”  id=”targetPlot” style=”height:320px; width:600px;”></div>’);
$(‘#plotContainer’).append(‘<div class=”jqPlot”  id=”controllerPlot” style=”margin-top: 30px; height:100px; width:600px;”></div>’);

and re-initialize the  plots with their new data:

targetPlot = $.jqplot(‘targetPlot’, [data],  {

Seems to do the trick :-)

How to make a repeating button with delay in jQuery

I couldn’t find an example of exactly what I wanted so I’ve made a simple jQuery plugin that turns a regular <button> into a repeat button.

http://jsfiddle.net/edsilv/xKm9K/

The key element being that you can specify how long to wait before repeating the specified action. Therefore allowing discrete clicks as well as click and hold behaviour.

:-)

Making Facebook controls with KnockoutJS (Part 2)

I’ve been working more on making a componentised Facebook control with KnockoutJS.

Whilst creating a control that could load and render wall posts was pretty straight-forward, enabling paging of that data proved more difficult!

After a bit of q&a on the KnockoutJS Google Group I arrived at this:

http://jsfiddle.net/edsilv/jQJ6y/

:-)

Thoughts on Tron Legacy and 3D Cinema

tron

I went to see Tron Legacy at the London IMAX on Saturday. My expectations were that like Avatar I’d experience a technically impressive spectacle that would ultimately leave me cold. Suffice to say it lived up to those (rather predictable) expectations, but it also made me think about the nature of 3D cinema as a whole.

I had a feeling that my sense of detachment was being caused by something more than the unfortunately thin plot/characters. It was something about the nature of 3D cinema itself.

I’ve heard that people sometimes get headaches when watching 3D movies.  I didn’t experience that, but it did somehow feel like watching it was more “work” than usual. I think I was struggling to accept the 3D world as “reality”. My brain was simultaneously accepting and rejecting the images it was receiving. I couldn’t completely “let go” as I would normally and enter a passive suspension of disbelief. Normally when watching a 2D movie the screen itself is part of the 3D reality of the cinema and crowd. With Tron it was like there were two 3D realities competing against each other.

In the 3D virtual simulation of our everyday lives that we like to call “reality” we get a continuous uninterrupted (except for sleep) stream of 3D from a single viewpoint (our eyes). Our brains are adapted to deal with this input and explain it to our conscious mind as a nice continuous story. However, a 3D movie consists of many different camera viewpoints which are constantly changing, “teleporting” us around the film set in a way that is completely at odds with our hard-coded model of reality. If you were playing a computer game like Quake and ran onto a teleporter pad you would expect to appear somewhere else and are mentally prepared for it. If you were to be randomly teleported around the game level without warning it would be disorientating.

This is what I think was going on when watching Tron. I think if somehow I was aware that I was about to be “teleported” it would cushion the experience psychologically. Also, if the 3D visuals were to the exclusion of everything else in the outside world like those old fashioned clunky VR headsets I may not have felt like the two worlds were competing for my brain’s storytelling cycles.

In conclusion; I don’t think 3D works in the cinema but I do think it could work well in games. I think the viewer or perhaps more aptly “user” needs to be fully engaged in the experience in order to accept it as their new reality. Maybe we can look forward to being Jeff Bridges in a superior VR incarnation of Tron in cycles to come.

Making Facebook controls with KnockoutJS

I recently discovered KnockoutJS which is a JavaScript library that purports to “Simplify dynamic JavaScript UIs by applying the Model-View-ViewModel (MVVM) pattern”. This was interesting for me because I had experience of using the MVVM pattern in Silverlight apps and found it to be a good way to maintain separation of concerns.

A problem I’d been running into with JavaScript projects was that while being a huge fan of jQuery, it didn’t solve the problem of maintaining a clean logical separation of concerns. I’d tried coming up with my own home-baked (and admittedly relatively half-baked) solutions for this, but KnockoutJS seemed to be the answer I was waiting for.

I thought a good test for it would be to create two proof of concept “controls” (I’ll call them that but I essentially mean reusable encapsulated Html/JS files). The first would be a login control for logging in to Facebook, the second a simple feed control to display the contents of your wall. Both would make use of the Facebook Graph API.

To cut a long story short, here’s the Html page I ended up with to host these simple controls:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
      <title></title>
      <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
      <script type="text/javascript" src="js/jquery.tmpl.js"></script>
      <script type="text/javascript" src="js/knockout-1.1.2.js"></script>
      <script type="text/javascript" src="js/knockout.mapping.js"></script>
  </head>
  <body>
    <div id="fb-root"></div>
    <script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
    <script type="text/javascript" src="js/config.js"></script>
    <script type="text/javascript" src="js/knockout.fbLoginControl.js"></script>
    <script type="text/javascript" src="js/knockout.fbFeedControl.js"></script>

    <div id="fbLoginControl" data-bind="fbLoginControl: fbLoginControlViewModel"></div>
    <div id="fbFeedControl" data-bind="fbFeedControl: fbFeedControlViewModel"></div>
  </body>
</html>

I’ve wrapped all of this into a zip that you can download here. I’ve included the JS libraries instead of linking to the relevant CDN-hosted files because perhaps the hardest aspect of this experiment was getting the correct combination of script versions.

For it to work you need to open js/config.js and enter your Graph API key. You also need to make sure that the Web Site/Site Url property of your Facebook app is correctly set. Make sure you remember to include a trailing “/” at the end of the Url.

Rather than write a lengthy explanation of how it all works I’ll rely on your own powers of deduction as it’s not rocket science. And anyway, the documentation on the KnockoutJS site is exemplary. Please feel free to ask questions in the comments. :-)

One caveat: It works great in Chrome, Firefox and IE6, but there’s something going wrong in IE9 Beta.

download zip

Walkies for Neuroses

Perpetually ineffectual individuals have a schedule of appearing more exceptional by waxing intellectual.

Predictably despicable, a term I find applicable,
Concerning matters of the heart, or otherwise political.

Oh Brighton girl it is your lot, to scour sales of fading frocks,
And itemise into the stock, of your online vintage clothing shop.

Cancer teats and disco sweets and fizzy drinks for all.
Lets suck and sniff and drop and drink until we’re all consoled.
I long to be a child again, love unconditional.
Cancer teats and disco sweets and fizzy drinks for all.

You don’t smell well.
I’m being so unfeeling as to tell you that I’m reeling
Whenever scents so unappealing are expelled.

You don’t smell well.
Perhaps a change of diet, such as eating, have you tried it?
Or staying off the ciggies for a spell.

You don’t smell well.
Trying to apply some kind of masking floral find
Will only serve to emphasise the trace of stale.

You don’t smell well.
Accept these words as kindness and for both our sakes consign yourself
To a lifestyle more congruent with your health.

My thoughts on Brian Eno’s 77 Million Paintings at Fabrica

77 Million Paintings

This is (shamefully) the first time I’ve been to the Fabrica Gallery in Brighton. Eno’s name clearly provoked sufficient curiosity to finally lure me in.

I went with my good friend Jake Spicer. We entered into a dark and, characteristically for Eno, ambient-sounding room with what looked like a large digital stained glass window at the end. Fabrica commission installations specific to the space (a Regency church), so the window looked as if it belonged there.

Being the first in we had plenty of space and a sofa to sit on and look at this window. There was no question that we preferred to sit than stand, although we didn’t reflect on why at the time. Perhaps it’s the digital nature of the artwork that put us in a slouchy computer game state of mind. Or perhaps we sat just because we could.

I’m a gamer, and a particular fan of the Half Life series. After sitting for a while and chatting with Jake about what we thought about it I started to get a vague sense of finding it mildly unnerving. I mentioned this to Jake and soon realised why.

There’s this large “window”, presumably composed of multiple LCD screens arranged in a symmetrical pattern. The portal to Brian Eno’s mind perhaps?

Situated beneath it and to the left is a diamond-shaped box on a post emitting a light that gradually and almost imperceptibly changes colour. It looked very much to me like the “guardian of the portal”.

This sense is amplified by the two conic piles of dust/gravel in front of it. These are situated just within the area that the wooden floor of the gallery ends and the stone floored bounds of the artwork begin.

My gamer “spidey sense” was tingling that if I set foot inside that “forbidden zone” (perhaps to try and enter the mind of Brian Eno) the relaxing ambient music would become a piercing alarm. The diamond-shaped guardian would then swivel to face me and zap me into a third pile of dust.

Follow

Get every new post delivered to your Inbox.