How to load leaflet.js and leaflet plugins with dojo AMD

<script type=”text/javascript”> var dojoConfig = { baseUrl: ‘/lib’, async: true, packages: [ {name: ‘Leaflet’, location: ‘./Leaflet’} ], map: { // lets you switch between minified and source version of leaflet for development ‘*’: { ‘Leaflet/leaflet’: ‘Leaflet/leaflet-src’ } } }; </script> <script type=”text/javascript” src=”lib/dojo/dojo.js”></script> <script type=”text/javascript”> require([ ‘require’, ‘Leaflet/leaflet’ ], function(require, L) { // load plugin […]

How to import c3.js with the dojo AMD loader

I came across the nice chart library c3.js, which is based on d3.js. In order to load it via an AMD require call with dojo, you also need to set the main property in the dojoConfig, e.g.: dojoConfig = { packages: [ { name: ‘d3’, location: ‘../../../d3’, main: ‘d3’ } { name: ‘c3’, location: ‘../../../c3’, […]

How to use Google Maps API with Dojo and AMD

If you are using AMD or RequireJS for your JavaScripts and you would also like to use the Google Maps JavaScript API you have a problem. You can’t just require in the script file and then access the google.maps object from within your script, e.g.: require([‘http://maps.googleapis.com/maps/api/js?client=YOUR_CLIENT_ID’], function() { var myMap = new google.maps.Map(mapDiv, mapOptions); } […]

Quick tip: How to document a dojo AMD module for JSDoc 3

Unfortunately, JSDoc 3 does not fully support documenting AMD style modules that return a declare function, e.g.: define([‘dojo/_base/declare’], function(declare) { … return declare([], { … }); }); But with a bit of verbosity each module and the class will be properly documented:

Changing cursor to wait while request is in progress

Switching cursor to ‘wait’ and back to ‘default’ is tricky since some elements such as link, input or button have a different default style. Setting it back to ‘auto’ does not work in Firefox, but to an empty string works. Here’s how you would do it with dojo: require([‘dojo/_base/connect’, ‘dojo/query’], function(connect, query) { // change […]

REST with dojo and PHP: Notes on using dgrid with a caching store

I would like to share some (personal) pitfalls I came across when creating the demo REST with dojo and PHP: Demo of a dgrid observing changes to the JsonRest store: dojo/store/Observable only works correctly when the object has an id. Unfortunately, dojo/store/Memory.add(object) does not add the id to the object when creating it (as of […]

Yay, my first patch to the dojotoolkit got checked in !

While I’ve been working on my remote file explorer I noticed that the dijit tree remembers the state of opened/closed nodes but not of selections. So I filed a bug and created a patch, which got checked in yesterday.

Dojo Demo: Multiple file uploading with pause/resume

Update 09.2013: You can also use the file picker (file input) now. I implemented a demo of a file uploader with dojo and PHP that lets you upload multiple files at once with drag and drop. The upload of each file can be paused/resumed thanks to the slice method of the new Blob interface. Download: […]

Creating a ‘blocking’ confirm dialog with dojo

Update 30.03.2018: Version 1.10 of dojotoolkit includes a dijit/DialogConfirm now, which is simply a dijit/Dialog featuring ‘OK’ and ‘Cancel’ buttons, no blocking though. Update 15.10.2012: Code is available on githup now. I also fixed updating the content of the dialog after creation (e.g. dialog.set(‘content’, newContent) overwrote the confirm/cancel buttons because they were part of the […]

phpStorm and documenting JavaScript

I’m awed again and again by phpStorm‘s features. I just came across this one: When I comment my JavaScript methods/functions with the @param, all IDEs I have tried out so far, let you only set a primitive type in curly braces, e.g.: /** * Some method description. * @param {Object} deferred dojo.Deferred */ someMethod: function(deferrede) […]