An easy way to store API data offline.
You've got a web-app that needs easy offline access to you data providing rest-api. The only thing is, you can't be bothered having to setup an ajax interface, that talks with a localStorage or when available a localDatabase (FileStorage and IndexedDB are coming up). This is where Spence comes to the resque!
Spence has a familiar interface for talking with your app. So you'll feel right at home using it. Behind the scenes Spence.js takes care of all the funny business. Storing and retrieving data from a local storage source is no longer something to worry about.
First things first. Spence relies heavily on 2 libraries. Luckilly these are very common in your everyday web project already:
For all the ajax calls, Spence needs to have one of these libraries. It realy doesn't matter which one because they all have a similar API.
Underscore is an awesome utility belt for all your websites and applications. It smooths out some of the browser quirks you might come across when you're doing some vanilla javascripting.
Include Underscore.js and a jQuery-ish library before including Spence.js like so:
<head>
...
<script src="/assets/js/underscore.js"></script>
<script src="/assets/js/jquery.js"></script>
<script src="/assets/js/spence.js"></script>
<script src="/assets/js/your-script.js"></script>
...
</head>// We'll start by initializing a Spence instance.
var MySpence = new Spence({
// configuration options.
// Engine fallback stack.
engines: ['localDatabase', 'localStorage'],
/**
* When initializing, Spence will test from
* first to last wether a driver is supported.
* When none of the drivers is supported, it'll
* fall back to regular API usage, no drawbacks here.
*/
// You can also supply a username an password:
username: 'my username',
password: function(){
return 'my password';
},
/**
* Spence will automatically get the result of
* the username and/or password so you don't
* have to hardcode them into the config.
*/
// Spence also handles versioning.
version: '0.1-alpha'
/**
* Unlike localDatabases, localStorage
* doesn't handle versioning, but now it does.
*/
});MySpence.get({
// Where should we get the data from?
url: '/data.json',
// When does is expire? (in seconds)
// set to false to never expire
expiration: 60 * 60 * 24, // one day
// success calback
success: function(response){
// Do something with the data.
},
// error callback
error: function(){
alert('Oh no!');
},
});At least two more engines will come available to Spence (IndexedDB and Filesystem). So keep an eye out for changes in this repo.
Easy as pie! Enjoy.