Ultrashock Forums > Flash > ActionScript > OOP
App: MVC Gallery

You are currently viewing our website as a guest which gives you limited access to forums, files and other resources.

Click here to join now for free, and start interacting with our members, download files and much more!

Click here if you are looking for our Flash files and other professional assets.
 
Post Reply | View first unread | Rating: Thread Rating: 7 votes, 4.57 average. Search this Thread | Thread Tools | Display Modes
<<|<|4|5|6| Page 6 of 6
wraevn's Avatar wraevn wraevn is offline wraevn lives in United States 2007-10-09 #201 Old  
Sorry - just wanted to be the 200th post here ... I'm such a whore.

[edit]
ooh - and the 6th page as well!
[/edit]
Reply With Quote  
Nutrox's Avatar Nutrox Nutrox is offline Super Moderator Nutrox lives in United Kingdom 17 Creative Assets 2007-10-09 #202 Old  
Last edited by Nutrox : 2007-10-09 at 20:53.
After a wee bit of thinking I have decided to let developers choose if they want to implement static constants (for the event types) into the framework. I won't try to enforce static constants into the framework except for BaseModel.EVENT_UPDATE which is the default event type dispatched from Models.

I'm not going to try and do anything fancy with Model/Controller references either, again, developers can always customise the framework if they want to adjust the way certain things work.

By default, Controllers are added to Views, and Views are added to Models. This is essentially the Observer pattern but the pattern isn't enforced using IObserver and IObservable interfaces.

ActionScript Code:
  1. model = ModelLocator.getInstance().getModel( "id" );
  2. view = new View();
  3. controller = new Controller();
  4.  
  5. model.addView( view );
  6. view.addController( controller );
ActionScript Code:
  1. modelA = ModelLocator.getInstance().getModel( "idA" );
  2. modelB = ModelLocator.getInstance().getModel( "idB" );
  3. viewA = new ViewA();
  4. viewB = new ViewB();
  5. viewC = new ViewC();
  6. controllerA = new ControllerA();
  7. controllerB = new ControllerB();
  8.  
  9. modelA.addView( viewA );
  10. modelB.addView( viewB );
  11. modelB.addView( viewC );
  12.  
  13. viewA.addController( controllerA );
  14. viewB.addController( controllerA );
  15. viewC.addController( controllerB );
...and so on.

I will be sticking with the way the Controller registers and executes Commands. The Controller receives an event and executes a Command based on the type of event. In a nutshell, the Controller is dumb, all of the logic required to update Models is contained within Commands. Commands know which Model(s) they need to update (references are obtained via the ModelLocator), and they can call upon Services (using the ServiceLocator) in the usual way.

M &raquo; V &raquo; C &raquo; CMD &raquo; [SRV &raquo; CMD &raquo;] M
&nbsp;
Reply With Quote  
Nutrox's Avatar Nutrox Nutrox is offline Super Moderator Nutrox lives in United Kingdom 17 Creative Assets 2007-10-09 #203 Old  
Originally posted by wraevn
Here ya go - an AS3 port of the original MVC Gallery

AS3 MVC Gallery
It is looking very good mate. I have only skimmed over the classes but I will take a proper look at everything shortly.

I'm not sure if this is a bug or not, but the images seemed to enter a "slide show" mode of some kind and I couldn't stop it, and I'm not sure how I started it either.

Good work though. It looks like you are getting to grips with AS3 very quickly.
Reply With Quote  
wraevn's Avatar wraevn wraevn is offline wraevn lives in United States 2007-10-09 #204 Old  
The little button in the upper-middle starts slideshow mode ... can't recall if there's a way to stop it ... the lower-middle starts random slideshow mode. Should be the same as the AS2 gallery.
Reply With Quote  
wraevn's Avatar wraevn wraevn is offline wraevn lives in United States 2007-10-10 #205 Old  
Okay ... I think I might be starting to get a grip on things here ...

I've created a UML diagram of my RIA based on Nutrox's Neondust framework HERE

If you want to be able to load it into gModeler, HERE is the XML you'll need.

Codemonkey - Nutrox - et al ... could you have a gander and see if I'm on the right track? I may have some association relationships mixed up (I struggle w/ associations) but I think you'll get the idea.

Based on advice from previous posts I have:

1 Model which will contain all data, divided into 3 sections: Department, Product and Design. Model has 2 views: ProductConfig and Design.

1 View, which serves as the base class for many views. View has a Controller.

1 Controller to handle everything

The Design view has a Stage view, ToolBar view, PricingPalette view, LayersPalette view and an OptionsBar view, all of which extend View.

The LayersPalette view has ClipArtTab, StockArtTab and UserArtTab views, all of which extend LayersPalette.

The OptionsBar view has TextOptions, ImageOptions, ShapeOptions and ExtrasOpptions views, all of which extend OptionsBar.

... reading what I've got above, perhaps should not the Model have View, not ProductConfig and Design? Other thoughts?
Reply With Quote  
Codemonkey's Avatar Codemonkey Codemonkey is offline Super Moderator Codemonkey lives in Netherlands 2007-10-10 #206 Old  
Originally posted by wraevn
Codemonkey - Nutrox - et al ... could you have a gander and see if I'm on the right track? I may have some association relationships mixed up (I struggle w/ associations) but I think you'll get the idea.
I can't spot anything wrong with it at a glance. You have a fine grained view structure though... are all those components views for your model? What events are they listening to (like disableControlls etc?).

Originally posted by wraevn
Based on advice from previous posts I have:

[..]

... reading what I've got above, perhaps should not the Model have View, not ProductConfig and Design? Other thoughts?
That's all looking good. I just didn't get that last sentence there...
Reply With Quote  
Codemonkey's Avatar Codemonkey Codemonkey is offline Super Moderator Codemonkey lives in Netherlands 2007-10-10 #207 Old  
Originally posted by Nutrox
I will be sticking with the way the Controller registers and executes Commands. The Controller receives an event and executes a Command based on the type of event.
How are the events mapped to the right chain of commands, if the user decides to not use controller centric events? In other words, when the events->commands aren't mapped 1-on-1 in some associative array...
Reply With Quote  
wraevn's Avatar wraevn wraevn is offline wraevn lives in United States 2007-10-10 #208 Old  
So my thoughts went like this:

When you're configuring a product, you see ProductConfig view. You update the data, other stuff in the view changes, etc.

Then you switch to Design View (so ProductConfig/Design is a toggle).

The Design view is comprised of many different views depending on the state of the design/product/tool selected/layer selected etc.

All the data the view needs is in the Design portion of the Model.

The OptionsBar view for example hosts the generic functions all OptionsBars will need. The TextOptions therefore view will be listening for when a text layer or text object has been selected. Then it can toggle on and others can toggle off.

Basically, I've divided the Design screen into managable components, each of which contains UI elements and interactive elements that alter the view-state of the entire Design. This way, it's more easily skinable, adaptable and extensible.
Reply With Quote  
Codemonkey's Avatar Codemonkey Codemonkey is offline Super Moderator Codemonkey lives in Netherlands 2008-02-09 #209 Old  
Here's a heads up for a very nice MVC framework, pureMVC. It deals in MVC a little bit like in our discussions here, and takes the separation issue a bit further. It's been put up there with cairnGorm et all.

Commands I'm a big fan of. Mediators I'm not sure (a Mediator is basically the view with the UI->Controller interaction seperated in a different class). One thing I'm not ready to accept is the need to put proxies in between the model and the mediators/commands. Apparently what they accomplish is a modularized business model consisting entirely of proxies that each govern their own interaction and notifications. It seems to me that it only unnecessarily bloats the model by a couple of factors.

Interesting enough though. Take a look at this pureMVC diagram as well.
Reply With Quote  
mindtwitch's Avatar mindtwitch mindtwitch is offline mindtwitch lives in United States 2008-04-22 #210 Old  
Sorry if this questions has already been asked and answered I've gone through the thread and didn't see anything related.

I'm using the original MVC sample files and have modified the AbstractView and AbstractController files to use accessors instead of straight methods (ie: getSomething()). Examples are below of changed files.

What I am having trouble with is I'm getting one Error on compile that I can't figure out. On the line in AbstractView controller.view = this in the set controller accessor, I am getting an error saying view is not a property. I was wondering if this is because of the changes I made to the IController and IView interfaces which are now empty since I don't use any of those methods now.

Any insight or help on this matter would be greatly appreciated.

Also, probably obvious but I am working in AS2. - Thanks - mt

Here are the changes I've made.

AbstractController.as
ActionScript Code:
  1. import patterns.mvc.*;
  2. import patterns.observer.*;
  3.  
  4. class patterns.mvc.AbstractController implements IController
  5. {
  6.     private var _model:Observable;
  7.     private var _view:IView;
  8.    
  9.    
  10.     public function AbstractController(m:Observable) {
  11.         // Set the model.
  12.         trace("AbstractController");
  13.         model = m;
  14.     }
  15.    
  16.    
  17.     //////////////////////////////
  18.     // ACCESSORS
  19.     //////////////////////////////
  20.     public function set model( m:Observable ):Void
  21.     {
  22.         _model = m;
  23.     }
  24.    
  25.     public function get model():Observable
  26.     {
  27.         return _model;
  28.     }
  29.    
  30.     public function set view( v:IView ):Void
  31.     {
  32.         _view = v;
  33.     }
  34.    
  35.     public function get view():IView
  36.     {
  37.         return _view;
  38.     }
  39.    
  40.    
  41.    
  42. }

AbstractView.as
ActionScript Code:
  1. import utils.error.AbstractError;
  2. import patterns.mvc.*;
  3. import patterns.observer.*;
  4.  
  5. class patterns.mvc.AbstractView implements IObserver, IView
  6. {
  7.    
  8.     private var _model:Observable;
  9.     private var _controller:IController;
  10.    
  11.    
  12.     public function AbstractView( m:Observable, c:IController )
  13.     {
  14.         model = m;
  15.        
  16.         if(c !== undefined)
  17.         {
  18.             controller = c;
  19.         }
  20.     }
  21.    
  22.     /**
  23.      * A do-nothing implementation of the Observer interface's
  24.      * update() method. Subclasses of AbstractView will provide
  25.      * a concrete implementation for this method.
  26.      */
  27.     public function update(o:Observable, infoObj:Object):Void
  28.     {
  29.         throw new AbstractError("update");
  30.     }
  31.    
  32.    
  33.     ///////////////////////////////////////////////
  34.     // ACCESSORS
  35.     ///////////////////////////////////////////////
  36.    
  37.    
  38.     //////////////
  39.     // MODEL
  40.     public function set model( m:Observable ):Void
  41.     {
  42.         _model = m;
  43.     }
  44.    
  45.     public function get model():Observable
  46.     {
  47.         return _model;
  48.     }
  49.    
  50.    
  51.     //////////////
  52.     // CONTROLLER
  53.     public function set controller( c:IController ):Void
  54.     {
  55.         _controller = c;
  56.         controller.view = this;
  57.     }
  58.    
  59.     public function get controller():IController
  60.     {
  61.         if( _controller === undefined )
  62.         {
  63.             controller = defaultController;
  64.         }
  65.        
  66.         return _controller;
  67.     }
  68.    
  69.     public function get defaultController():IController
  70.     {
  71.         return null;
  72.     }
  73.    
  74.    
  75.    
  76. }
Reply With Quote  
Codemonkey's Avatar Codemonkey Codemonkey is offline Super Moderator Codemonkey lives in Netherlands 2008-04-22 #211 Old  
Hey twitch, IController doesn't have those methods, so the flash compiler doesn't recognize them. Either add the methods to the interface or cast IController as AbstractController.

ActionScript Code:
  1. AbstractController(controller).view = this;
But I wouldn't do this, since you already have an interface, it wouldn't make sense to not add these methods to it...
Reply With Quote  
mindtwitch's Avatar mindtwitch mindtwitch is offline mindtwitch lives in United States 2008-04-22 #212 Old  
I was wondering if I could just cast to Abstract since IController is empty. There are no method definitions in the interface at all. I can't add accessor methods to the Interface can I? I've tried before and it returns errors.

Thanks for the tip. I might just scratch the interface all together since it doesn't seem that I really need it. However I do question whether this goes against OOP principles of coding to an interface instead of an implementation. Just seems weird to me that you can't define properties/accessors in the interface. Or can you?
Reply With Quote  
Codemonkey's Avatar Codemonkey Codemonkey is offline Super Moderator Codemonkey lives in Netherlands 2008-04-23 #213 Old  
it's because setters/getters with set and get appear as properties to the outside world, not actually an interface. The fact they are really are methods is not guaranteed to the outside world, hence you can't add those kind of setters/getters to an interface.

In your case you might as wel remove the interface itself, since you also have an AbstractController, which really also defines an interface.
Reply With Quote  
mindtwitch's Avatar mindtwitch mindtwitch is offline mindtwitch lives in United States 2008-04-23 #214 Old  
Awesome, thanks a ton. Both for your help here and for starting this thread. It's a great resource.
Reply With Quote  
mindtwitch's Avatar mindtwitch mindtwitch is offline mindtwitch lives in United States 2008-04-23 #215 Old  
One more question, but probably not the last.

I'm creating a template system where there are various components (not Flash Components, just various movieClips in the library). I think I've got everything straightened out for the TemplateModel to load/parse/prepare the template file and then pass it to the TemplateView to do it's magic. Where I'm having a bit of trouble with flow is for the components.

In my mind each component should have it's own MVC as well, no problem here. Where I'm getting stuck is I need those components to talk back to the Template system to let it know when the component has been loaded, added and processing is complete etc. Where is the hook back into the Template MVC, is it through the TemplateController or directly back to the TemplateModel? Or should the ComponentController notify through the Observer? In turn the TemplateModel should be able to notify each component of any changes as well, style and layout changes etc. I'm sure the TemplateView handles notifying the Components.

Any insight and/or guidance would be greatly appreciated.

Thanks,
-mt
Reply With Quote  
Codemonkey's Avatar Codemonkey Codemonkey is offline Super Moderator Codemonkey lives in Netherlands 2008-04-23 #216 Old  
Going on the information you provided:

You're right, each component would have its own MVC model. All Flash components actually have this, although a slightly different variant (where the controller/view is merged).

To keep things simple (relatively) between multiple components and a central templating mvc system, I probably wouldn't bother trying to keep track of the template model in the component controller or some other coupling like that. Instead, I would probably have the component controller registered as simple listener to the template model and have neutral 'events' like styleChange.

If you are still going the coupled model way (template/component), that's fine, just use the template controller inside the component controller. Remember, the controller is the operator of the machine (model). Since the component itself is somewhat of an observer of the template model like a view, it would propagate action's to the template model's controller. Talking from operator to operator so to speak. Have each controller operate on their own level: component controller on component management and template controller on template system management.

But as I said, I probably wouldn't do that, since that means the component controller needs to have knowledge of the templating's operation manager, the controller. With a neutral event based updating mechanism, I'd use simple listeners (both ways perhaps) to keep things decoupled and clean and simple. Doing this would also mean you could use the component completely outside of the templating system, using the right events.

I hope that made some sense.
Reply With Quote  
mindtwitch's Avatar mindtwitch mindtwitch is offline mindtwitch lives in United States 2008-04-23 #217 Old  
Seems to make sense but I may have to read it a couple more times. I like the idea of using simple events, would this be through the Observer to send out notifications? Everything does need to be decoupled in that the template system simply parses an XML template file that is then used by the view to place each component with properties etc. But the idea is that the components could also be used seperately if a developer wanted to leverage them via Actionscript. There definately needs to be a two way communication though where the templateSystem knows when a component has been loaded and is available etc. There is also targeting where a playButton (MediaControl) targets a component that can be played (ie: Video, AudioPlayer, PhotoSlideShow etc.)

It could be possible that once I dive into this more I will find that this may not be necessary though since I am trying to refactor some existing code and seperate everything out nicely.

As always, many thanks to you for the detailed explanation and help.

- mt
Reply With Quote  
osiris22usa osiris22usa is offline 2008-08-10 #218 Old  
thanks for the insight guys. i use this thread as a refresher when i'm feeling a little forgetful. thanks mang.
Reply With Quote  
Pop-Shock Pop-Shock is offline Pop-Shock lives in United Kingdom 2008-08-16 #219 Old  
Hi CodeMonkey, Nutrox, et al,

Im just starting on my journey into MVC using AS2, (Im stuck with AS2 for now with Flash Lite.)

I was wondering how you go about visualising an MVC project, especially large UI applications, before you start programming? Obviously I need to look at the visual elements in the application, how the user interacts with them, and what is displayed back to the user once they have interacted. But I cant seem to grasp where in the MVC pattern all these things go!

Do you have any tips and tricks to get a large MVC project started?
Reply With Quote  
<<|<|4|5|6| Page 6 of 6
Thread Tools
Display Modes Rate This Thread
Rate This Thread: