Moving to Dojo 1.7 and the path to 2.0
-
Upload
james-thomas -
Category
Technology
-
view
13.938 -
download
4
description
Transcript of Moving to Dojo 1.7 and the path to 2.0
![Page 1: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/1.jpg)
Moving to Dojo 1.7...and the path to 2.0
http://www.flickr.com/photos/jenik/4836118314/
Wednesday, 7 December 2011
![Page 2: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/2.jpg)
Me.
@thomasj
Wednesday, 7 December 2011
![Page 3: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/3.jpg)
Dojo 1.7
http://www.flickr.com/photos/anythreewords/3197918781
Wednesday, 7 December 2011
![Page 4: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/4.jpg)
Dojo 1.7
http://www.flickr.com/photos/anythreewords/3197918781
Wednesday, 7 December 2011
![Page 5: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/5.jpg)
Wednesday, 7 December 2011
![Page 6: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/6.jpg)
Lots has changed...• AMD Module format
• New Loader
• New Build system
• Better Mobile support
• Feature detection
• Improved Grid
• and much more...
• Touch events support
• Gauges & Charting
• Data Stores
• MVC support
• Slim-line widgets
• Dojo Package Repo
• and much more....
Wednesday, 7 December 2011
![Page 7: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/7.jpg)
http://www.flickr.com/photos/trancemist/361935363/
Wednesday, 7 December 2011
![Page 8: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/8.jpg)
Don’t
http://www.flickr.com/photos/trancemist/361935363/
Wednesday, 7 December 2011
![Page 9: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/9.jpg)
API compatibility until 2.0*
* - There may be some exceptionsWednesday, 7 December 2011
![Page 10: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/10.jpg)
What’s AMD?
Wednesday, 7 December 2011
![Page 11: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/11.jpg)
“Asynchronous Module Definition (AMD) API specifies a mechanism for defining modules such that the module and its dependencies can be asynchronously loaded”
Wednesday, 7 December 2011
![Page 12: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/12.jpg)
What’s new about that?
Wednesday, 7 December 2011
![Page 13: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/13.jpg)
“Asynchronous Module Definition (AMD) API specifies a mechanism for defining modules such that the module and its dependencies can be asynchronously loaded”
Wednesday, 7 December 2011
![Page 14: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/14.jpg)
“Dojo is slow....”Wednesday, 7 December 2011
![Page 15: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/15.jpg)
“Dojo is slow....”Wednesday, 7 December 2011
![Page 16: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/16.jpg)
AMD Support
Wednesday, 7 December 2011
![Page 17: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/17.jpg)
AMD Support
JQuery 1.7+
Dojo 1.7+
MooTools 2.0+
Toolkits:
Wednesday, 7 December 2011
![Page 18: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/18.jpg)
AMD Support
Firebug 1.8+http://www.flickr.com/photos/phil-jackson/3624102329/in/photostream
Wednesday, 7 December 2011
![Page 19: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/19.jpg)
AMD Support
...also seen in the BBC iPlayerhttp://www.flickr.com/photos/phil-jackson/3624102329/in/photostream
Wednesday, 7 December 2011
![Page 20: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/20.jpg)
Dojo 1.7 - “Nano”
http://www.flickr.com/photos/argonne/4703475086
Wednesday, 7 December 2011
![Page 21: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/21.jpg)
Dojo gives you lots of “blocks”
http://www.flickr.com/photos/obiwanjr/5313551313
Wednesday, 7 December 2011
![Page 22: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/22.jpg)
The Dojo Toolkit
Dojo Dijit DojoX
Wednesday, 7 December 2011
![Page 23: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/23.jpg)
The Dojo Toolkit
Dijit DojoXCore
Dojo
Base
Wednesday, 7 December 2011
![Page 24: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/24.jpg)
The Dojo Toolkit
Dijit DojoXCore
Dojo
Base
Base modules are always loadedWednesday, 7 December 2011
![Page 25: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/25.jpg)
NodeList.js array.js connect.js event.js html.js lang.js query.js xhr.jsDeferred.js _loader browser.js declare.js fx.js json.js query-sizzle.js window.jsColor.js
~32KB gzip+minifiedWednesday, 7 December 2011
![Page 26: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/26.jpg)
http://www.flickr.com/photos/obiwanjr/5313551313
Do we always need them?Wednesday, 7 December 2011
![Page 27: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/27.jpg)
http://www.flickr.com/photos/redux/4297873805/
Wednesday, 7 December 2011
![Page 28: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/28.jpg)
“Base-less” Dojo
Just the AMD loader by default.... only load what you need
< 4KB gzip+minifiedhttp://www.flickr.com/photos/redux/4297873805/
Wednesday, 7 December 2011
![Page 29: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/29.jpg)
Turning on AMD
http://www.flickr.com/photos/reel-dreams/4893003699
Wednesday, 7 December 2011
![Page 30: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/30.jpg)
<script src="path/to/dojo.js"></script>
Non-AMD loader
Wednesday, 7 December 2011
![Page 31: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/31.jpg)
Configuration Flag
async: {true|false}
Wednesday, 7 December 2011
![Page 32: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/32.jpg)
<script src="path/to/dojo.js"></script>
"async:true"
<script data-dojo-config="async:true" src="path/to/dojo.js"></script>
Enabling AMD loader
Wednesday, 7 December 2011
![Page 33: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/33.jpg)
<script> var dojoConfig = { async:true };</script>
<script src="path/to/dojo.js"></script>
Enabling AMD loader
Wednesday, 7 December 2011
![Page 34: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/34.jpg)
Writing AMD modules
Wednesday, 7 December 2011
![Page 35: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/35.jpg)
Let’s take an example...
Wednesday, 7 December 2011
![Page 36: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/36.jpg)
dojo.provide("org.test.widget");
dojo.require("org.test.base");dojo.require("dijit._Widget");dojo.require("dijit._Templated");dojo.require("dojo.cache");
dojo.declare("org.test.widget", [dijit._Widget, dijit._Templated, org.test.base], { templateString: dojo.cache("org.test.template", "Widget.html")});
Wednesday, 7 December 2011
![Page 37: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/37.jpg)
dojo.provide("org.test.widget");
dojo.require("org.test.base");dojo.require("dijit._Widget");dojo.require("dijit._Templated");dojo.require("dojo.cache");
dojo.declare("org.test.widget", [dijit._Widget, dijit._Templated, org.test.base], { templateString: dojo.cache("org.test.template", "Widget.html")});
Wednesday, 7 December 2011
![Page 38: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/38.jpg)
dojo.provide("org.test.widget");
dojo.require("org.test.base");dojo.require("dijit._Widget");dojo.require("dijit._Templated");dojo.require("dojo.cache");
dojo.declare("org.test.widget", [dijit._Widget, dijit._Templated, org.test.base], { templateString: dojo.cache("org.test.template", "Widget.html")});
Wednesday, 7 December 2011
![Page 39: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/39.jpg)
dojo.provide("org.test.widget");
dojo.require("org.test.base");dojo.require("dijit._Widget");dojo.require("dijit._Templated");dojo.require("dojo.cache");
dojo.declare("org.test.widget", [dijit._Widget, dijit._Templated, org.test.base], { templateString: dojo.cache("org.test.template", "Widget.html")});
Wednesday, 7 December 2011
![Page 40: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/40.jpg)
Let’s convert to AMD...
Wednesday, 7 December 2011
![Page 41: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/41.jpg)
define([ "org/test/base", "dijit/_Widget", "dijit/_Templated", "dojo/_base/declare", "dojo/text!../template/Widget.html"], function (base, _Widget, _Templated, declare, template) {
return declare([base, _Widget, _Templated], { templateString: template }); });
Wednesday, 7 December 2011
![Page 42: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/42.jpg)
Don’t
http://www.flickr.com/photos/trancemist/361935363/
Wednesday, 7 December 2011
![Page 43: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/43.jpg)
define([ "org/test/base", "dijit/_Widget", "dijit/_Templated", "dojo/_base/declare", "dojo/text!../template/Widget.html"], function (base, _Widget, _Templated, declare, template) {
return declare([base, _Widget, _Templated], { templateString: template }); });
Wednesday, 7 December 2011
![Page 44: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/44.jpg)
define(id?, dependencies?, factory);
From the AMD API Specification
Wednesday, 7 December 2011
![Page 45: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/45.jpg)
define(id?, dependencies?, factory);
From the AMD API Specification
(Optional) String used as module identifier "org/widget/test"
Wednesday, 7 December 2011
![Page 46: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/46.jpg)
define(id?, dependencies?, factory);
From the AMD API Specification
(Optional) String used as module identifier "org/widget/test"
* - Ignore for anonymous modulesWednesday, 7 December 2011
![Page 47: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/47.jpg)
define([ "org/test/base", "dijit/_Widget", "dijit/_Templated", "dojo/_base/declare", "dojo/text!../template/Widget.html"], function (base, _Widget, _Templated, declare, template) {
return declare([base, _Widget, _Templated], { templateString: template }); });
Wednesday, 7 December 2011
![Page 48: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/48.jpg)
define(id?, dependencies?, factory);
From the AMD API Specification
(Optional) Array of module dependencies ["org/widget/base", "dojo/json"]
Resolved modules passed as factory arguments
Wednesday, 7 December 2011
![Page 49: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/49.jpg)
define([ "org/test/base", "dijit/_Widget", "dijit/_Templated", "dojo/_base/declare", "dojo/text!../template/Widget.html"], function (base, _Widget, _Templated, declare, template) {
return declare([base, _Widget, _Templated], { templateString: template }); });
Wednesday, 7 December 2011
![Page 50: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/50.jpg)
“Loader plugins extend an AMD implementation by allowing loading of resources that are not traditional JavaScript dependencies.”
From the AMD API Specification
Wednesday, 7 December 2011
![Page 51: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/51.jpg)
What can we load?
Internationalisation bundles“dojo/i18n!../nls/messages.json”
Wednesday, 7 December 2011
![Page 52: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/52.jpg)
What can we load?
Text bundles“dojo/text!../tmpl/widget.html”
Wednesday, 7 December 2011
![Page 53: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/53.jpg)
What can we load?
Third-party plugins for CSS, Coffeescript, LESS, Google Maps...
Wednesday, 7 December 2011
![Page 54: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/54.jpg)
What can we load?
Third-party plugins for CSS, Coffeescript, LESS, Google Maps...
...or just write your own!
Wednesday, 7 December 2011
![Page 55: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/55.jpg)
define([ "org/test/base", "dijit/_Widget", "dijit/_Templated", "dojo/_base/declare", "dojo/text!../template/Widget.html"], function (base, _Widget, _Templated, declare, template) {
return declare([base, _Widget, _Templated], { templateString: template }); });
Wednesday, 7 December 2011
![Page 56: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/56.jpg)
define(id?, dependencies?, factory);
From the AMD API Specification
“ function that should be executed to instantiate the module or an object...”
Wednesday, 7 December 2011
![Page 57: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/57.jpg)
define(id?, dependencies?, factory);
From the AMD API Specification
“ function that should be executed to instantiate the module or an object...”
* - Can also return an objectWednesday, 7 December 2011
![Page 58: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/58.jpg)
define([ "org/test/base", "dijit/_Widget", "dijit/_Templated", "dojo/_base/declare", "dojo/text!../template/Widget.html"], function (base, _Widget, _Templated, declare, template) {
return declare([base, _Widget, _Templated], { templateString: template }); });
Wednesday, 7 December 2011
![Page 59: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/59.jpg)
Uses local arguments,no need for globals
Wednesday, 7 December 2011
![Page 60: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/60.jpg)
What about the template?
Wednesday, 7 December 2011
![Page 61: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/61.jpg)
Widget Template <div> <label>First name</label> <input dojoAttachPoint="first_name"
placeHolder="First name"dojoType="dijit.form.TextBox">
<label>Second name</label> <input dojoAttachPoint="second_name"
placeHolder="Second name"dojoType="dijit.form.TextBox">
<button dojoAttachEvent="onClick:sendName" dojoType="dijit.form.Button">
</div>
Wednesday, 7 December 2011
![Page 62: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/62.jpg)
Widget Template <div> <label>First name</label> <input dojoAttachPoint="first_name"
placeHolder="First name"dojoType="dijit.form.TextBox">
<label>Second name</label> <input dojoAttachPoint="second_name"
placeHolder="Second name"dojoType="dijit.form.TextBox">
<button dojoAttachEvent="onClick:sendName" dojoType="dijit.form.Button">
</div>
Non-standard HTML attributesWednesday, 7 December 2011
![Page 63: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/63.jpg)
HTML5 Data Attributes
Wednesday, 7 December 2011
![Page 64: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/64.jpg)
HTML5 Data Attributes
dojoAttachPoint
dojoAttachEvent
dojoType
custom widget attr
dojoConfig
data-dojo-attach-point
data-dojo-attach-event
data-dojo-type
data-dojo-props
data-dojo-config
Wednesday, 7 December 2011
![Page 65: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/65.jpg)
Widget Template <div> <label>First name</label> <input data-dojo-attach-point="first_name"
data-dojo-props="placeHolder:First Name"data-dojo-type="dijit.form.TextBox">
<label>Second name</label> <input data-dojo-attach-point="first_name"
data-dojo-props="placeHolder:Second Name"data-dojo-type="dijit.form.TextBox">
<button dojo-dojo-attach-point="onClick:sendName" data-dojo-type="dijit.form.Button">
</div>
Wednesday, 7 December 2011
![Page 66: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/66.jpg)
What if I’m not defining modules?
Wednesday, 7 December 2011
![Page 67: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/67.jpg)
Let’s take an example...
Wednesday, 7 December 2011
![Page 68: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/68.jpg)
<script src="dojo.js" dojoConfig="parseOnLoad: true"></script>
<script>dojo.require("dijit.form.Form");dojo.require("dijit.form.TextBox");dojo.require("dijit.form.Button");
dojo.ready({ dojo.query("input").forEach(function () {...}); dojo.connect(dojo.byId("send"), "onclick", function (){...});});</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 69: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/69.jpg)
<script src="dojo.js" dojoConfig="parseOnLoad: true"></script>
<script>dojo.require("dijit.form.Form");dojo.require("dijit.form.TextBox");dojo.require("dijit.form.Button");
dojo.ready({ dojo.query("input").forEach(function () {...}); dojo.connect(dojo.byId("send"), "onclick", function (){...});});</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 70: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/70.jpg)
<script src="dojo.js" dojoConfig="parseOnLoad: true"></script>
<script>dojo.require("dijit.form.Form");dojo.require("dijit.form.TextBox");dojo.require("dijit.form.Button");
dojo.ready({ dojo.query("input").forEach(function () {...}); dojo.connect(dojo.byId("send"), "onclick", function (){...});});</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 71: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/71.jpg)
<script src="dojo.js" dojoConfig="parseOnLoad: true"></script>
<script>dojo.require("dijit.form.Form");dojo.require("dijit.form.TextBox");dojo.require("dijit.form.Button");
dojo.ready({ dojo.query("input").forEach(function () {...}); dojo.connect(dojo.byId("send"), "onclick", function (){...});});</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 72: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/72.jpg)
<script src="dojo.js" dojoConfig="parseOnLoad: true"></script>
<script>dojo.require("dijit.form.Form");dojo.require("dijit.form.TextBox");dojo.require("dijit.form.Button");
dojo.ready({ dojo.query("input").forEach(function () {...}); dojo.connect(dojo.byId("send"), "onclick", function (){...});});</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 73: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/73.jpg)
Let’s convert to AMD
Wednesday, 7 December 2011
![Page 74: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/74.jpg)
<script src="dojo.js" dojoConfig="async: true, parseOnLoad: true"></script>
<script>require(["dojo/query", "dojo/on", "dojo/dom", "dojo/ready", "dojo/parser", "dijit/form/Form", "dijit/form/TextBox", "dijit/form/Button"],
function (query, on, dom, ready) { ready(function () { query("input").forEach(function () {...}); on(dom.byId("send"), "click", function (){...}); }); });</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 75: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/75.jpg)
<script src="dojo.js" dojoConfig="async: true, parseOnLoad: true"></script>
<script>require(["dojo/query", "dojo/on", "dojo/dom", "dojo/ready", "dojo/parser", "dijit/form/Form", "dijit/form/TextBox", "dijit/form/Button"],
function (query, on, dom, ready) { ready(function () { query("input").forEach(function () {...}); on(dom.byId("send"), "click", function (){...}); }); });</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 76: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/76.jpg)
<script src="dojo.js" dojoConfig="async: true, parseOnLoad: true"></script>
<script>require(["dojo/query", "dojo/on", "dojo/dom", "dojo/ready", "dojo/parser", "dijit/form/Form", "dijit/form/TextBox", "dijit/form/Button"],
function (query, on, dom, ready) { ready(function () { query("input").forEach(function () {...}); on(dom.byId("send"), "click", function (){...}); }); });</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 77: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/77.jpg)
require(dependencies?, callback);
NOT in the AMD API Specification
Wednesday, 7 December 2011
![Page 78: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/78.jpg)
require(dependencies?, callback);
NOT in the AMD API Specification
“... implementation-dependent API that will kick off module loading.”
https://github.com/amdjs/amdjs-api/wiki/require
Wednesday, 7 December 2011
![Page 79: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/79.jpg)
<script src="dojo.js" dojoConfig="async: true, parseOnLoad: true"></script>
<script>require(["dojo/query", "dojo/on", "dojo/dom", "dojo/ready", "dojo/parser", "dijit/form/Form", "dijit/form/TextBox", "dijit/form/Button"],
function (query, on, dom, ready) { ready(function () { query("input").forEach(function () {...}); on(dom.byId("send"), "click", function (){...}); }); });</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 80: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/80.jpg)
require(dependencies?, callback);
NOT in the AMD API Specification
(Optional) Array of module dependencies ["org/widget/base", "dojo/json"]
Resolved modules passed as factory arguments
Wednesday, 7 December 2011
![Page 81: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/81.jpg)
<script src="dojo.js" dojoConfig="async: true, parseOnLoad: true"></script>
<script>require(["dojo/query", "dojo/on", "dojo/dom", "dojo/ready", "dojo/parser", "dijit/form/Form", "dijit/form/TextBox", "dijit/form/Button"],
function (query, on, dom, ready) { ready(function () { query("input").forEach(function () {...}); on(dom.byId("send"), "click", function (){...}); }); });</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 82: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/82.jpg)
require(dependencies?, callback);
NOT in the AMD API Specification
Resolved modules passed as callback arguments
“...once all the modules are available, the function callback is executed.”
Wednesday, 7 December 2011
![Page 83: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/83.jpg)
<script src="dojo.js" dojoConfig="async: true, parseOnLoad: true"></script>
<script>require(["dojo/query", "dojo/on", "dojo/dom", "dojo/ready", "dojo/parser", "dijit/form/Form", "dijit/form/TextBox", "dijit/form/Button"],
function (query, on, dom, ready) { ready(function () { query("input").forEach(function () {...}); on(dom.byId("send"), "click", function (){...}); }); });</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 84: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/84.jpg)
No global references...
Wednesday, 7 December 2011
![Page 85: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/85.jpg)
<script src="dojo.js" dojoConfig="async: true, parseOnLoad: true"></script>
<script>require(["dojo/query", "dojo/on", "dojo/dom", "dojo/ready", "dojo/parser", "dijit/form/Form", "dijit/form/TextBox", "dijit/form/Button"],
function (query, on, dom, ready) { ready(function () { query("input").forEach(function () {...}); on(dom.byId("send"), "click", function (){...}); }); });</script>
<form dojoType="dijit.form.Form"> <label>First Name:</label> <input dojoType="dijit.form.TextBox"> ... <button dojoType="dijit.form.Button"></form>
Wednesday, 7 December 2011
![Page 86: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/86.jpg)
...only load modules we actually use
Wednesday, 7 December 2011
![Page 87: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/87.jpg)
What about the new stuff?
http://www.flickr.com/photos/fcrippa/3401571934
Wednesday, 7 December 2011
![Page 88: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/88.jpg)
Dojo Mobile
http://www.flickr.com/photos/dominiksyka-photography/4334590250
Wednesday, 7 December 2011
![Page 89: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/89.jpg)
Dojo Mobile
Lightweight set of Mobile UI widgetsWednesday, 7 December 2011
![Page 90: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/90.jpg)
Dojo Mobile
Blackberry iPhone Android
Device-specific or device-neutral themes availableWednesday, 7 December 2011
![Page 91: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/91.jpg)
Dojo Mobile Showcase
Wednesday, 7 December 2011
![Page 92: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/92.jpg)
dGrid: Next Generation Dojo Grid
Wednesday, 7 December 2011
![Page 93: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/93.jpg)
Small, fast and light
• < 30KB minified, <80KB with dependencies
• 6 - 10x faster that DataGrid
• Pluggable modules
• Mobile device support
• Customisable with CSS
Wednesday, 7 December 2011
![Page 94: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/94.jpg)
Wednesday, 7 December 2011
![Page 95: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/95.jpg)
There’s lots more...• AMD Module format
• New Loader
• New Build system
• Better Mobile support
• Feature detection
• Improved Grid
• and much more...
• Touch events support
• Gauges & Charting
• Data Stores
• MVC support
• Slim-line widgets
• Dojo Package Repo
• and much more....
Wednesday, 7 December 2011
![Page 96: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/96.jpg)
Before getting started...
Wednesday, 7 December 2011
![Page 97: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/97.jpg)
Wednesday, 7 December 2011
![Page 98: Moving to Dojo 1.7 and the path to 2.0](https://reader030.fdocuments.in/reader030/viewer/2022020217/554dd2aeb4c905c70e8b48dd/html5/thumbnails/98.jpg)
Dojo 1.7 provides early access to 2.0 features...
Start “future proofing” your application today
http://www.flickr.com/photos/9948354@N08/763399258
Wednesday, 7 December 2011