The document discusses WebOS and its similarities to Ruby on Rails, highlighting the use of MVC architecture in Mojo applications. It provides a comparison of coding styles and methods for handling events and AJAX requests in both HTML and WebOS environments. The document also suggests resources for learning JavaScript and further study on WebOS.

1. webOS The Platform You Already Know Eric Marthinsen and Gary Smith Agile Commerce

2. Agenda Terminology Technologies Similarities Differences What next?

3. Terminology Palm Pre webOS Mojo

4. Technologies HTML CSS JavaScript

5. Similarities Structure Model View Controller (MVC) paradigm Very close in style and form to Ruby on Rails Philosophy Helper tools, similar to Ruby on Rails Convention over configuration Coding HTML, CSS, and JavaScript – follows typical web paradigms

6. Structure Ruby on Rails app controllers models views public images stylesheets Mojo app assistants models views images stylesheets Mojo applications are MVC applications.

7. Philosophy Mojo follows closely to many core concepts in Ruby on Rails. Convention over configuration ruby script/generate versus palm-generate

8. Code: HTML HTML <div style=”background: red”> This is some text </div> webOS <div style=”background: red”> This is some text </div>

9. Code: Finding an Element HTML document.findElementById(“id”) $('id') webOS document.findElementById(“id”) $('id') this.controller.get('id')

10. Code: Wiring up an Event Handler HTML elem.onclick = this.handler Event.observe('elemName', 'click', this.handler) webOS Mojo.Event.listen(element, Mojo.Event.tap, this.handler)

11. Code: Ajax A typical AJAX call: var url = &quot;http://api.example.com&quot;; new Ajax.Request(url, { method: 'get', onSuccess: function(transport) { console.log(&quot;SUCCESS!!!&quot;); }, onFailure: function() { console.log(&quot;FAILURE&quot;); } });

12. Code: Ajax Accessing the GPS System Service in Mojo: var url = &quot;palm://com.palm.location&quot;; this.controller.serviceRequest(url, { method:&quot;startTracking&quot;, parameters:{ subscribe: true }, onSuccess: function(result){ console.log(&quot;GOT A NEW LOCATION&quot;); }, onFailure: function(result){ console.log(&quot;FAILURE&quot;); } });

13. Code: Widgets SWFobject <div id=&quot;myContent&quot;></div> swfobject.embedSWF( &quot;myContent.swf&quot;, &quot;myContent&quot;, &quot;300&quot;, &quot;120&quot;, &quot;9.0.0&quot; );

14. Code: Widgets Simple slider widget in jQuery <div id=&quot;slider&quot;></div> $(&quot;#slider&quot;).slider();

15. Code: Widgets TextField in Mojo <div id=&quot;searchString&quot; x-mojo-element=&quot;TextField&quot;></div> this.controller.setupWidget( &quot;searchString&quot;, { hintText: 'enter search criteria', multiline: false }, this.searchModel = { value: “” } );

16. Differences: JavaScript It is not like Java or a scripting language More like Self or Scheme It has objects, but no classes Functions can have properties (which can be functions themselves) “ this” isn't always that

17. Differences: Mojo API Any platform has a set of APIs, Mojo is no exception

18. What Next? Learn JavaScript JavaScript: The Good Parts Douglas Crockford

19. What Next? Get Mitch's Book Palm webOS Mitch Allen Available through O'Reilly

20. One Last Resource