0.0.6 • Published 9 years ago
cloak.xhr v0.0.6
cloak.xhr
Cloak.js is a collection of modules for building modern web applications. Each module is designed to work with the others, but are decoupled to allow you pick and choose which ones you need. Want views but don't need to deal with models or a complex router? You can do that! First, make sure you have cloak.core
which contains some basic utilities for each module. Then, install the modules you want.
$ npm install --save cloak.core
$ npm install --save cloak.view
Then, in your JavaScript, just start using the components. Cloak is designed to work in a CommonJS environment, so any tools that do so will work (like common.js or browserify).
var View = require('cloak.view');
var MyView = module.exports = View.extend({
template: 'views/myview/myview.hbs',
draw: function() {
this.elem.innerHTML = this.render();
}
});
Cloak modules
- cloak.core - The cloak core: tiny, but used by all the cloak modules
- cloak.view - Provides the
View
class - cloak.model - Provides the
Model
andCollection
classes for handling data - cloak.router - Provides the
Router
class for all you app routing needs - cloak.controller - Provides a super-minimal
Controller
class for transitioning displaying views - cloak.xhr - Provides an easy interface for making HTTP requests by
XMLHttpRequest
; Also provides an interface to define XHR methods on theModel
andController
classes - cloak.localstorage - Provides an easy interface for storing data in local storage; Also provides an interface to use local storage as your main app storage for
Model
andCollection
classes - cloak.i18n - Provides a simple internationalization interface for storing translated phrases and determining a client's language
- cloak.socketio - Provides a socket.io interface for models based on the dagger.js websocket api
- cloak.animate - Provides animaion methods for controllers and views
- cloak.forms - Provides an extension to
cloak.view
for easier handling of forms
Usage
$ npm install --save cloak.core cloak.xhr
var xhr = require('cloak.xhr');
xhr
.open('get', 'http://www.google.com');
.send()
.then(function(res) {
if (res.status === 200) {
console.log(res.body);
}
});
// There are also shortcut methods for the basic HTTP methods
xhr
.post('/some/endpoint')
.send({ some: 'data' })
.then(function(res) {
//
});
If you are using cloak.model
, you can also extend the Model
class with easy REST methods:
var xhr = require('cloak.xhr');
var Model = require('cloak.model');
// This extends the Model class with new XHR REST methods; You only ever
// have to do this once in your app
xhr.extendModel(Model);
// Create a new model to test it out on
var Person = Model.extend({
initialize: function() {
this.url('/people{/#}');
},
attrs: {
name: ''
}
});
// This is Bob ...
var bob = new Person({ name: 'Bob' });
// Let's send Bob to the server
bob.save().then(function(res) {
// Yay! Bob made it! :)
});