Using Dojo in an OpenSocial gadget
Dojo (pre 1.7) has issues working correctly in an open social gadget because of the way code is loaded.
...
In either case, it should be noted that dojo's xhr module will not work well in a gadget environment and some tweaking is required to get it to work transparently. More info will be added later.
Examples
| Code Block |
|---|
| title | dojo14gadget.xml |
|---|
| borderStyle | solid |
|---|
|
<Module>
<ModulePrefs title="Simple dojo 1.4.3 gadget" height="300">
</ModulePrefs>
<Content type="html"><![CDATA[
<body class="tundra">
<link rel="stylesheet" href="http://archive.dojotoolkit.org/cdn/1.4.3-cdn/google/1.4.3/dijit/themes/tundra/tundra.css" />
<script src="http://archive.dojotoolkit.org/cdn/1.4.3-cdn/google/1.4.3/dojo/dojo.xd.js"
djConfig="baseUrl: 'http://archive.dojotoolkit.org/cdn/1.4.3-cdn/google/1.4.3/dojo', parseOnLoad: true">
</script>
<script>
dojo.require("dijit.dijit");
dojo.require("dijit.Calendar");
</script>
<div dojoType="dijit.Calendar"
data-dojo-props="onChange:function(){dojo.byId('formatted').innerHTML=dojo.date.locale.format(arguments[0], {formatLength: 'full', selector:'date'})}">
</div>
<p id="formatted"></p>
</body>
]]></Content>
</Module>
|
| Code Block |
|---|
| title | dojo17gadget.xml |
|---|
| borderStyle | solid |
|---|
|
<Module>
<ModulePrefs title="Simple dojo 1.7 gadget" height="300">
</ModulePrefs>
<Content type="html"><![CDATA[
<body class="tundra">
<link rel="stylesheet" href="http://downloads.dojotoolkit.org/release-1.7.1/dojo-release-1.7.1/dijit/themes/tundra/tundra.css" />
<script src="http://downloads.dojotoolkit.org/release-1.7.1/dojo-release-1.7.1/dojo/dojo.js"
data-dojo-config="async: true, baseUrl: 'http://downloads.dojotoolkit.org/release-1.7.1/dojo-release-1.7.1/dojo', parseOnLoad: true, deps: ['dojo/parser','dijit/Calendar']">
</script>
<div data-dojo-type="dijit.Calendar"
data-dojo-props="onChange:function(){dojo.byId('formatted').innerHTML=dojo.date.locale.format(arguments[0], {formatLength: 'full', selector:'date'})}">
</div>
<p id="formatted"></p>
</body>
]]></Content>
</Module>
|