PureMVC Architects Lounge

This demo illustrates techniques for performing routine maintenance operations in a PureMVC-based Flex application.

The demo has historically been located here: http://trac.puremvc.org/Demo_AS3_Flex_EmployeeAdmin
The project has been moved here: https://github.com/PureMVC/puremvc-as3-demo-flex-employeeadmin/wiki

The author is Cliff Hall.

Hey I am getting this error ->
"unable to load SWC PureMVC_AS3_2_0_1.swc"...can you help me out in this

rbhadra, the compiler cannot find the PureMVC_AS3_2_0_1.swc file which should be located in the libs folder, however, without knowing your compile settings, I can guess that it is looking for it in the root of the project directory instead. Are you using Flex Builder or the command line compiler?

More than likely being bit by the issue with Flex Builder 3 compiler not creating a swc compatible with FB2.

In order to make the demo run in FB2, you need to download or check out the PureMVC_AS3 project source code, and set it up as a Flex Library project, and recompile the swc.

You can then replace this FB3 compatible swc with your FB2 swc, or remove the swc from your project and make the project dependent on your PureMVC_AS3 project.

-=Cliff>

Hi

I was just wondering (being new to puremvc) if the lines in UserFormMediator's clearForm method that reset's the form text controls was not violating the intension of loose coupling. Allso they seem not to matter as they are bound to the user value object and therefore resets as soon as the first line is executed (userForm.user = null;).

Maybe I'm missing something but I'm just trying to get my head around the issues of coupling, message flow and what have you.

Thanks for providing some great demo apps and a great framework and sorry if I'm just being stupid.


      private function clearForm():void
      {
         userForm.user = null;
          userForm.username.text = '';
         userForm.first.text = '';
         userForm.last.text = '';
         userForm.email.text = '';
         userForm.password.text = '';
         userForm.confirm.text = '';
         userForm.department.selectedItem = DeptEnum.NONE_SELECTED;
           }

You're absolutely correct, this method should be refactor/moved into the component itself and invoked from the Mediator.

-=Cliff>

Hi - I am evaluating PureMVC for use with an upcoming project and find the demo apps quite helpful. I have a question about the Employee Demo.

I can follow pretty much the logic of what is going on in the demo but I can't seem to find where the UserList.users property is being assigned? Or, for that matter, the UserProxy.data property (which is cast to ArrayCollection in the users getter)? What and where is this array collection created and assigned to these properties?

Phil.
P.S. Congrats on the PureMVC documentation! It's amazing for an open source project!

Look in the UserListMediator:
(which is instantiated in the StartUpCommand with:
facade.registerMediator( new UserListMediator( app.userList ) );
)

in its constructor:
userProxy = facade.retrieveProxy( UserProxy.NAME ) as UserProxy;
userList.users = userProxy.users;

The Proxy has a property 'data' which is a generic object. It receives a new ArrayCollection in:
super( NAME, new ArrayCollection );

so if you want to use that ArrayCollection you need to retrieve it as an ArrayCollection, hence:
public function get users():ArrayCollection
{
   return data as ArrayCollection;
}

which is used in:
public function addItem( item:Object ):void
{
   users.addItem( item );
}

because users is an ArrayCollection you can use ArrayCollection.addItem() there.

Hope this helps...

I see it now. Thanks!

In this example, the AddRoleResultCommand will show an alert dialog if there is a role that already exists for that user.

public class AddRoleResultCommand extends SimpleCommand implements ICommand
    {
        override public function execute( notification:INotification ):void
        {
            var result:Boolean = notification.getBody() as Boolean;
            if ( result == false ) {
                Alert.show ('Role already exists for this user!','Add User Role');
            }
        }
       
    }

Wouldn't it be better for the Command to resend a notification to tell the rest of the system about this case?

Is it kosher for Commands to open up new windows and display things for user interaction (which is what an Alert is)?

I was under the understanding that this is typically the role of the view to display an alert, and the role of the mediator to listen for a notification and then alert the user when necessary. (The benefits of having a mediator do it are things like being able to have the user specify in a preference "don't show this alert" and have it only show it when the user wants to see it... etc)

True, if that alert were an actual dialog that needed to be mediated. That is if it were going to collect some response from the user which would be used in some way, for instance to solicit a retry.

But Alert.show is a static method and the Alert box captures no information we're concerned about. It simply puts up a modal window with a message that you dismiss. So creating a Mediator for that wouldn't really be useful since we're not going to listen to it.

-=Cliff>

I have question related to this demo.

Currently the demo uses in memory data. In case I want to use SQLite what would be the best place to execute the sql statements? I assume the UserProxy.

// add an item to the data
public function addItem( item:Object ):void
{
// add logic here to database insert?

// when database insert successfull then also add item to users ac to display the new record in the binded view
users.addItem( item );
}
I'm wondering if the above pseudo code is the way forward, or are there any better alternatives?

Cheers,
Marcel

Just as it is fine to use a proxy to fetch and update its data via a remote service, you can do sql access in your proxy as well. There was some talk on the forums of an SQLProxy that someone was building, which would be extended by concrete classes, and it would pass on some good functionality, but I'm not sure where that stands. You might want to do a little poking around here in the forums to see if you can pick up on that thread and see where it went.

-=Cliff>

Thanks Cliff,

I read about this SQLProxy already and it really helped.

So the approach for doing both the sql insert and adding the item to the internal array collection is good?

Yes. Well, you probably want to uptadt the object with its database id after the sql insert and before sticking it in the Proxy's ArrayCollection.

-=Cliff>   

Yes updating the id is also vital for possible updating etc.

Thanks for your clarification.

I have another question which is going through my head.
In the EmployeeAdmin only 2 commands are defined except the StartupCommand. In other places dispatchEvent(..) is used.

Is there a good rule when to use Commands and when to dispatch events. This does not seem to be consistent, I'm wondering what the difference is between the two.

Cheers,
Marcel

Related to my above question here some exmaple.

The EmployeeAdmin uses a DeleteUserCommand which uses a proxy to delete an user and then sends a notification.

For adding an user - similar - logic (calling the proxy to add the user and sending a notification) is done in the UserFormMediator.

I'm wondering why ít's implemented in a different way.

To show that it can be done either way.

-=Cliff>

OK, thanks again.

Hi,

I adapted the EmployeeAdmin example to  remote data with AMFPHP and to deferred instanciation management (inspired by Slacker example)

My UserProxy now sends a RESPONSE notification to UserListMediator as soon as its RemoteObject brings back data and my users-getter is loosely typed:
public function get users():Object{
return data as Object;
}Then UserListMediator handles this notification and feeds its datagrid through nearly same line as original:
userList.users=userProxy.users as ArrayCollection
Unfortunately my grid stay empty  :(

Weirdly, each of following statements works and fills my grid.
userList.userDatagrid.dataProvider=userProxy.users;and
userList.users=new ArrayCollection([{username: 'bigjoe', fname: 'john',lname:"Doe"...}]);
So, userList.users can receive an AC and userProxy.users is not empty and feed a dataprovider...

Can somebody help me understand why second can't feed first ?

Thx
Eric

The ball is being dropped somewhere; this sounds like a job thr the debugger.

Place a breakpoint on the line in the proxy where you first expect it to have data and run in debug mode. Look at the variables view.

Note: You may have to hit the little down arrow on the right side menu of the variables view and do Flex -> Show inaccessable members.

Does it have data? If so, step over until you get to the code setting the grids dataprovider. If not move your breakpoint farther back in the process and find out why the Proxy never gets its data. Did the service fail to retun the correct type? Inspect the ResultEvent.

Use the debugger, it'll be your best friend.

-=Cliff>

The remote service returns an Array. So  the statement
userList.users=userProxy.users
works as soon as I type both parts as an Array.

Just need to know how to get an AC instead.

Thx again Cliff.

Ok, then in UserProxy, when you get the result, take the array, wrap it in an ArrayCollection and set that as the data property for the proxy. The users getter should by typed as ArrayCollection and return data as AC.

-=Cliff>

 Unfortunately,Cliff, that's not as easy :-[

If I cast the result to AC in the resultHandler of UserProxy like that:
...
private var resultAC:ArrayCollection;
...
public function get users():ArrayCollection{
    return data as ArrayCollection;
}
...
private function onLoadAllResultHandler(event:ResultEvent):void {
     resultAC= event.result as ArrayCollection;
     setData(resultAC);
     sendNotification(USER_LIST_RESPONSE,resultAC);
}

then in UserList:
...
[Bindable] public var users:ArrayCollection;
and finally in UserListMediator:
...
override public function handleNotification( notif:INotification ):void{
   switch ( notif.getName() ){
      ...
      case UserProxy.USER_LIST_RESPONSE
         userList.users = userProxy.users as ArrayCollection
         break;
    }
    ...
    public function get userList():UserList{
         return viewComponent as UserList;
     }
}

there is no error but my datagrid doesn't display data anymore  ???

I haven't followed the whole thread, but if the original data is just a regular array you have to create a new ArrayCollection first, using your array as the data, then you can pass around the collection by casting it.

private function onLoadAllResultHandler(event:ResultEvent):void {
     resultAC= new ArrayCollection(event.result as Array);
     setData(resultAC);
     sendNotification(USER_LIST_RESPONSE,resultAC);
}


You got it, Jasonmac  !
A big thank to you too  :D

I didn't see that event.result has to be casted to an Array first,before being casted to an AC.

Now I get an AC as in original EmployeeAdmin demo. That's cool !


 

Yes, this method does violate the encapsulation of the view component a bit as it it written, and it should be cleaned up. The method should actually be moved to the component itself.

-=Cliff>

BTW, I've just updated this demo (to version 1.4), bringing it up to the latest best practices. Check the version.txt file included with the source for details. If you are the author of a port of this demo, there should be enough info in the version.txt file to guide you through the changes if you'd like to tweak yours up to spec.

Cheers,
-=Cliff>