R – the best way to reuse functions in Flex MVC environment

actionscriptapache-flexcairngormcode-reusemodel-view-controller

I am using a Cairngorm MVC architecture for my current project.

I have several commands which use the same type of function that returns a value. I would like to have this function in one place, and reuse it, rather than duplicate the code in each command. What is the best way to do this?

Best Answer

Create a static class or static method in one of your Cairngorm classes.

class MyStatic
{
    public static function myFunction(value:String):String
    {
        return "Returning " + value;
    }
}

Then where you want to use your function:

import MyStatic;

var str:String = MyStatic.myFunction("test");

Another option is to create a top level function (a la "trace"). Check out this post I wrote here.

Model-View-Presenter

In MVP, the Presenter contains the UI business logic for the View. All invocations from the View delegate directly to the Presenter. The Presenter is also decoupled directly from the View and talks to it through an interface. This is to allow mocking of the View in a unit test. One common attribute of MVP is that there has to be a lot of two-way dispatching. For example, when someone clicks the "Save" button, the event handler delegates to the Presenter's "OnSave" method. Once the save is completed, the Presenter will then call back the View through its interface so that the View can display that the save has completed.

MVP tends to be a very natural pattern for achieving separated presentation in WebForms. The reason is that the View is always created first by the ASP.NET runtime. You can find out more about both variants.

Two primary variations

Passive View: The View is as dumb as possible and contains almost zero logic. A Presenter is a middle man that talks to the View and the Model. The View and Model are completely shielded from one another. The Model may raise events, but the Presenter subscribes to them for updating the View. In Passive View there is no direct data binding, instead, the View exposes setter properties that the Presenter uses to set the data. All state is managed in the Presenter and not the View.

Pro: maximum testability surface; clean separation of the View and Model
Con: more work (for example all the setter properties) as you are doing all the data binding yourself.

Supervising Controller: The Presenter handles user gestures. The View binds to the Model directly through data binding. In this case, it's the Presenter's job to pass off the Model to the View so that it can bind to it. The Presenter will also contain logic for gestures like pressing a button, navigation, etc.

Pro: by leveraging data binding the amount of code is reduced.
Con: there's a less testable surface (because of data binding), and there's less encapsulation in the View since it talks directly to the Model.

Model-View-Controller

In the MVC, the Controller is responsible for determining which View to display in response to any action including when the application loads. This differs from MVP where actions route through the View to the Presenter. In MVC, every action in the View correlates with a call to a Controller along with an action. In the web, each action involves a call to a URL on the other side of which there is a Controller who responds. Once that Controller has completed its processing, it will return the correct View. The sequence continues in that manner throughout the life of the application:

    Action in the View
        -> Call to Controller
        -> Controller Logic
        -> Controller returns the View.

One other big difference about MVC is that the View does not directly bind to the Model. The view simply renders and is completely stateless. In implementations of MVC, the View usually will not have any logic in the code behind. This is contrary to MVP where it is absolutely necessary because, if the View does not delegate to the Presenter, it will never get called.

Presentation Model

One other pattern to look at is the Presentation Model pattern. In this pattern, there is no Presenter. Instead, the View binds directly to a Presentation Model. The Presentation Model is a Model crafted specifically for the View. This means this Model can expose properties that one would never put on a domain model as it would be a violation of separation-of-concerns. In this case, the Presentation Model binds to the domain model and may subscribe to events coming from that Model. The View then subscribes to events coming from the Presentation Model and updates itself accordingly. The Presentation Model can expose commands which the view uses for invoking actions. The advantage of this approach is that you can essentially remove the code-behind altogether as the PM completely encapsulates all of the behavior for the view. This pattern is a very strong candidate for use in WPF applications and is also called Model-View-ViewModel.

There is a MSDN article about the Presentation Model and a section in the Composite Application Guidance for WPF (former Prism) about Separated Presentation Patterns

R – Best place to put prototype code in Flex project

In my honest opinion, it would be best to subclass or compose on Array, instead of modifying its prototype. Modifying the prototype can lead to confusion in the maintenance phase, which is one of the main reasons for using a framework like Cairngorm.

If creating a new class doesn't suit you, then also consider creating a utility class.

Flex actually already has a utility class called ArrayUtil and a function which does what you want: ArrayUtil.getItemIndex.

var obj1:Object = new Object();
var obj2:Object = new Object();
var myArray : Array = [obj1, obj2];
ArrayUtil.getItemIndex(obj1, myArray);    // returns 0
ArrayUtil.getItemIndex(obj2, myArray);    // returns 1
ArrayUtil.getItemIndex(obj3, myArray);    // returns -1

Tutorial

Best Answer

Related Solutions

What are MVP and MVC and what is the difference

Model-View-Presenter

Two primary variations

Model-View-Controller

Presentation Model

R – Best place to put prototype code in Flex project

Related Topic