Javascript

The past two weeks haven’t really left time to compile my selected links, though there have been many. A few days at SxSWi (on which more, later) followed by travelling with the family and the inevitable work backlog moved blogging way down the priority list. So here’s a mammoth selection to get me caught up. Particularly interesting has been the discussion around the future of newspapers (represented here by Clay Shirky, Steven Johnson and Russell Davies), which seem to have finally pushed beyond “how t ind a good business model for papers” to looking at where the real value for society lies and how we can preserve and extend that in a changing landscape. ...

According to wikipedia: In software engineering, a design pattern is a general repeatable solution to a commonly occurring problem in software design. A design pattern is not a finished design that can be transformed directly into code. It is a description or template for how to solve a problem that can be used in many different situations. Object-oriented design patterns typically show relationships and interactions between classes or objects, without specifying the final application classes or objects that are involved. Algorithms are not thought of as design patterns, since they solve computational problems rather than design problems. ...

As a rails developer most of my experience with javascript libraries has been with prototype and scriptaculous, but I’ve never been quite happy with them. The helper methods built into ActionView make simple tasks a breeze, and I’ve played with the UJS plugin to improve the separation of content and behaviour, but even then the weight of the libraries and the comparable simplicty of tasks like iteration offered by jQuery has always made the grass over there look quite a bit greener. ...

Spending a weekend in Chicago last month and looking for a non-starbucks coffee shop in the loop, I was frustrated to find that the otherwise very handy delocator.net didn’t have an option to limit a search to a radius of less than 5 miles or to plot a group of results on a map. We eventually gave up and went to one of the many Starbucks highly visible in our immediate vicinity. ...

There has been much jubilation since Google announced their javascript-based maps API yesterday. I’ve been playing with it a little and have updated the Grand Rapids WiFi google map to use the new API. The web pages produced this way are much more responsive than those using the old hacks, and it’ll be great to see what people produce now we have official support. I’m hoping to shortly release a new version of the WiFi site which allows search results to be plotted on a map (or viewed as a list as at present). Until then, this implementation remains ’experimental'. ...

For the past few weeks I’ve been meaning to play with myGmaps, and last night I finally got the opportunity. I’d introduced a map view to Grand Rapids WiFi a few months ago, but I’ve never been entirely satisfied with the map in use or the flexibility of the zoom, so I decided to explore what it would take to move that data onto a google map. Generating the required XML was very straightforward. Between this piece at Engadget and the tools at myGmaps it was very simple to add a new Smarty template to the site and get everything up and running. It’s a shame google didn’t go with some more standardised vocabularies (it would be wonderful to be able to pipe the existing RDF version of the site straight in), but at least the format is simple. ...

The first public fruit of my collaboration with The Image Shoppe has just launched in the form of a new site for Bazzani Associates. Anyone living close to downtown Grand Rapids will recognise the name Bazzani as they have been behind numerous high-profile building and renovation projects lately. I was particularly glad to be able to work with them because of their emphasis on sustainable building practices that go beyond ‘green building’ to look at the long term viability of the communities within which they are building. ...

The gallery script I posted about on Friday was a nice improvement on plain image switching, but didn’t quite have the elegance I was looking for, particularly when switching between images of different sizes. Yesterday, I managed to grab some time to play around with resizing images using javascript so as to produce a smoother transition. The effect is rather pleasing. It works by preloading each image shortly before it might be needed, and using the dimensions of the preloaded image to calculate increments to change the displayed image dimension by. After stepping through the resizing, we then switch the previous image to the background, change our container’s source to the new image, and fade it in. ...

Some months ago, through a long-forgotten source, I came across this technique for fading in images without using flash and I’ve been looking for an excuse to play around with such techniques. Today, work on a new page for Calvin gave me such an excuse. I wanted to use the technique within a javascript image gallery. I needed to be able to advance through a set of images and wanted to fade each in in turn. Since the images were named numerically, all it appeared to involve was a couple of javascript functions to increment or decrement a counter and update the photo accordingly. Because I’d be using the same image tag for all the images, I also tweaked the original’s functions to use a predefined object rather than making use of the DOM each time. ...

It was only a matter of time before libraries emerged to make use of XMLHTTPRequest increasingly transparent to web developers. Jesse Garrett’s coining of the term ‘AJAX’ (Asynchronous JavaScript + XML) seems to have quickly caught on, and last night Anil posted on ProNet about a PHP toolkit called SAJAX. SAJAX is a nice first generation library. It allows the developer to register functions in their PHP and then produces javascript to allow the resulting page to make use of those functions. It’s lightweight (146 lines) and easy to use. The key thing that’s missing at the moment are a couple of wrappers that would allow it to integrate with templating systems — the only output functions print the javascript directly. ...