Robotlegs IoC/DI Flex Framework Examples Updated
Live demos are available on robotlegs.org here
Acme Widget Factory:
The Acme Widget Factory is modular example and deals with loading multiple modules into a shell and communicating between those modules. The shell and each module has its own context.
Lazy Stack:
Lazy Stack is an example of deferred instantiation of Flex components, and how this is handled by the Robotlegs framework.
Wheres Window:
Where's Window is a simple example to show how to mediate and communicate between a set of instances of the same view component that have individual mediators. In this case, the view components are windows in an AIR application. This uses a proxy to register and manage the currently open unique windows. I am going to write a more detailed breakdown of this particular example soon.
The Elevator Pitch
Robotlegs is an IoC/DI container that is modeled on the PureMVC application structure. It is designed to be MVCS, model-view-controller-service, providing metadata dependency injection across these layers. While following the well organized approach of PureMVC, it eliminates the use of framework singletons and takes full advantage of the Flash Platform to keep the dreaded boiler plate code to a minimum. Eliminating these singletons makes unit testing and TDD much easier, which can be a real struggle when trying to isolate classes for testing where these singleton dependencies exist. Robotlegs is fast, clean, and perhaps more importantly fun to work with. There is a smorgasbord of architectural frameworks available for Flex/AS3, but Robotlegs is worth a look even if you are sick of looking at architectural frameworks.
Unit Testing: IoC/DI, Robotlegs and FlexUnit 4
I've been reviewing the various IoC containers available for Flex/Actionscript. One of the benefits of IoC and DI is that it greatly facilitates unit testing. By injecting our dependencies into our applications actors, we are effectively isolating them from the other classes that make the application function. "So what?"
In computer programming, unit testing is a software verification and validation method in which a programmer tests that individual units of source code are fit for use. A unit is the smallest testable part of an application. In procedural programming a unit may be an individual program, function, procedure, etc., while in object-oriented programming, the smallest unit is a class, which may belong to a base/super class, abstract class or derived/child class.
Ideally, each test case is independent from the others: substitutes like method stubs, mock objects, fakes and test harnesses can be used to assist testing a module in isolation. Unit tests are typically written and run by software developers to ensure that code meets its design and behaves as intended. Its implementation can vary from being very manual (pencil and paper) to being formalized as part of build automation. -wikipedia unit testing entry
To effectively unit test classes, we want them to be as isolated as possible. The class needs to stand on its own and have its functionality vetted to ensure that it behaves as expected. When we start to test how our classes behave together, we have entered the land of integration testing. Integration testing is a worthwhile pursuit also, but before we get to that point, we really want to ensure that our classes are solid by themselves.
Using the example in this Robotlegs Image Gallery demonstration, we are going to test a couple of the classes that make up the application. The demo isn't complex. It has a very simple model, a single service, and just a few views. In fact, it might even seem like a waste of time to unit test a simple example such as this, but the concepts are applicable to larger applications where the benefits of this type of testing really start to pay off.
FlexUnit 4 is the framework that is used here. It provides very handy asynchronous testing, meta data support, and a whole bucket of stellar features that I won't even begin to scratch the surface of. FlexUnit 4 also comes with a graphical testrunner interface:
Robotlegs AS3: A Dependency Injection Driven MVCS Framework for Flash/Flex – Inspired by PureMVC
The quest for a Dependency Injection container continues. The most recent stop on this exploration of the available options has been Robotlegs. Robotlegs AS3 is a DI driven MVCS framework for Flash/Flex inspired by PureMVC. Being a huge fan of PureMVC, this caught my attention immediately. Robotlegs professes to be a framework like PureMVC, but without all the Singeltons, Service Locators, casting and boiler plate we have all come to love. Better yet, it delivers on these claims.
Source for this demo available on github...
Piping the Machine: PureMVC Multicore with Pipes and the Finite State Machine (FSM)
This is going to be a walkthrough of making use of PureMVC Multicore (AS3). To help in building a PureMVC Multicore application, we are going to make use of the StateMachine utility for initial setup and configuration as well as the Pipes utility for communication between cores.
The Flickr AS3 API and Flex
We've been using wordpress for our family photo blog for years. It worked well, 4 images in a horizontal scroll. It was kinda tough to navigate though. If you were looking for an image you had to click more... more... more... etc through 3 or 4 years of photos. I wanted something easier to update and navigate. I also wanted to play around with the Flickr API. Luckily the Adobe Flickr AS3 library is very complete. Unfortunately it is very lacking in examples, but the API is well documented so it didn't take too long to get my bearings.
Here's what I came out with. Really it is meant to fill the browser, so check it out here too if you are interested. Source is enabled on the movie. Codes sloppy, but it gets the job done. 
Adding a ToolTip function to a ComboBox in Flex
My screens get a bit crowded sometimes, especially when dealing with forms. Users want to be able to see additional information, but there is just no place to put it. The data is dynamic though, so the toolTip needs to change based on the currently selectedItem of the ComboBox. With a DataGrid, for example, you have a showDataTip property on a column and can assign a dataTipFunction. There is no similar function in the ComboBox, but it is easy enough to add. I'm also using the HtmlToolTip class for a little extra style in the ToolTip itself.
View Source is enabled.
Introspective PureMVC Console
This project is intended to help Flex and AS3 application developers, that use the PureMVC framework for AS3 - simple or multicore version - by providing them deep insights on what happens at the framework level: Notifications, Commands, Mediators and Proxies.
PureMVC is a highly recognized MVC framework, that has also many portages in various languages, and that's now quite widely in Flex applications, though not as much as Cairngorm.
What a fantastic tool. You can really dig deep into your application.
- Monitors the internal flow of PureMVC in real time
- Discover and inspect Mediators
- Inspect Views associated to Mediators
- Discover and inspect Proxies
- Find starting point in source code
- Integrated with KapInspect
Django Authorization from Flex/AIR via PyAMF
Django views serve nicely as service end-points for Flex applications. Here are some notes on maintaining authenticated sessions between a Flex/Air/Flash application and your Django backend.
gateway.py
1 2 3 4 5 6 7 8 | from pyamf.remoting.gateway.django import DjangoGateway import myproject.myapp.views as views gw = DjangoGateway({ 'login' : views.login_user, 'logout' : views.logout_user, }) |
views.py
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | import pyamf from django.contrib import auth from django.contrib.auth import authenticate, login, logout from django.contrib.auth.decorators import login_required from django.contrib.auth.models import User try: pyamf.register_class( User, 'django.contrib.auth.models.User') except ValueError: print "Classes already registered" def logout_user(http_request): logout(http_request) def login_user(http_request, username, password): user = authenticate(username=username, password=password) if user is not None: login(http_request, user) return user return None @login_required def registered_user_protected_function(http_request): return "You are a registered user." @login_required def staff_protected_function(http_request): if http_request.user.is_staff != True: return None return "You are staff." |
from flex
1 2 3 4 | var netConnection:NetConnection = new NetConnection(); netConnection.connect("http://mysite.com/gateway"); var responder:Responder = new Responder(loginResult, handleFault); netConnection.call("login", responder, "username", "password") |
The http_request carries a reference to the currently authenticated user throughout the session. This works for web based Flex application as well as AIR applications on the desktop. Note that I am using a try/except on the pyamf class registration calls. Because this is session based, the classes only need to be registered once. Without the trap, it throws a TypeError letting you know the registration has already taken place.
Django User Authentication Documentation
All of the various things you can do with authentication in Django. It is, of course, based mostly on the use of the very nice Django HTML template system. While those bits aren't handy to the likes of us, it is a good read either way.
pyAMF ByteArray example
This example shows the basic structure for setting up Django/Flex communication. It doesn't cover authentication, but covers a good bit of territory with examples in Flash and Flex.
Updated: Continuous scrolling image thumbnail and slideshow component for Flex.
I've updated this component to allow for keyboard and forward/back navigation. I'm still improving it, refactoring, but it is almost finished.
Here is the original post.
Continuous scrolling image thumbnail and slideshow component for Flex.
I've been working on improvements for this thumbnail/slideshow component. The way the continuous scroll flows is very nice. It provides a very fluid feel. I have it reading XML from SlideShowPro director. SSPD simply gives a structure of albums and images, so the component should work from essentially any XML source as long as it follows the same schema:
1 2 3 4 5 6 | <gallery> <album id="0" description="DESCRIPTION" title="TITLE" tn="PATH" lgpath="PATH" tnpath="PATH"> <img src="FILENAME" /> ... </album> </gallery> |
There is still a good bit of work to do. Right now the slideshow is coupled with the thumbnail container. I think that should be seperated, because I can see various uses for thumbnails outside of a slideshow. It needs style and event metadata so that it will function as a proper Flex component. I am also going to roll it into mediated PureMVC components for inclusion in VE:Session.
