Archive for category Robotlegs

Robotlegs 2 coming from Robotlegs

I did an article when I switched from PureMVC to Robotlegs so I am going to do something similar here. Yesterday I was able to do everything I wanted with Robotlegs 2, enough to do a full project with, but it wasn’t straight forward. Hopefully this will save you some time.

OMG they removed the org

First thing you will notice in the git repository is that they removed the org package; it starts right at robotlegs. No more org.robolegs.somethingelse. I was kinda confused at first. I thought I was at the wrong place. I kept looking for the src. But after reading this discussion about it, I figured I was at the right place. It did make much sense at first and it was pretty confusing, but in the end it doesn’t change much. Doesn’t help much either, but we will get use to it I guess. Goodbye org package!

Bender full of women

They next package inside the robotlegs source folder is bender. Funny thing, English not being my first languages I was thinking of binders and I didn’t get it… Silly me, well it refers to Bender, the robot character from Futurama. It is meant as a version name (version number) so version 2 is named Bender, version 3 will be some other robot I guess. This is a like what Google is doing with Android and naming every version of its operating system as a dessert (Ice cream sandwich, Jelly Bean, Gingerbread, etc). Again a bit confusing; I would have gotten it right away if I had seen v2, but bender is great once you know about it ;) (first emoticon I put in a post)

Putting it into context

Next little problem I had was when I created the context. The code on the git page is great but it only gives you half of what you should write. So here is what they have on their page:

_context = new Context().install(MVCSBundle).configure(MyAppConfig, SomeOtherConfig).configure(new ContextView(this));

Now this is all good and nice, so I paste this in my project, and than I put my variable statement for _context at the top of my Class and I naturally type it to Context. Error, here is the silly error it returned : “Error: Implicit coercion of a value with static type robotlegs.bender.framework.api:IContext to a possibly unrelated type robotlegs.bender.framework.impl:Context.”. Now I’m like OMG, WTF, I think I should be right about everything. Well not this time. You need to type your _context as IContext; took me a little while to figure it out (hopefully having the error pasted in this post will save you some time). So:

private var _context:IContext;

MVCS but where is my command map?

This one was easy, I was looking to map some commands, but couldn’t find the right class. I am in FlashDevelop and I start typing CommandM and two classes pop up CommandMapper and CommandMapping. Sounds somewhat good, but doesn’t seem to be the right thing. After some looking around in the examples, the class I was looking for was IEventCommandMap, once you inject that, you are golden.

[Inject]
public var commandMap:IEventCommandMap;
commandMap.map(TestEvent.SQUARE_CLICKED, TestEvent).toCommand(StartApplicationCommand);

And finally the ContextView

So yeah, last thing I needed to do was to add some views on the stage, but where to start? Answer: pretty much everywhere! Inject the ContextView where you need it, after that you can add views to its view. Hum sounds confusing here is some code:

[Inject]
public var contextView:ContextView;
contextView.view.addChild(new SquareView());

Conclusion

So I got all my building blocs that I am used too in Robotlegs v1 so I could technically build a project using it. V2 feels good, I like the new syntax to create the Context and to map mediators and commands. It seems to be doing way more than what I am used too, there are a lot of extensions that I didn’t investigate. But hey, time will tell if it can hold its own.

, , , , ,

1 Comment


Robotlegs FDT 4.2 project template

FDT 4.2 introduced an improved project template system so since I already did some Robotlegs templates for FlashDevelop previously, I thought I would give it a shot for FDT too. So here it is:

FDTRobotlegsProjectTemplate

Copy those file in this folder for MAC users

(Your User Name) > Library > Application Support > FDT > projectTemplates > Web

and in this folder fo PC users

C:\Users\{Username}\AppData\Roaming\FDT\projectTemplates\Web

After that all you have to do is create a new Flash project in FDT and you should see Robotlegs project under web.

All you have to do is specify the package name by entering the client name and the project name and there you go, you have a fully functional Robotlegs project. I did the client+project package name thing because if you work for an agency you could do multiple projects for the same client so I think it is better for code organisation.

This template includes:

  • a SiteMain file which is the file that you will compile
  • a SiteContext
  • an ApplicationModel
  • a CreateMediatorCommand
  • a StartupCommand
  • a SiteEvent class
  • and a SampleView and SampleMediator

You could remove the SampleView and the SampleMediator but I felt it made the project more complete and a really good Robotlegs example.

If you have suggestions on how to make this template better or just comments, leave them down here.

, , ,

3 Comments


Dependency Injection; Ok but how?

More Robotlegs for you guys, but this time in is more conceptual.

One thing that bugged me with Robotlegs was the use of the expression Dependency Injection. Cool word, it must mean something huge. Well if you look at it quickly; not really. If you take time to think about it, it means more.

Half of it is injection

Well, how you implement dependency injection is actually pretty simple and is something that you are doing every day (well if you program). Dependency Injection is giving, by the mean of the contructor, a method or a property, dependency (data) to an object. As Joel Hooks said it in his InsideRIA article (read it, it’s a good intro): “When you pass a variable to the constructor of a class, you are using Dependency Injection. When you set a property on a class, you are using Dependency Injection.

Ain’t that just pleasing; I can just walk around the office and tell every one I am doing Dependency Injection.

The concept behind it

I first was reading about this on the Robotlegs best practices and I couldn’t understand anything (that’s mostly the case when I am first exposed to a design pattern, no offense to that document). After that I found Hooks article and I said to myself: “this ain’t complicated, why all the fuss”, but I wasn’t really understanding the concept (the why) behind it. It took me this article to really understand. The example is really simple and clearly expose why we should use dependency injection.

Why we should use dependency injection is mostly to create more flexible Classes. If a Class as settings that could change and that it depends on them to work, these settings should not be set inside the Class’ code but outside of it. That way every time the settings change, you don’t need to go in the Class’ code to change them.  You should really read Fabien Potentier’s article about it; he does a way better job at explaining this than me. Also this presentation by Jeff More is pretty good. The more you read about it the more you’ll understand what it is.

Fine but it still feels like magic in Robotlegs

When you read the wikipedia article on Dependency Injection, at one point they list some draw backs and one of them was that “Code that uses dependency injection can seem magical to some developers” and that is exactly how I felt about it in the context of Robotlegs. Mostly because of the use of the [Inject] metatag. That is not a mechanism I was used to in AS3. I was thinking that these meta where holy blessed keywords that only Adobe could create.

Well it turns out I was wrong. Well half wrong. The [Inject] meta is used at runtime while let’s say the [Embed] metatag is used at compile time, so it is not exactly the same beast. In Robotlegs, injection is handled by the SwiftSuspenders. What it does is that for all rules you create using the method mapValue, mapClass and mapSingleton it will inspect the classes it receive. It uses the function flash.utils.describeType on the Class to do so, this will return an XML that represent that Class. In this XML, there will be tags that represent the [Inject] metatag. That is what SwiftSuspenders is looking for when parsing the class representation XML, after that it can freely do the injection (passing the values) according to the rules.

Now you could go and create your own metatags, but it seems that the compiler would remove them at compilation. If you use the source for the SwiftSuspenders instead of the SWC they tell you to add this to the compiler arguments:

-keep-as3-metadata+=Inject

-keep-as3-metadata+=PostConstruct //This is another metatag that SwiftSuspenders makes use of

This will prevent the compiler from removing the metatags from the Classes, so you could basically change these lines to make the compiler keep your newly created metatags. I have no idea why you don’t have to do this when using the SWC.

That is kinda what I wanted to cover. I’m still not fully comfortable with dependency injection but at least I have a better idea of how it works underneath. I hope you feel the same.

, , , , , , , ,

8 Comments


Some tricks when switching to Robotlegs from PureMVC

From the past posts and a couple of tweets, you all know I have been playing around with Robotlegs. Also, up until now, my framework of choice has been PureMVC, so what I want to do in this post is inform you of the little road bumps I hit when trying to learn the new framework.

Public dependency injection

The first one is really small. Robotlegs makes use of dependency injection (more on that in a later post) and to do so you have to put a meta tag [Inject] before you variable declaration. That is all good, just remember to make your variable public or else you’ll get an error. I wasn’t accustomed with the error I got so it took me some time to find out why I got it.

[Inject]
public var view:Footer; //remember to make public injectable variables

Playing with models

First thing first, when creating my model I was looking to extend the Model class from the Robotlegs framework. Turns out there is no such class; models should extend the Actor class. Services also extends the Actor class.

The next gotcha was a little weird to me at first because it is different from PureMVC mindset. Robotlegs does lazy instantiation, so when you map a model using the injector.mapSingleton method the model will only be created the first time it is injected (that is how I understood it). For some models this is ok, but for others they need to be created before that. In order to do so you use injector.instantiate method and pass it the class you want to create. Here is the code for it and how you would pass data to your newly created model:

injector.mapSingleton(ApplicationModel);
var appModel:ApplicationModel = injector.instantiate(ApplicationModel);
appModel.init("whatever you want here");

Where do I list and handle framework events?

This is the big plus for Robotlegs, no more handling notifications but not listing them and then not figuring out why it doesn’t work. Robotlegs uses the same mechanism, in a mediator, to listen to view events than to listen to framework events which makes it easier to deal with.

So to listen to a view event I would do this:

eventMap.mapListener(view, StringEvent.HIT_ZONE_ROLL_OUT, _onRollOut, StringEvent);

and to listen to a framework event I would do this:

eventMap.mapListener(eventDispatcher, StringEvent.RESIZE, _onResize, Event);

Robotlegs basically wraps around the traditional addEventListener method and what does this give us as an additional bonus? We don’t ever have to set these listeners to weak reference because that is the way they are set by default. Oh, the joy!

Learning a new framework isn’t an easy task (at least when you don’t know any), but I found that learning Robotlegs from a PureMVC background was pretty easy. I hope you will take the time to check it out.

, , ,

8 Comments


And now an AS3 Project – Robotlegs project template for FlashDevelop

So yesterday I gave you files templates for Robotlegs. I now give you a project template. File templates are used when you want to add a new file to a project, project templates are used at the creation of a project. It will create the folder structure, add libraries and create the basic files you will need in most projects of that type.

In this Robotlegs project template I added 7 files : Preload.fla, Main.as, IMain.as, MainContext.as, CreateModelsCommand.as, CreateMediatorsCommand.as and ApplicationModel.as.

I added the Preload.fla because has explained in this post, I pass the loaderInfo(I do this to pass the flashvars) from the preloader to the loaded Main so I thought it would make understanding why I did that in the Main easier. This is a template preloader so there is no graphics in it, just the basic code to make a preloader work.

In the Main.as I also do some weird things, namely this:

if (Capabilities.playerType == "StandAlone"){
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
init(this.loaderInfo);
}
 
//and this in the init method
if (Capabilities.playerType == "StandAlone"){
local = true;
}

I do this to test locally without having to compile the preloader every time. Also, I might need to know if I am local if I use AMF. In that case, the url for my gateway will be different.

For the rest, it is pretty straight forward, a MainContext for the application that will start it, a command to create the models, a command to create the mediators and finally an ApplicationModel. I don’t create the ApplicationModel in the CreateModelsCommand because I want to parse the data(parameters) inside of the LoaderInfo I passed in the constructor of the MainContext.

If you use this project template along with the files templates, you’re in for major time saving while enjoying Robotlegs!

Here are the files:
000 ActionScript 3 – AS3 Project with Robotlegs.rar

So when you downloaded the files, go in FlashDevelop, in the top menu select Tools and then Application Files… This will open the application files folder of FlashDevelop. Now go in the Projects Folder and add the files that you downloaded (copy the “000 ActionScript 3 – AS3 Project with Robotlegs” folder there). Now the next time you create a new project in FlashDevelop, scroll down and you will see it.

You may not agree with everything that is in those templates, then there is two things you can do. Either discuss about it in the comments or modify my project template. It is very easy to do so; I never even looked at documentation to learn how to do it.

, , ,

5 Comments


Robotlegs templates for FlashDevelop

I just finished my first project using Robotlegs and I can say I really like it. Way less code to write. The only thing that bothers me is that you have to create new Events when you want to pass around complex data but I think AS3Signals might fix that so I will look into that later on.

Since I have all my templates for PureMVC done in FlashDevelop, I thought I would do the same for Robotlegs. So I have built a template for a Command, a Context, a Mediator, an Actor and I also put in a ResizeModel (I know some people do this in a mediator but if you want to change this go ahead). Now, I don’t think these will be perfect, but it is a good starting point.

I am also working on a AS3 Project – Robotlegs template, but I want to try it out before I give it out. When I am pleased with it, I’ll post it along with an update of the other templates.

Here is the files with the templates:

RobotlegsTemplates.rar

To add them in FlashDevelop, in the Tools menu click in Application Files. This will open the folder where the applications files for FlashDevelop are. In there open the Templates folder, then the ProjectFiles folder, then the AS3Project folder. Now copy the Robotlegs folder you downloaded there. To use them, in the project view in FlashDevelop, right click on a folder, click “Add” and then Robotlegs. At that point you will see the five templates you just added.

Robotlegs Templates for Flash Develop

, , , , , , , , ,

6 Comments