Netflix API with Mate

When I created this post Flex 4 and Mate didn’t play nice together. Because of that I wasn’t able to create my example app in Flex 4 like my last Flex 4 Cairngorm App example. Sadly I am having to downgrade this example to the currently working Flex 3 – though I intend to upgrade as soon as Mate and Flex 4 learn to play nice.

Below is the Flex 3 application that I will be making using Mate, it should look very similar to the cairngorm application made in the last blog post and will serve as the basic design for each of our applications.

I am going to try to refrain from making Cairngorm references but will say that both workflows feel very similar.
event > event collector > executing code > return/fault handlers > data storage

Mate Application

Mate Application



Many people have fallen in love with Mate because the Mate framework makes programming “like magic”. Depending on the kind of programmer you are this is a good thing or a bad thing.

Bubbling Events
What makes the Mate framework “magic” is the fact that Mate relies on Dependency Injection and Flex Event Bubbling. What does this mean for you? This means that anywhere in your Flex application, fire off the event and the event will be picked up by your designated “EventMap” as it bubbles upwards from your subcomponent and then the result will automatically be injected into your view.

What is really nice about the Mate framework (and what every Mate developer will say first as a Mate strength) is that the Mate framework’s events are actually just Flash Events. Nothing special, nothing framework added, just a regular Flash Event.

The designated “EventMap” will then handle the event as it has been instructed, run a function, a service call, or whatever your application needs. In the case of our application we send off service calls, this is handled by Mate as such:

1
2
3
4
5
6
7
8
9
10
11
12
    <!-- autocomplete -->
    <mate:EventHandlers type="{AutocompleteEvent.AUTOCOMPLETE}">
        <extensions:AutocompleteServiceLoader>
            <mate:Properties term="{currentEvent.term}"/>
            <extensions:resultHandlers>
                <mate:MethodInvoker arguments="{currentEvent}" generator="{TitlesManager}" method="autocompleteResult"/>
            </extensions:resultHandlers>
            <extensions:faultHandlers>
                <mate:MethodInvoker arguments="{currentEvent}" generator="{TitlesManager}" method="autocompleteFault"/>
            </extensions:faultHandlers>
        </extensions:AutocompleteServiceLoader>
    </mate:EventHandlers>

This code will accept the AutocompleteEvent event and call for the AutocompleteService service loader.

Big Note! If you aren’t using a straight httpservice or remoteobject Mate will require some Mate specific programming. The next code segment will show you the file necessary to transform your custom event to a Mate acceptable event.

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
30
31
32
33
34
35
36
37
38
39
40
41
42
package com.unitedmindset.extensions
{
    import com.asfusion.mate.actionLists.IScope;
    import com.asfusion.mate.actions.AbstractServiceInvoker;
    import com.asfusion.mate.actions.IAction;
    import com.netflix.webapis.catalog.TitlesService;
    import com.netflix.webapis.catalog.params.CatalogParams;
    import com.netflix.webapis.events.NetflixFaultEvent;
    import com.netflix.webapis.events.NetflixResultEvent;
    import com.unitedmindset.events.AutocompleteEvent;

    public class AutocompleteServiceLoader extends AbstractServiceInvoker implements IAction
    {
        private var service:TitlesService;
        public var term:String;
       
        public function AutocompleteServiceLoader()
        {
            service = new TitlesService();
            currentInstance = this;
        }
       
        override protected function run(scope:IScope):void
        {
            innerHandlersDispatcher = service;
           
            if(resultHandlers && resultHandlers.length>0){
                createInnerHandlers(scope,NetflixResultEvent.RESULT,resultHandlers);
            }
           
            if(faultHandlers && faultHandlers.length>0){
                createInnerHandlers(scope,NetflixFaultEvent.FAULT,faultHandlers);
            }
           
            var params:CatalogParams = new CatalogParams();
            var e:AutocompleteEvent = scope.event as AutocompleteEvent;
            params.term = e.term;
            service.autoCompleteService(params);
        }
       
    }
}

Can I get a Manager over here?
With our event being fired off (from anywhere in our application), the Event Map has now received the call and taken action – in this case, gone to get the service. Now we need to do something with the return. This is where we deal with our data, Managers.

Managers work by having a set of functions to receive the set data from a service or other function. The manager with do the work it needs to accomplish and wrap itself up. Basically, managers “manage” your application’s data.

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
package com.unitedmindset.managers
{
    import com.netflix.webapis.events.NetflixFaultEvent;
    import com.netflix.webapis.events.NetflixResultEvent;
   
    import flash.events.EventDispatcher;
   
    import mx.controls.Alert;

    public class TitlesManager extends EventDispatcher
    {
        [Bindable]
        public var list:Array;
       
        public function autocompleteResult(event:NetflixResultEvent):void
        {
            list = event.result as Array;
        }
       
        public function autocompleteFault(event:NetflixFaultEvent):void
        {
            Alert.show(event.fault.faultDetail,event.fault.faultString);
        }
    }
}

Injection what?
Dependency injection in it’s most simple form should remind you of data binding. You set a variable that is plugged into a listener, when that variable is set, it triggers and sets another variable somewhere else in your application. Where are these variables? In Mate, within your managers usually. Where can you set a variable, anywhere else in your application. This is a very helpful construct that simplifies how data moves around your application. An injector example is provided below.

1
2
3
4
5
    <mate:Injectors target="{NetflixMate}">
        <mate:PropertyInjector source="{TitlesManager}"
            targetKey="listDataProvider"
            sourceKey="list"/>
    </mate:Injectors>

With all of our code put together in the Mate framework you can now see that we have a Mate application that acts exactly the same as our Cairngorm application. The file downloads and source are provided below.

Mate Application

Mate Application

  • Share/Bookmark

Comments (4)

MagnusJuly 2nd, 2009 at 11:04 pm

I’m not sure I completely get when you should create a custom class / an extension in Mate extending from AbstractServiceInvoker like for the loaders in this example vs when you would just use something like the AsyncMethodInvoker class in Mate. The Mate documentation is not completely clear.

Is it fair to say that you should create a custom class that extends from the AbstractServiceInvoker anytime you need to have more control of the request/reply for your service and there isn’t a class in Mate that already does the job and you may reuse it in other projects or are there other reasons?

Jonathan camposJuly 2nd, 2009 at 11:13 pm

100% magnus. Anything that isn’t a straight httpservice or remoteobject service should probably be created as the example shows.

Jon TolandJuly 27th, 2009 at 9:32 pm

Having used Mate day in and out for six months or so now, my enfatuation is wearing off and I long to return to PureMVC and try out Fabrication. I’m uncertain though why you needed to subcalss anything. I’ve had to derive a few “inline” implementations of AsyncMethodInvoker for example, providing an “instance” property in lieu of their “generator” consept, but nothing domain specific? Enjoyable posts.

Jonathan CamposJuly 29th, 2009 at 9:10 am

Sadly you have to subclass and extend to fit the Mate array result/fault mxml handlers. Small nuisance but easily gotten over.

Leave a comment

Your comment