Thursday, May 11th, 2006
JS alone doesn’t give you much – it’s defined by the environments it runs in.
“At the mercy” of them.
Dojo provides a single flat interface for these things.
Dojo: Set of layered interfaces. Can use some or all.
Licensing: Can I use Dojo in my apps? YES. Ideally would be in public domain, but legal issues such as disclaimers of warranties. The foundation licenses it under BSD or AFL. AFL even more liberal – essentially, only have to honour copyright, not even include notice.
Bootstrap and package system. Almost always see “dojo.”. dojo.require etc.
Can say “I need this package”. Other dependencies will then be pulled in automatically, and in correct order.
When pull in “dojo.foo.*” using dojo.require(“name.foo.*”), will try in this order:
http://.../dojo/src/foo/__package__.js http://.../dojo/src/foo.js http://.../dojo/src/__package__.js ...
Number of HTTP connections is often a greater issue than how big the files are. So Dojo lets you pull everything into a single file, one connection to download all content.
Builds: Get compressed version for speed and uncompressed version for debugging. These features initally came about from Dojo developers’ own needs. Optional – can
Q: If only want to use the core Dojo package system, how can I minimise the footprint?
A: [Alex demonstrates building it]. End up with bootstrap.js, loader.js, hostenv_browser.js, bootstrap2.js. Compresses to 15kb dojo.js, which gzips to just 5kb!
Q: Making your own packages?
A: Yes. [Alex demonstrates jotspot package and Rhino]
Q: Using Rhino/Spidermonkey
A: Yes. …
The handiest dojo.lang packages (Alex’s favourites highlighted): forEach, map, declare, hitch, extend, mixin, setTimeout, delayThese, curry, assert.
[Demo of hitch] The variable “this” is magical – always points to the object that the function is being run as part of. “this” is kind of promiscuous. hitch lets you run a function as part of a particular object (bind it), so it potentially changes the meaning of “this” inside the function.
“Like crack for web developers”
Similar to hitch syntax. Bind dojo.event.connect
> dojo.event.connect(“before”, foo, “bar”, baz, “thud”);
Now before foo.bar() is called, baz.thud will be called.
Q: In an event system, how do I pass the event object?
A: In standard JS, apart from IE, event is always passed into event handler. In Dojo, it’s always passed in. Still respects standard W3C approach of preventing bubbling etc.
Q: What does “this” refer to?
A: Same as if was connected by hitch.
Q: Can I build cyclical connections?
A: Yes, but bad. You’ll know it due to app hanging. No cycle breaking built in to Dojo right now.
Packages: io, html, style, dnd, ldf, dom
io: ie. Ajax remoting.
dom: Why doesn’t W3C allow insert at front? That’s the kind of thing in dom.
dojo.io.bind() is an abstraction for remoting, not always XHR. bind() lets you swap in behaviour for a particular implementation. Submits forms for you. Handles text encoding (i18n).
ScriptSrcIO package: Brand New.
“Isn’t an HTML form just WSDL for REST?”
Not just referencing DOM nodes, but higher-level components.
DragSource, DragObject, DropTarget
Animation and Effects
dojo.lfx.fadeOut([“foo”, “bar”, “baz”], 300, dojo.lfx.easeInOut).play();
Q: Could use chaining and “play” concept for *anything* asynchronous, to chain
A: Based on Mochikit, there’s chaining functionality available. (“?defer” API)
Q: Can run partial animation?
A: Yes, can say “go up to a certain percent”
Declared in markup
Each widget usually has an HTML, CSS, and JS file.
JS file: defines the widgets – points to corresponding HTML and CSS.
Posted by Michael Mahemoff at 11:48 am