Skip to content

3. Integration with RobotLegs

Eric-Paul Lecluse edited this page May 17, 2011 · 3 revisions

The core of the Navigator library is and will be completely dependency-free, but there are packages with helper classes for integrating into existing frameworks, like the RobotLegs framework.

In short, RobotLegs constructs mediators when view components (Sprites) are added to the stage, and RL provides these mediators with all the instances it needs through injection. Putting the view components on stage however, is still a task left up to you, and getting a nice setup for it can be pretty tedious.

By extending the NavigatorContext, this is no longer the case. Map your view components and mediators to the right navigation state from within your application context' startup method. You can define the order at which your components appear on stage, yet they will only be constructed when the application navigates to the corresponding state.

You can look at the example project when you clone or fork the project, or get a preview of the corresponding SWF here.

override public function startup() : void {
	// Commands are triggered when the navigator enters the corresponding state
	stateControllerMap.mapCommand("/", HelloWorldCommand, true, true);
	
	// A simple view component mapped to a state needs no mediator
	stateViewMap.mapView("/", ExampleTextBox);
	
	// But if a component and mediator form a pair, we use this syntax 
	stateViewMap.mapViewMediator("red", RedSquare, RedSquareMediator);
	stateViewMap.mapViewMediator("green", GreenSquare, GreenSquareMediator);
	stateViewMap.mapViewMediator("blue", BlueSquare, BlueSquareMediator);
	
	// You can add states one by one, or as an array
	stateViewMap.mapViewMediator(["black", "*/black"], BlackCircle, BlackCircleMediator);

	// By using a mapping's parent property, you can setup nested view components
	var container : ViewRecipe = stateViewMap.mapViewMediator("move", ContainerSquare, ContainerSquareMediator);
	stateViewMap.mapViewMediator("move/nested", NestedSquare, NestedSquareMediator).parent = container;

	// By calling mapView on existing mappings, we can add extra states 			
	stateViewMap.mapView("*/red", RedSquare);
	stateViewMap.mapView("*/green", GreenSquare);
	stateViewMap.mapView("*/blue", BlueSquare);
	
	// Navigator debug console, very nice for development. Toggle with the tilde key, "~". You can type in new states by hand!
	stateViewMap.mapView("/", DebugConsole, navigator);
	
	// Finally, start navigating
	navigator.start("", "red");
}