Archive for the ‘Flex’ Category

FSMViz Version 0.4

Wednesday, July 22nd, 2009

FSMViz for pureMVC StateMachine Utility

FSMViz for pureMVC StateMachine Utility


source code here:
http://puremvc-utilities.googlecode.com/svn/tags/fsm_viz_0.4

Added the decode to AS3.

OK, so next I’m going to rip this all down and re-architecture it.

  • create a shell and a deployment agnostic module
  • split up the encoding/decoding and parsing of the data from the data editing
  • take all the manipulation of the visualisation from the view so that the view just fires notifications
  • make the visualisation into a module so that it can be changed easily
  • add preference data so that properties can be changed easily
  • oh, and implement an FSM :)
  • FSMViz Version 0.3

    Sunday, July 12th, 2009

    FSMViz for pureMVC StateMachine Utility

    FSMViz for pureMVC StateMachine Utility


    source code here:
    http://puremvc-utilities.googlecode.com/svn/tags/fsm_viz_0.3

    OK, so I’ve added the ability to open from JSON or XML and also to decode to them. Originally, I was just going to save out to JSON as the main “file-type”, and export to an AS3 file, but after Jason MacDonald suggested it would be good to export/import the xml, I thought why not, it only took an hour.

    The only things to note are that the XML looses all the meta data that the JSON preserves. And secondly, because of this, it can only import XML that uses the naming conversions outlined below.

    Naming convertions:

  • States will have all white spaces removed and have title case. Thus “Data aquisition” becomes “DataAquisiton”
  • Actions will have white spaces removed and have camel case. Thus “Acquisition failed” becomes “aquisitionFailed”
  • In addition to the above a prefix will be added to further define the name:
  • State names will have the prefix “state/”. Thus “Data aquisition” becomes “state/DataAquisiton”
  • Action names will have the prefix “action/”. Thus “Acquisition failed” becomes “action/aquisitionFailed”
  • Entering notification names will have the same name as their associated state, but with a prefix “entering/”. Thus the entering notification name for the state “Data aquisition” will be “entering/DataAquisiton”
  • Exiting notification names will have the same name as their associated state, but with a prefix “exiting/”. Thus the exiting notification name for the state “Data aquisition” will be “exiting/DataAquisiton”
  • Changed notification names will have the same name as their associated state, but with a prefix “changed/”. Thus the entering notification name for the state “Data aquisition” will be “changed/DataAquisiton”
  • I think that these are pretty uncontentious with the exception of the choice of delimiter for the prefix. This I think will be changable by the user.

    All I have to do now is that all important conversion to an AS3 file, then I can rip the whole thing apart and rebuild it.

    So, any suggestions as to deployment? Air, online with php service?, Zinc? (Zinc? LOL only joking!)

    FSMViz Version 0.2

    Friday, July 3rd, 2009

    FSMVis for pureMVC StateMachine Utility

    FSMViz for pureMVC StateMachine Utility


    source code here:
    http://puremvc-utilities.googlecode.com/svn/tags/fsm_viz_0.2

    So this is just the visualisation and the editing of the States and Actions. I still need to implement the saving out of state, and the export of the StateConstants.as

    A few points and pointers:

  • If you do look at the code, please consider that it is a quick prototype, it will need to be optimised and architechtured (it doesn’t even have a FSM yet ;~/).
  • The visualisation is done using the Flare package
  • I am using the flex framework RSL, so the first time you visit, the app might take a fair time to initiate. However, from then on it will be cashed on your machine, so it will be much quicker.
  • I have used Joel Hook’s FSM diagram from his Piping the Machine tutorial as the initial diagram
  • You can add states with the form on the bottom left, the package is an optional field that allows grouping of states for a prettier layout using a dot as the delimiter (eg “io.out”, “io.in” or “display”). Then fill in the name and hit ENTER to submit.
  • Rolling over a state will highlight outgoing actions (red) and with ctrl down, all incoming actions (green).
  • Clicking on a state will switch to Edit mode, and bring up forms for editing the state and outgoing actions.
  • Rolling over the highlighted actions will popup their names
  • Clicking the top right x (or hitting ESC) will close the panels with out committing changes
  • Clicking the red X buttons will perminently delete the state/action (hitting DEL will delete the state)
  • Clicking the green tick (or hitting ENTER) will commit any changes
  • Clicking the strange-green-plus-arrow button (or hitting F1) will create a new Action. You can then give it a name and choose its target state.
  • FSM Visualisation 3

    Wednesday, June 24th, 2009

    Sorry I’ve been neglecting my blog recently. What with a brute force attack of malware, and working on some bread-and-butter projects, I’ve been a bit diverted.

    However, I have found the time to play around with the FSM Visualiser and have been working on the best way to display and interact with it, so I’ll probably stick something fresh up with in the next week or so.

    FSMViz on Google Code

    Thursday, May 14th, 2009

    just put the FSMViz project on my google code page.

    To grab from the svn use:

    http://puremvc-utilities.googlecode.com/svn/trunk/fsmviz.

    FSM Visualisation 2

    Saturday, May 9th, 2009

    UPDATE: removed this demo due to it getting infected. Will upload a newer version once I have time to work on something

    I have added some more functionality to the FSMViualisation.

    Just a few notes:

    1) I haven’t been able to add labels to the actions (arrows) yet (well, not prettily anyhow).

    2) I have used the BundledEdgeRouter which makes those nice arrows. The problem with this is that any arrow that connects the same two nodes will lie on the same line.

    3) at the moment, to update the diagram, I am having to edit my VOs, parse them into a Flare Data object, then construct a new Visualisation with it. It seems a bit expensive (not that affects the speed at all).

    4) you can add States into a package. This does not affect any of the code that will eventually be exported, but does allow you to group the state together, and makes the diagram look far more appealing.

    Asynch StateMachine Demo

    Sunday, January 4th, 2009

    I’ve whipped up a quick demo for the pureMVC StateMachine utility, illustrating the encapsulation of an asynchronous process (loading external images) within a state.

    State Diagram:

    The red LOADING state represents the non-interactive state, were the laoding takes place. The state is left when all the images are loaded (to DISPLAY), or an error occurs (to READY).

    Demo App:

    Brighton Freelance Flash/Flex Developers

    Friday, November 21st, 2008

    In the spirit of community, I am posting a list of AS3 developers whom I would personally recommend, should I (obviously top of this list) not be available.

    These are top guys, contact them now!

    Neil Manuell (revision)
    Matt Pearson (zenbullets)
    Matt Sayers (soplausable)
    Owen Bennett (steamboy)
    Rich Willis (rich text format)
    Nikos Chagialas (devGallery)
    and
    Pedr Brown

    These guys are all members of the award nominated social network of FlashBrighton

    pureMVC simple StateMachine utility

    Sunday, October 12th, 2008

    *Update see this post for the latest version*

    Here is an implementation of a simple State Machine for pureMVC that I whipped up for a project. This is really useful for anyone creating applications, honest, its saved my life a few times :) It suddenly occurred to me that because its so simple I’ve been taking its power for granted, and I should share it for the greater geek good. I’ve been using it in combination with trilec’s command chaining utility as a way of controling my command structures.

    Have put the code in the svn on my google code page and will prepare a download when I’ve documented it.

    Initiate the StateMachine

    // instanitate
    var stateMachine:StateMachine = new StateMachine();
    // register with the facade before registering any commands
    facade.registerMediator(stateMachine);
    // create a state
    var state:State = new State(ApplicationStates.STATE_ONE)
    // register the commands to be triggered when
    // entering and exiting that state
    stateMachine.registerStateChangeCommands(EnterStateOne,
                                             ExitStateOne,
    				         state);
    // repeat for each state (this can be done any time)
    state = new State(ApplicationStates.STATE_TWO)
    stateMachine.registerStateChangeCommands(EnterStateTwo,
                                             ExitStateTwo,
    				         state);
    

    Changing State
    This is very simple, just send a notification from anywhere within the pureMVC framework with a new state as its body:

    // create a state
    var state:State = new State(ApplicationStates.STATE_TWO)
    sendNotification(StateNoteNames.CHANGE_APPLICATION_STATE,
                     state))
    

    Flex AS3/Air projects swcs

    Thursday, July 31st, 2008

    check out this very useful article:
    Turning a Flex Actionscript project into a Flex AIR project
    as far as I can make out, the only swcs you need for a flex as3/air project (no flex-framework) are:

    playerglobal.swc
    flex.swc
    utilities.swc
    airglobal.swc
    airframework.swc
    servicemonitor.swc