Your SlideShare is downloading. ×
0
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Enyo for JS Nerds - Austin JS Meetup, April 2012
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Enyo for JS Nerds - Austin JS Meetup, April 2012

1,997

Published on

Ben Combee's slides on the Enyo & Ony

Ben Combee's slides on the Enyo & Ony

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

  • Be the first to like this

No Downloads
Views
Total Views
1,997
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
32
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Enyo + Onyx for JS Nerds Ben Combee (@unwiredben) Austin JavaScript Meetup, April 2012Wednesday, April 18, 2012
  • 2. Wednesday, April 18, 2012
  • 3. We need 500 apps for the TouchPad, stat! (that was Enyo 1.0)Wednesday, April 18, 2012
  • 4. We want apps from devs that aren’t HTML+CSS experts. They need to run everywhere.Wednesday, April 18, 2012
  • 5. How?Wednesday, April 18, 2012
  • 6. Components. As seen in Visual Basic. They’re not sexy. They work.Wednesday, April 18, 2012
  • 7. iOS & Android Chrome & Safari Firefox & IE8+ Open webOS Windows 8Wednesday, April 18, 2012
  • 8. Open Source. Apache 2.0.Wednesday, April 18, 2012
  • 9. All source is on github.com/enyojsWednesday, April 18, 2012
  • 10. Enyo 2.0: The PartsWednesday, April 18, 2012
  • 11. boot - load all the sourceWednesday, April 18, 2012
  • 12. package.js: enyo.depends( “app.js”, “../css/app.css”, “$lib/onyx”);Wednesday, April 18, 2012
  • 13. kernel - OOP, there it isWednesday, April 18, 2012
  • 14. enyo.kind() is a constructor factoryWednesday, April 18, 2012
  • 15. enyo.kind({ name: “tv.NewGirl”, kind: “TelevisionShow”, show: function() { this.inherited(arguments); system.play(“ng001.mp4”); } }); var ng = new NewGirl();Wednesday, April 18, 2012
  • 16. enyo.Object provides property publishingWednesday, April 18, 2012
  • 17. enyo.kind({ name: “UPC”, kind: enyo.Object, published: { productID: “0000000000” }, create: function() { this. productIDChanged(); }, productIDChanged: function(oldValue) { this.barcode = generate(this.productID); } });Wednesday, April 18, 2012
  • 18. var x = new UPC({ productID: “123456789X” }); x.setProductID(“5678900002”); pID = x.getProductID();Wednesday, April 18, 2012
  • 19. enyo.Component enables encapsulation and eventsWednesday, April 18, 2012
  • 20. enyo.kind({ name: “SithLord”, kind: “Jedi”, events: { onSpeak: “” }, scream: function(message) { doSpeak({ message: message, tone: “whiney” }); }) });Wednesday, April 18, 2012
  • 21. enyo.kind({ name: “SithLords”, components: [ { kind: SithLord, name: “DarthVader”, onSpeak: “listenToToys” }, { kind: SithLord, name: “Palpatine” }, { kind: SithLord, name: “DarthSidious” } ], listenToToys: function(inSender, inEvent) { alert(inEvent.mesage); } });Wednesday, April 18, 2012
  • 22. var toys = new SithLords; toys.$.DarthVader.setWeapon(lightsaber); toys.$.DarthVader.throw(toys.$.Palpatine); toys.$.DarthVader.scream(“NOOOOOOO!”);Wednesday, April 18, 2012
  • 23. enyo.UIComponent provides hooks for layout controlWednesday, April 18, 2012
  • 24. enyo.Signals is routing for app-level eventsWednesday, April 18, 2012
  • 25. lang.js - utilities log.js - logging job.js - setTimeout wrapper animation.js - math + reqFrame macroize.js - templatesWednesday, April 18, 2012
  • 26. dom - dealing with HTMLWednesday, April 18, 2012
  • 27. enyo.Control: a rendering engine for HTMLWednesday, April 18, 2012
  • 28. enyo.kind({ name: “BumperSticker”, kind: enyo.Control, tag: “div”, content: “Keep Austin Weird!”, style: “color: blue; font-size: 96pt” }); var bs = new BumperSticker(); bs.renderInto(document.body);Wednesday, April 18, 2012
  • 29. dispatcher.js: hooks all the standard DOM events into the Enyo schemeWednesday, April 18, 2012
  • 30. enyo.kind({ name: “BumperSticker”, content: “Keep Austin Weird!”, style: “color: blue; font-size: 96pt”, tap: function() { alert(“someone bumped me!”); } }); var bs = new BumperSticker(); bs.renderInto(document.body);Wednesday, April 18, 2012
  • 31. ajax - data-access through XHR & JSONPWednesday, April 18, 2012
  • 32. function apiOK(inAsync, inValue) { alert( “success: “ + inValue ); } function apiFAIL(inAsync, inError) { alert( “FAIL: “ + inError ); } var a = new enyo.Ajax({ url: “http://example.org/api” }).response(apiOK).error(apiFAIL).go();Wednesday, April 18, 2012
  • 33. ui - building blocks for making themed widgetsWednesday, April 18, 2012
  • 34. Button.js BaseLayout.js Checkbox.js DragAvatar.js Image.js Group.js Input.js GroupItem.js Repeater.js Selection.js RichText.js ToolDecorator.js Select.jsWednesday, April 18, 2012
  • 35. touch - enyo.Scroller & touchscreen supportWednesday, April 18, 2012
  • 36. enyo.Scroller handles how to show 10 lbs of content in a 2lb boxWednesday, April 18, 2012
  • 37. ...and now, let’s introduce ONYXWednesday, April 18, 2012
  • 38. enyo is the core (think jQuery)Wednesday, April 18, 2012
  • 39. Onyx is our jQuery UIWednesday, April 18, 2012
  • 40. CSS themes + JS behavior + composite controlsWednesday, April 18, 2012
  • 41. Onyx Sampler - live views of all Onyx controls & sample codeWednesday, April 18, 2012
  • 42. Support and SamplesWednesday, April 18, 2012
  • 43. API Viewer - pulls inline documentation from live source tree enyojs.com/apiWednesday, April 18, 2012
  • 44. CryptoTweets - game using enyo & onyx & web services combee.net/cryptotweetsWednesday, April 18, 2012
  • 45. Community Gallery - enyo.js/galleryWednesday, April 18, 2012
  • 46. Community Forums - forums.enyojs.comWednesday, April 18, 2012
  • 47. Blog - blog.enyojs.comWednesday, April 18, 2012
  • 48. Twitter: @enyojsWednesday, April 18, 2012

×