So you may be wondering how does this stuff work. I guess magically wouldn’t be a very good answer. The mapping portion leverages our MapController, and the rest is handled in Flex 2 with a little assistance from Javascript. One of the biggest obstacles to overcome was the seperation of the controller, the chart and the datagrid.In the 2nd version of the player they were grouped together above the map. We decided it’d be much cooler to have a fullscreen map with transparent overlays. The easy way to do this was to make a full screen Flash app, and lay that over a fullscreen Google Map. However, you then couldn’t move/pan the map – something Google Maps are just so darn good at. So that idea was axed.

So now we have 3 different Flash Applications on the page, laid upon a fullscreen map. One acts as the main controller (where you hit start/stop). The other 2 are your dedicated views – the grid and the chart display. These guys are notified when the state changes on the controller, and are updated at that time.

Through the magic of JSON our different Flash applications are able to communicate with each other.

Timeline of a typical Session

1. Page loads – first come the ever famous GoogleMaps, Behaviour, Prototype and swfobject libraries. These are followed by our libraries, including MapController, ActivityPlayer and the Actionscript->Javascript communication libraries.
2. Once the page is loaded – Behaviour calls the main function in ActivityPlayer – and we’re off to the races.
3. ActivityPlayer initializes and created the MapController. It then writes out each swf which are then loaded.
4. Once the main ButtonPanel swf is loaded – he searches for what activity to load from MotionBased.
5. The appropriate activity is retrieved from MotionBased and passed to the ButtonPanel.
6. Once the activity is parsed – information about the activity is passed to the Map, DataGrid and Chart panels.
7. They do what they need to do – and appear in front of you.
8. You click the play button – and it’s off to the races. Information is automagically passed to the appropriate views – just watch them update.
9. It’s not just a one way street though – if you click on either the Map Line or Chart Lines you’ll be taken to that moment in time.