Robotlegs on Top of Gaia

2,830 views

Published on

Jesse Warden shows you how to utilize Robotlegs on top of Gaia Flash Framework.

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,830
On SlideShare
0
From Embeds
0
Number of Embeds
45
Actions
Shares
0
Downloads
41
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Robotlegs on Top of Gaia

  1. 2. Who <ul><li>Jesse Warden </li></ul><ul><li>Flex & Flash Consultant </li></ul><ul><li>Career: Director, Flash, Flex </li></ul><ul><li>Education: Art, Self-Taught Coder </li></ul>
  2. 3. Robotlegs/Gaia <ul><li>Gaia </li></ul><ul><li>Robotlegs </li></ul><ul><li>Using Them Together </li></ul>+ = Hot Dog!
  3. 4. Why? <ul><li>Flash Sites: Scaleable Mess </li></ul><ul><li>Flex Sites: Re-invent the wheel </li></ul>...Badly.
  4. 6. Gaia <ul><li>Framework & Toolset for Building Flash Websites </li></ul><ul><li>Inspired by Ruby on Rails </li></ul>
  5. 7. Gaia Inventor <ul><li>Steven Sacks </li></ul><ul><li>Gaia Inventor </li></ul><ul><li>stevensacks.net </li></ul><ul><li>Twittah: stevensacks </li></ul>
  6. 8. Industry Tools <ul><li>SWFObject </li></ul><ul><li>SWFAddress </li></ul><ul><li>TweenLite </li></ul><ul><li>Thunderbolt </li></ul>
  7. 9. Example Sites Client Sites Mercedes, Disney, Rolling Rock, Honda, Burn After Reading, Keith Urban, Dermalogica, Absolut, Star Trek Movie, Electronic Arts: Tiberium, NIP/Tuck, 180 Energy Drink
  8. 10. Site XML <ul><li><site title=&quot;Gaia Scaffold Site&quot;> <page id=&quot;index&quot; src=&quot;index.swf&quot;> <page id=&quot;nav&quot; src=&quot;nav.swf&quot;> <page id=&quot;home&quot; src=&quot;home.swf&quot; title=&quot;Home&quot;> </li></ul><ul><li><asset id=”music” src=”rock.mp3”/> </li></ul><ul><ul><ul><ul><ul><li></page> </page> </page></site> </li></ul></ul></ul></ul></ul><ul><li></page> </page> </page></site> </li></ul>
  9. 11. Scaffolding
  10. 12. Gaia’s API <ul><li>goto(); </li></ul>
  11. 13. Transitions <ul><li>transitionIn(); </li></ul><ul><li>transitionOut(); </li></ul><ul><li>transitioninComplete(); </li></ul><ul><li>transitionOutComplete(); </li></ul>
  12. 14. Flows Normal Preload Reverse Cross
  13. 15. Depth
  14. 16. Assets
  15. 17. Preloading <ul><li>multiple Files, Byte Accuracy </li></ul><ul><li>Override Runtime API </li></ul><ul><li>Pre-loaders for Pages </li></ul><ul><li>Pre-loaders for Assets </li></ul>
  16. 18. Other Features <ul><li>SEO Scaffolding (yes, it works) </li></ul><ul><li>DEEPlinking API on top of SWFAddress </li></ul><ul><li>Bindings support in Site.xml </li></ul>
  17. 19. Gaia <ul><li>Bread and Butter </li></ul>
  18. 20. Robotlegs <ul><li>MVCS Framework </li></ul><ul><li>ActionScript 3 </li></ul>
  19. 21. Robotlegs <ul><li>Pure AS3 = Yes </li></ul><ul><li>Flex = Yes </li></ul><ul><li>AIR = Yes </li></ul><ul><li>Flash = Yes (CS4/CS5) </li></ul>
  20. 22. Robotlegs <ul><li>Shaun Smith </li></ul><ul><li>Robotlegs Inventor </li></ul><ul><li>Shaun.boyblack.co.za </li></ul><ul><li>Twittah: darscan </li></ul>
  21. 23. Robotlegs <ul><li>Comes with a Reference Implementation (MVCS) </li></ul><ul><li>Robert Penner’s “Signals” </li></ul><ul><li>Elad Elrom’s “Passive View Example” </li></ul><ul><li>AsyncCommand </li></ul>
  22. 24. Dependency INjection <ul><li>The New “ New ” </li></ul><ul><li>All you need to know: [Inject] </li></ul><ul><li>SWiftSuspenders </li></ul><ul><li>SmartyPants IoC </li></ul><ul><li>GUICE : A Different Java Spring </li></ul>
  23. 25. Dependency Injection <ul><li>Solves PureMVC’s Casting Problem </li></ul><ul><li>var myView: viewObject as MainView; </li></ul><ul><li>var proxy:MyProxy = facade.retreiveProxy(MyProxy.NAME) as MyProxy; </li></ul><ul><li>Easier to code to Interfaces </li></ul>
  24. 26. DI Example <ul><li>private var proxy:MyProxy; var proxy:MyProxy = facade.retreiveProxy(MyProxy.NAME) as MyProxy; trace(proxy.myVO); --------------------------- </li></ul><ul><li>[Inject] public var model:MyModel trace(model.myVO); </li></ul>
  25. 28. Events <ul><li>Communications Through Events </li></ul>
  26. 29. Event Gotchas <ul><li>Tons </li></ul><ul><li>Sub-Systems </li></ul><ul><li>More Events > More properties </li></ul>
  27. 31. View <ul><li>GUI </li></ul><ul><li>Form </li></ul><ul><li>Chart </li></ul><ul><li>Video Player </li></ul><ul><li>List of Images </li></ul>
  28. 32. Dumb View <ul><li>Dumb </li></ul><ul><li>2 things </li></ul><ul><ul><li>Accept Data </li></ul></ul><ul><ul><li>Dispatch User Gestures </li></ul></ul>
  29. 34. ValueObject <ul><li>HOld “Value” </li></ul><ul><li>2nd Most Valuable Class </li></ul><ul><li>Strongly Typed </li></ul><ul><li>Can Differ From Server to help GUI </li></ul>
  30. 35. VO Gotchas <ul><li>To Build yerself... </li></ul><ul><li>...or have a Factory do it </li></ul><ul><li>constructor Params foil Serialization </li></ul><ul><li>Use Optional Values if you must </li></ul><ul><li>It changes, affects Entire App </li></ul>
  31. 36. Robotlegs <ul><li>Context </li></ul><ul><li>Mediator </li></ul><ul><li>Services </li></ul><ul><li>Model </li></ul><ul><li>Command </li></ul><ul><li>Actor (Base Class) </li></ul>
  32. 38. Context <ul><li>Initialize Framework </li></ul><ul><li>Event Bus </li></ul><ul><li>Multiple Contexts for Modular Development </li></ul>
  33. 39. Actor <ul><li>Base Class for Model and Service </li></ul><ul><li>Has Context Injected </li></ul><ul><li>Base Class to communicate to the Framework </li></ul>
  34. 41. Mediator <ul><li>Mediator Pattern </li></ul><ul><li>View Communicate w/ Framework </li></ul><ul><li>1 View per Mediator </li></ul><ul><li>Keeps Framework out </li></ul><ul><li>Not all views need Mediators </li></ul>
  35. 43. Service <ul><li>Retrieve and/or Send Data </li></ul><ul><li>Remote and/or Local Services </li></ul><ul><li>Parse Data to VO’s </li></ul><ul><li>Dispatch Success or Failure </li></ul><ul><li>Don’t Listen to Framework Events </li></ul><ul><li>Great Unit Test Candidates </li></ul>
  36. 44. Service Practices <ul><li>Doesn’t Store Data </li></ul><ul><li>Dispatch Event, has Data in It </li></ul><ul><li>Extend Actor </li></ul><ul><li>Store’s Data </li></ul><ul><li>Dispatch Event, NO Data in It </li></ul><ul><li>Extend EventDispatcher </li></ul>
  37. 45. Service Gotcha’s <ul><li>Foreign Data </li></ul><ul><li>FActories : #1 Source of Bugs </li></ul><ul><li>Compiler Doesn’t Help you </li></ul><ul><li>Manual Timeouts </li></ul><ul><li>Explode Early </li></ul>
  38. 47. Model(s) <ul><li>Observer Pattern </li></ul><ul><li>Stores Global Data </li></ul><ul><li>Usually Wraps a VO </li></ul><ul><li>Doesn’t Listen for Framework Events </li></ul><ul><li>Dispatches Data Changes </li></ul><ul><li>Persists </li></ul><ul><li>Extends Actor </li></ul>
  39. 48. Model(s) <ul><li>Re-Factor to: </li></ul><ul><ul><li>Data needs to persist </li></ul></ul><ul><ul><li>1> Mediator/Command Use Data </li></ul></ul>
  40. 50. Command <ul><li>Command Pattern </li></ul><ul><li>Controller Work </li></ul><ul><li>DRY </li></ul><ul><li>Re-Factor To </li></ul><ul><li>Doesn’t Listen to Framework Events </li></ul>
  41. 51. Command Example <ul><li>Login Form </li></ul><ul><li>Update Profile </li></ul><ul><li>Edit Server Data </li></ul>
  42. 52. User Gestures <ul><li>Command’s are Usually User Gestures </li></ul><ul><li>Login, Logout, SaveUser </li></ul><ul><li>AddTag </li></ul><ul><li>Save </li></ul>
  43. 53. Command Pro’s <ul><li>DRY </li></ul><ul><li>Centralized Logic </li></ul><ul><li>Data Problem = 2 places to look </li></ul><ul><ul><li>Service </li></ul></ul><ul><ul><li>Command </li></ul></ul><ul><li>Not Hunting Through Mediators </li></ul><ul><li>RAD (Rapid Application Development) </li></ul>
  44. 54. COmmand Con’s <ul><li>Code Bloat Early in Project </li></ul><ul><li>Handling Context Sensitive Data? ...2 Commands </li></ul><ul><li>20 User Gestures = 40 Commands </li></ul><ul><li>Commands for Everything </li></ul>
  45. 56. AsyncCommand <ul><li>Asynchronous Command </li></ul><ul><li>Why? </li></ul><ul><li>Java/C/C++ Devs Invented Command Pattern </li></ul><ul><li>Blocking Language </li></ul><ul><li>Executes Server Request and Code pauses </li></ul>
  46. 57. AsyncCommand <ul><li>ActionScript is not Blocking </li></ul><ul><li>It is Asynchronous </li></ul><ul><li>Sometimes things need to wait </li></ul><ul><li>To wait, they need context </li></ul><ul><li>To have context, they need to exist </li></ul><ul><li>Commands die immediately </li></ul>
  47. 58. AsyncCommand <ul><li>AsyncCommand’s do not Block </li></ul><ul><li>You Control when they die </li></ul><ul><li>You can handle Server responses with Context </li></ul><ul><li>React & Respond w/ Less code </li></ul><ul><li>fork to call other Commands </li></ul>
  48. 59. Gaia + Robotlegs <ul><li>Gaia builds yer Site </li></ul><ul><li>Robotlegs Handles: </li></ul><ul><ul><li>Business Logic </li></ul></ul><ul><ul><li>Application Logic </li></ul></ul>+
  49. 60. Why? <ul><li>Agency </li></ul><ul><ul><li>Shields from Ever Changing client Visuals </li></ul></ul><ul><ul><li>View Changes, App/Biz Logic Doesn’t </li></ul></ul><ul><li>Dev </li></ul><ul><ul><li>Don’t Break Gaia’s modules </li></ul></ul><ul><ul><li>RAD & Scaleable </li></ul></ul>
  50. 61. How? <ul><li>Export SWC “Magic Checkbox” </li></ul>
  51. 62. Step by Step <ul><li>Setup Gaia Project </li></ul><ul><li>Register Context in Main.as </li></ul><ul><li>Page or child View implement Interface </li></ul><ul><li>Register Interface for Mediator </li></ul>
  52. 63. Rules n’ Gotchas <ul><li>Interface for Bridge Pattern </li></ul><ul><li>Gaia Pages use Bridge Pattern </li></ul><ul><li>Not all Gaia Pages need a Mediator </li></ul>
  53. 64. Conclusions <ul><li>Gaia is the Foundation for Site </li></ul><ul><li>Robotlegs Handles Biz & App Logic </li></ul><ul><li>Together, they Build a Scaleable & Flexible Site </li></ul>
  54. 65. Questions? <ul><li>Jesse Warden </li></ul><ul><li>Twittah: jesterxl </li></ul><ul><li>jessewarden.com </li></ul>

×