Scott Mebberson

Icon

Web Technologist

Custom Google Maps Icons

The ability to use custom Google Maps icons (the graphics that mark locations on a Google Map) has been around for a long time, but a feature that is rarely used.

You can use a custom icon to great affect, making your map ‘look and feel’ more like your brand. I’ve thrown together a quick example showing a custom icon on a Google Map.

After you’ve created your custom icon, it is relatively simply to define the custom icon:

// create the custom icon
var customIcon = new GIcon(G_DEFAULT_ICON);
customIcon.image = "wsimages/marker.png";
customIcon.iconSize = new GSize(109, 28);
customIcon.iconAnchor = new GPoint(30, 27);

and then use the custom icon:

var marker = new GMarker(point, {icon:customIcon});
map.addOverlay(marker);

Go and check it out, or download the example directly.

Filed under: google maps, technology, web 2.0

Sharing my snippets with snipt.org

I’m always looking for ways to improve my “Social Professional” online presence; and I’m going to be adding snipt.org to my toolkit.

Day to day I run a business and project manage RIA projects, but at heart, I’m a programmer. I keep a libraries of reusable code and a bunch of snippets; some of those snippets I use regularly and others are as close to genius as I’m going to get, so I keep them.

Other than my programming team at Enpresiv, my libraries and snippets largely remain private. Until now!
I’ve found a fantastic website that can manage my snippets and improve my online presence by automatically adding to my output streams on Twitter and my blog at WordPress.

snipt.org is kind of like delicious, only its for code snippets; and you can share your snippets in the ‘social collective’. It saves each of my snippets with their own URL, and sends that URL to my Twitter account as I create new ones.

You can also download Cloud Coder, a nifty little Adobe AIR application that integrates directly with the snipt.org API. Now all I need is direct TextMate integration like snipt.orgs competition Snipplr has.

Filed under: social networking, technology, web 2.0

TextInput two-way data binding

Well all love Flex’s data binding feature (despite some of the performance problems you can run into). But its so frustrating the humble TextInput component doesn’t support two-way data binding (like the DataGrid does). There are a number of ways to do it, but they all involve a fair bit of typing.

Today, I stumbled across what seems to be a very elegant solution for achieving two-way data binding using TextInput. Strictly, it isn’t data binding but rather, a clever response to built in events. It still achieves the same result, and probably does it with less memory overhead?

I can’t wait for Flex 4 and the two-way data binding shorthand!

Filed under: general

View Notifications: responding to Cairngorm Commands in the View

As I’ve previously mentioned, we’re in the early architecting stages of a Flex application and we’re being confronted with some key decisions to be made. I think some these might be useful so I’ll continue my Flex based posts during the project.

The basic premise of Cairngorm and the ModelLocator pattern is that each Command (responsible for retrieving data from the server via the ServiceLocator pattern) retrieves the data and then updates the Model with the new data. In turn, your Views can then respond to changes in the Model via Flex’s baked-in data binding. This is one of the most useful features of Cairngorm and makes it perfect for large scale Flex applications.

But what about the times when you don’t want the Command to change the Model? One of the downsides of the ModelLocator pattern is if you go sticking everything in the model, it will quickly become polluted.

There has been much discussion in the past about how to best deal with this situation:

This time around we chose Thomas Burleson’s View Notifications resolution. It seemed to make perfect sense, it was clean and easy to achieve.

After successfully implementing it (which really was simple), I can definitely recommend View Notifications as a means to respond to Commands directly within your Views!

It seems Thomas and the Universal Mind team are looking to formalise this and some of their other Cairngorm extensions.

Filed under: cairngorm, flash platform, flex

Implementing Lazy Loading via a Ghost

Many of our Flex applications contain a datagrid showing a large set of objects. It provides a central point in an interface for users to sort and filter the larger set of data with little effort on our behalf because the datagrid control is so feature rich (i.e. good value for money, or ROI).

Datagrids are also very handy for showing only a limited number of object properties until the user selects a record, generally resulting in a detailed view showing more or all object properties.

You need to be careful however, ensuring you avoid common pitfalls such as loading large data sets all at once, using up more memory than you need to causing the application to feel sluggish and slow.

A fantastic approach to avoiding these situations is to use the Lazy Loading design pattern via a Ghost.

Lazy Loading is the practice of deferring initialisation of an object until the last minute (or the point it is actually required). Using the Ghost implementation of Lazy Loading allows you to load an object in a partial state; or put simply, load only a subset of the objects properties until all of them are required.

The properties you would load initially are those you want to display in the datagrid, and the rest could be loaded and injected into the appropriate object once selected in the datagrid and the detail view appears.

Filed under: flash platform, flex

Editing VOs in the model?

We’re working on a Flex application at work, using Cairngorm, and we’re in the early architecting stages of the project.

We have a datagrid showing a list of clients (an ArrayCollection containing ClientVOs, which lives in model.clients).

We need to provide the functionality to edit a ClientVO, and save the data back to the database. When constructing the edit view we had to decide to either pass the ClientVO to the view by reference or to pass the ClientVO to the view by value.

The events we had to manage when exiting from the ClientVO edit view where:

  • Save. Save the ClientVO to the database, but do not exit the edit view.
  • Done. Save the ClientVO to the database and exit the edit view.
  • Cancel. Exit the edit view and discard any changes.

The Cancel event basically forced us to pass the ClientVO to the view by value, which gives you great flexibility on editing a local (to the edit view) version of the ClientVO.

However, it does mean you need to force the edited ClientVO back into model.clients (so that the datagrid contains the new values) at the correct index, effectively replacing the old version of the ClientVO and not an unrelated ClientVO.

I’m not sure if there is a Design Pattern that supports this, or demonstrates how to handle this better.

Filed under: cairngorm, flash platform, flex

Google Chrome on the Mac

I’m a big fan of new. I love new gadgets. I love new technology. Basically, if its new, I’m keen. As such, I’ve been hanging out for Google to release Chrome on the Mac ever since it has been released. I do have Chrome running on XP VM, but its not the same and I rarely fire-up VM.

Having been away for the office for a while, I Googled for any developments on Chrome for Mac. While I didn’t find exactly what I was looking for, I did stumble across Crossover Chromium!

Even though its not the same as the Mac version of Chrome that Google are working on, at least its something. It doesn’t look so great (it still contains the Windows-based chrome), but should prove useful for browser testing; and besides, it’s all us Mac users have at the moment.

Filed under: technology, web 2.0

About Me

I'm a web technologist living and working in Adelaide, Australia.

My Tweets

Navigation

My Older Posts