17 Oct 2008 02:06 am

Take aways from today:

  • We will shift the focus from working on exercises derived immediately from the book to ones that will help students complete their projects
  • We will look for ways to create a “learning exchange” by identifying topics and techniques for which there is interest in learning and for which we have some expertise.  An example:  Drupal might be a useful content management framework for which there is both expertise and interest in this class.

Class notes:

Focus on Chapter 8 (and then Chapter 10)

  • how to use Ajax widgets, JavaScript-based programs created by others to express some functionality, as a way to a study of Ajax.
  • how to use some debugging tools such as Firebug and the JavaScript Shell that will help you make sense of these widgets

Trajectory:

  • mapping geotagged Flickr photos with Google Maps, Google Earth, and Google Mapplet.

To become a master programmer of the web browser, you should understand the following

  • Both how an ideal W3C DOM standards-compliant browser works and how various browsers actually work in various areas: how JavaScript is implemented, object model behavior, CSS, and events
  • JavaScript-based APIs and widgets such as Google Maps—what they are and how to use them
  • Nonbrowser environments for JavaScript, such as Google Gadgets, Yahoo! Widgets, and Adobe Acrobat
  • Extension mechanisms in browsers (such as Firefox add-ons)
  • JavaScript and browser debugging tools such as Firebug
  • JavaScript libraries: how they relate and what can be intermixed—and which ones are tied to which web programming frameworks
  • What people have done already on all these fronts using JavaScript and remixing the browser
  • How to write JavaScript and JavaScript widgets that can be reused by other people, including cross-platform JavaScript
  • What you can do in terms of mashups

Fortunately, you do not need to know all these things to merely get started.

Some exercises:

  • turning JavaScript off and on in the browser to compare what happens

Supporting tools:

Which JavaScript libraries to look at? One list would be the libraries supported in by the AJAX Libraries API – Google Code:

In my book (p. 210), I mention:  Dojo, Mochikit,  prototype/script.aculo.us,   Yahoo! UI Library (YUI), Rico, and OpenLaszlo.

YUI examples

1) using local storage:

in ~/public_html:

curl -v -L -X GET "http://developer.yahoo.com/yui/download/" -o yui_2.7.zip
unzip yui_2.7.zip

See:

http://people.ischool.berkeley.edu/~rdhyee/yui/examples/treeview/default_tree.html

Then run JavaScript shell, Firebug console, Chickenfoot on the tree variable.
For Chickenfoot:

var wwindow = window.wrappedJSObject;
wwindow.tree.expandAll();

2) using the Google Ajax Libraries API

See http://blog.mashupguide.net/category/google-ajax-libraries-api/ for a writeup on AJAX Libraries API – Google Code. The example calls jQuery’s getJSON function.

See how I use the API to load the YUI calendar:
http://people.ischool.berkeley.edu/~rdhyee/s09/day10/YUI.googleajax.calendar.html

Google Maps

Flickr

One Response to “s09-Day 10 Ajax/JavaScript Widgets and Their APIs”


  1. […] See Mixing and Remixing Information » s09-Day 10 Ajax/JavaScript Widgets and Their APIs […]

Trackback this Post | Feed on comments to this Post

Leave a Reply

You must be logged in to post a comment.