Dojo Offline Toolkit in Code
Written by on January 23rd, 2007 in Ajax News.
Brad Neuberg keeps it moving with the Dojo Offline Toolkit API. His latest work details the early API via example. The example is a web based email system, and the code using the API is below (and shows you how you would use it).
The interesting news is that you can start work even without the local proxy that was mentioned before, as long as you set the right headers for development.
JAVASCRIPT:
-
-
-
// bring in Dojo Offline
-
dojo.require(”offline.*”);
-
-
// indicate what files we want offline, such
-
// as our application’s images, HTML, CSS,
-
// JavaScript, etc.
-
offline.files.put(
-
[”/images/toolbar.gif”,
-
“index.html”,
-
“/css/global.css”,
-
“dojo.js”
-
]);
-
-
// define our application’s name; this will be used to
-
// customize the default Offline Toolkit UI
-
offline.ui.appName = “Web Outlook”;
-
-
// define what elements we would like disabled when we go offline;
-
// these will be re-enabled when we go online
-
offline.ui.disableElementsOffline(
-
[”configurationLink”,
-
“searchField”
-
]);
-
-
var emails, contacts, tasks;
-
-
// called when the page is finished loading and the offline toolkit
-
// is ready to be used
-
offline.onLoad = function(){
-
// define where to put our offline user data; when
-
// we sync with the server, each kind of data will have
-
// an itemType, such as "emails", "tasks", etc. These
-
// data structures will automatically be kept in sync
-
// so we can use them in our application, and will
-
// automatically be persisted in local client-side
-
// storage
-
emails = offline.getDataStore(”email”);
-
contacts = offline.getDataStore(”contact”);
-
tasks = offline.getDataStore(”task”);
-
}
-
-
// default implementation of offline.onOffline and offline.onOnline
-
// will simply use the disableElementsOffline values
-
// to enable and disable these elements, and do an automatic synchronization inside of onOnline
-
-
function addContact(contact){
-
contacts.newItem(contact);
-
}
-
-
function displayEmails(){
-
var displayMe = null;
-
-
if(offline.isOnline() == false){
-
displayMe = emails.find().items;
-
}else{
-
displayMe = // …remotely fetch emails
-
}
-
-
// do something with array of emails
-
}
-
-
function deleteTask(task){
-
tasks.deleteItem(task);
-
}
-
-
function sendEmail(email){
-
if(offline.isOnline == true){
-
// send this email to the server
-
}else{
-
// else we are offline; just queue this email up
-
-
// store it’s value in our offline cache
-
emails.newItem(email);
-
-
// now create a custom sync log entry for a ’send’ command
-
var c = new offline.sync.Command();
-
c.name = “send”;
-
c.itemType = “email”;
-
c.item = email;
-
-
offline.sync.log.add(c);
-
-
// later, when we sync, this command will be replayed to the
-
// server for the email to be sent
-
}
-
Source: Ajaxian
Original Article: http://ajaxian.com/archives/dojo-offline-toolkit-in-code