Your SlideShare is downloading. ×
HP Enyo
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

HP Enyo

3,436
views

Published on

Presentation on HP Enyo, a HTML5 framework for webOS and other platforms. …

Presentation on HP Enyo, a HTML5 framework for webOS and other platforms.

Presented at the London Ajax conference on July 2nd 2011

Published in: Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
3,436
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
83
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
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Transcript

    • 1. HP EnyoShane O’SullivanwebOS, Dojo & Facebook hacker@chofter
    • 2. The Next 45 MinutesWhat is it?Why is it cool?Show Me The Code!Building a UIThe IntertubesDemo
    • 3. What Is EnyoHP’s new HTML5 frameworkReplaces Mojo, the original webOS developmentframeworkOut now on HP TouchPad, used to build all “native”apps
    • 4. Why is Enyo Cool?
    • 5. Cross PlatformDevelop in ChromeWebOS not required (mostly)Easily fake remote services with hardcoded dataiOS support coming
    • 6. Fast. Very Fast. Pure JavaScript, no templates Highly memory efficient No references to nodes stored Flexible, class-leading infinite scrolling list
    • 7. Easy to Extend & CustomiseKind of object orientedInheritance based, nice clear css rulesAll the source available Even the source to all HP’s TouchPad apps.
    • 8. Really Rapid DevelopmentVery opinionated development model Like it or use something elseLeads to a very fast development processMany, many ready to use components come asstandard
    • 9. Show Me Code Already!
    • 10. HTML Is Always Simple<html> <head> <script src="enyo.js" type="text/javascript"> </script> </head> <body> <script type="text/javascript"> enyo.create({kind: "HelloWorld"}) .renderInto(document.body); </script> </body></html>
    • 11. JS Is Less Simple
    • 12. OK, so it’s still easyenyo.kind({ name: "HelloWorld", kind: enyo.Control, content: “Hello World!”});
    • 13. Generates HTML<div>Hello World</div>
    • 14. Let’s add some eventsenyo.kind({ ... clickHandler: function(event){ // Do something }});
    • 15. Let’s add a child components: [ { kind: ‘Control’, content: ‘Click Me’, onclick: ‘childClicked’ } ], childClicked: function(){...
    • 16. No manual event addingRefer to handler functions by a string nameEnyo attaches and removes event handlersReduces chances of memory leaksAuto-route event handling using convention basedfunction names clickHandler, dblclickHandler, touchstartHandler
    • 17. Define Public Propertiespublished: { firstName: “”},firstNameChanged: function(old){ var n = this.getFirstName();}
    • 18. Define Custom Eventsevents: { onSomething: “”},nameChanged: function(old){ this.doSomething(“Foo”);}
    • 19. Easily invoke any event Defining an event creates a function “do” + event name Speeds development through adhering to naming conventions
    • 20. Working with the Intertubes
    • 21. Components not just for UIAdd any Enyo instance to components Not just UI elementsAjax requestsNative webOS servicesYour own services
    • 22. Make An Ajax Callcomponents: [ { kind: ‘WebService’, name: ‘yahoo’, url: ‘http://....’, onSuccess: ‘handleData’ }]
    • 23. Make An Ajax CallclickHandler: function() { this.$.yahoo.call();},handleData: function(sender, resp) { // Do something}
    • 24. Any Caveats?Licensing not yet announcedNot yet fully proven to work cross platformNot optimized for a non-installed app. Too big, not possible to slice and dice
    • 25. So what’s next?Sign up at developer.palm.com and download Enyo webOS 3.0 SDKDemos!
    • 26. And finally.... the shameless plug Do you know JS, HTML5, Mobile Dev? Facebook is hiring! facebook.com/careers