| // Backbone.js 0.5.3 |
| // (c) 2010 Jeremy Ashkenas, DocumentCloud Inc. |
| // Backbone may be freely distributed under the MIT license. |
| // For all details and documentation: |
| // http://documentcloud.github.com/backbone |
| |
| (function(){ |
| |
| // Initial Setup |
| // ------------- |
| |
| // Save a reference to the global object. |
| var root = this; |
| |
| // Save the previous value of the `Backbone` variable. |
| var previousBackbone = root.Backbone; |
| |
| // The top-level namespace. All public Backbone classes and modules will |
| // be attached to this. Exported for both CommonJS and the browser. |
| var Backbone; |
| if (typeof exports !== 'undefined') { |
| Backbone = exports; |
| } else { |
| Backbone = root.Backbone = {}; |
| } |
| |
| // Current version of the library. Keep in sync with `package.json`. |
| Backbone.VERSION = '0.5.3'; |
| |
| // Require Underscore, if we're on the server, and it's not already present. |
| var _ = root._; |
| if (!_ && (typeof require !== 'undefined')) _ = require('underscore')._; |
| |
| // For Backbone's purposes, jQuery or Zepto owns the `$` variable. |
| var $ = root.jQuery || root.Zepto; |
| |
| // Runs Backbone.js in *noConflict* mode, returning the `Backbone` variable |
| // to its previous owner. Returns a reference to this Backbone object. |
| Backbone.noConflict = function() { |
| root.Backbone = previousBackbone; |
| return this; |
| }; |
| |
| // Turn on `emulateHTTP` to support legacy HTTP servers. Setting this option will |
| // fake `"PUT"` and `"DELETE"` requests via the `_method` parameter and set a |
| // `X-Http-Method-Override` header. |
| Backbone.emulateHTTP = false; |
| |
| // Turn on `emulateJSON` to support legacy servers that can't deal with direct |
| // `application/json` requests ... will encode the body as |
| // `application/x-www-form-urlencoded` instead and will send the model in a |
| // form param named `model`. |
| Backbone.emulateJSON = false; |
| |
| // Backbone.Events |
| // ----------------- |
| |
| // A module that can be mixed in to *any object* in order to provide it with |
| // custom events. You may `bind` or `unbind` a callback function to an event; |
| // `trigger`-ing an event fires all callbacks in succession. |
| // |
| // var object = {}; |
| // _.extend(object, Backbone.Events); |
| // object.bind('expand', function(){ alert('expanded'); }); |
| // object.trigger('expand'); |
| // |
| Backbone.Events = { |
| |
| // Bind an event, specified by a string name, `ev`, to a `callback` function. |
| // Passing `"all"` will bind the callback to all events fired. |
| bind : function(ev, callback, context) { |
| var calls = this._callbacks || (this._callbacks = {}); |
| var list = calls[ev] || (calls[ev] = []); |
| list.push([callback, context]); |
| return this; |
| }, |
| |
| // Remove one or many callbacks. If `callback` is null, removes all |
| // callbacks for the event. If `ev` is null, removes all bound callbacks |
| // for all events. |
| unbind : function(ev, callback) { |
| var calls; |
| if (!ev) { |
| this._callbacks = {}; |
| } else if (calls = this._callbacks) { |
| if (!callback) { |
| calls[ev] = []; |
| } else { |
| var list = calls[ev]; |
| if (!list) return this; |
| for (var i = 0, l = list.length; i < l; i++) { |
| if (list[i] && callback === list[i][0]) { |
| list[i] = null; |
| break; |
| } |
| } |
| } |
| } |
| return this; |
| }, |
| |
| // Trigger an event, firing all bound callbacks. Callbacks are passed the |
| // same arguments as `trigger` is, apart from the event name. |
| // Listening for `"all"` passes the true event name as the first argument. |
| trigger : function(eventName) { |
| var list, calls, ev, callback, args; |
| var both = 2; |
| if (!(calls = this._callbacks)) return this; |
| while (both--) { |
| ev = both ? eventName : 'all'; |
| if (list = calls[ev]) { |
| for (var i = 0, l = list.length; i < l; i++) { |
| if (!(callback = list[i])) { |
| list.splice(i, 1); i--; l--; |
| } else { |
| args = both ? Array.prototype.slice.call(arguments, 1) : arguments; |
| callback[0].apply(callback[1] || this, args); |
| } |
| } |
| } |
| } |
| return this; |
| } |
| |
| }; |
| |
| // Backbone.Model |
| // -------------- |
| |
| // Create a new model, with defined attributes. A client id (`cid`) |
| // is automatically generated and assigned for you. |
| Backbone.Model = function(attributes, options) { |
| var defaults; |
| attributes || (attributes = {}); |
| if (defaults = this.defaults) { |
| if (_.isFunction(defaults)) defaults = defaults.call(this); |
| attributes = _.extend({}, defaults, attributes); |
| } |
| this.attributes = {}; |
| this._escapedAttributes = {}; |
| this.cid = _.uniqueId('c'); |
| this.set(attributes, {silent : true}); |
| this._changed = false; |
| this._previousAttributes = _.clone(this.attributes); |
| if (options && options.collection) this.collection = options.collection; |
| this.initialize(attributes, options); |
| }; |
| |
| // Attach all inheritable methods to the Model prototype. |
| _.extend(Backbone.Model.prototype, Backbone.Events, { |
| |
| // A snapshot of the model's previous attributes, taken immediately |
| // after the last `"change"` event was fired. |
| _previousAttributes : null, |
| |
| // Has the item been changed since the last `"change"` event? |
| _changed : false, |
| |
| // The default name for the JSON `id` attribute is `"id"`. MongoDB and |
| // CouchDB users may want to set this to `"_id"`. |
| idAttribute : 'id', |
| |
| // Initialize is an empty function by default. Override it with your own |
| // initialization logic. |
| initialize : function(){}, |
| |
| // Return a copy of the model's `attributes` object. |
| toJSON : function() { |
| return _.clone(this.attributes); |
| }, |
| |
| // Get the value of an attribute. |
| get : function(attr) { |
| return this.attributes[attr]; |
| }, |
| |
| // Get the HTML-escaped value of an attribute. |
| escape : function(attr) { |
| var html; |
| if (html = this._escapedAttributes[attr]) return html; |
| var val = this.attributes[attr]; |
| return this._escapedAttributes[attr] = escapeHTML(val == null ? '' : '' + val); |
| }, |
| |
| // Returns `true` if the attribute contains a value that is not null |
| // or undefined. |
| has : function(attr) { |
| return this.attributes[attr] != null; |
| }, |
| |
| // Set a hash of model attributes on the object, firing `"change"` unless you |
| // choose to silence it. |
| set : function(attrs, options) { |
| |
| // Extract attributes and options. |
| options || (options = {}); |
| if (!attrs) return this; |
| if (attrs.attributes) attrs = attrs.attributes; |
| var now = this.attributes, escaped = this._escapedAttributes; |
| |
| // Run validation. |
| if (!options.silent && this.validate && !this._performValidation(attrs, options)) return false; |
| |
| // Check for changes of `id`. |
| if (this.idAttribute in attrs) this.id = attrs[this.idAttribute]; |
| |
| // We're about to start triggering change events. |
| var alreadyChanging = this._changing; |
| this._changing = true; |
| |
| // Update attributes. |
| for (var attr in attrs) { |
| var val = attrs[attr]; |
| if (!_.isEqual(now[attr], val)) { |
| now[attr] = val; |
| delete escaped[attr]; |
| this._changed = true; |
| if (!options.silent) this.trigger('change:' + attr, this, val, options); |
| } |
| } |
| |
| // Fire the `"change"` event, if the model has been changed. |
| if (!alreadyChanging && !options.silent && this._changed) this.change(options); |
| this._changing = false; |
| return this; |
| }, |
| |
| // Remove an attribute from the model, firing `"change"` unless you choose |
| // to silence it. `unset` is a noop if the attribute doesn't exist. |
| unset : function(attr, options) { |
| if (!(attr in this.attributes)) return this; |
| options || (options = {}); |
| var value = this.attributes[attr]; |
| |
| // Run validation. |
| var validObj = {}; |
| validObj[attr] = void 0; |
| if (!options.silent && this.validate && !this._performValidation(validObj, options)) return false; |
| |
| // Remove the attribute. |
| delete this.attributes[attr]; |
| delete this._escapedAttributes[attr]; |
| if (attr == this.idAttribute) delete this.id; |
| this._changed = true; |
| if (!options.silent) { |
| this.trigger('change:' + attr, this, void 0, options); |
| this.change(options); |
| } |
| return this; |
| }, |
| |
| // Clear all attributes on the model, firing `"change"` unless you choose |
| // to silence it. |
| clear : function(options) { |
| options || (options = {}); |
| var attr; |
| var old = this.attributes; |
| |
| // Run validation. |
| var validObj = {}; |
| for (attr in old) validObj[attr] = void 0; |
| if (!options.silent && this.validate && !this._performValidation(validObj, options)) return false; |
| |
| this.attributes = {}; |
| this._escapedAttributes = {}; |
| this._changed = true; |
| if (!options.silent) { |
| for (attr in old) { |
| this.trigger('change:' + attr, this, void 0, options); |
| } |
| this.change(options); |
| } |
| return this; |
| }, |
| |
| // Fetch the model from the server. If the server's representation of the |
| // model differs from its current attributes, they will be overriden, |
| // triggering a `"change"` event. |
| fetch : function(options) { |
| options || (options = {}); |
| var model = this; |
| var success = options.success; |
| options.success = function(resp, status, xhr) { |
| if (!model.set(model.parse(resp, xhr), options)) return false; |
| if (success) success(model, resp); |
| }; |
| options.error = wrapError(options.error, model, options); |
| return (this.sync || Backbone.sync).call(this, 'read', this, options); |
| }, |
| |
| // Set a hash of model attributes, and sync the model to the server. |
| // If the server returns an attributes hash that differs, the model's |
| // state will be `set` again. |
| save : function(attrs, options) { |
| options || (options = {}); |
| if (attrs && !this.set(attrs, options)) return false; |
| var model = this; |
| var success = options.success; |
| options.success = function(resp, status, xhr) { |
| if (!model.set(model.parse(resp, xhr), options)) return false; |
| if (success) success(model, resp, xhr); |
| }; |
| options.error = wrapError(options.error, model, options); |
| var method = this.isNew() ? 'create' : 'update'; |
| return (this.sync || Backbone.sync).call(this, method, this, options); |
| }, |
| |
| // Destroy this model on the server if it was already persisted. Upon success, the model is removed |
| // from its collection, if it has one. |
| destroy : function(options) { |
| options || (options = {}); |
| if (this.isNew()) return this.trigger('destroy', this, this.collection, options); |
| var model = this; |
| var success = options.success; |
| options.success = function(resp) { |
| model.trigger('destroy', model, model.collection, options); |
| if (success) success(model, resp); |
| }; |
| options.error = wrapError(options.error, model, options); |
| return (this.sync || Backbone.sync).call(this, 'delete', this, options); |
| }, |
| |
| // Default URL for the model's representation on the server -- if you're |
| // using Backbone's restful methods, override this to change the endpoint |
| // that will be called. |
| url : function() { |
| var base = getUrl(this.collection) || this.urlRoot || urlError(); |
| if (this.isNew()) return base; |
| return base + (base.charAt(base.length - 1) == '/' ? '' : '/') + encodeURIComponent(this.id); |
| }, |
| |
| // **parse** converts a response into the hash of attributes to be `set` on |
| // the model. The default implementation is just to pass the response along. |
| parse : function(resp, xhr) { |
| return resp; |
| }, |
| |
| // Create a new model with identical attributes to this one. |
| clone : function() { |
| return new this.constructor(this); |
| }, |
| |
| // A model is new if it has never been saved to the server, and lacks an id. |
| isNew : function() { |
| return this.id == null; |
| }, |
| |
| // Call this method to manually fire a `change` event for this model. |
| // Calling this will cause all objects observing the model to update. |
| change : function(options) { |
| this.trigger('change', this, options); |
| this._previousAttributes = _.clone(this.attributes); |
| this._changed = false; |
| }, |
| |
| // Determine if the model has changed since the last `"change"` event. |
| // If you specify an attribute name, determine if that attribute has changed. |
| hasChanged : function(attr) { |
| if (attr) return this._previousAttributes[attr] != this.attributes[attr]; |
| return this._changed; |
| }, |
| |
| // Return an object containing all the attributes that have changed, or false |
| // if there are no changed attributes. Useful for determining what parts of a |
| // view need to be updated and/or what attributes need to be persisted to |
| // the server. |
| changedAttributes : function(now) { |
| now || (now = this.attributes); |
| var old = this._previousAttributes; |
| var changed = false; |
| for (var attr in now) { |
| if (!_.isEqual(old[attr], now[attr])) { |
| changed = changed || {}; |
| changed[attr] = now[attr]; |
| } |
| } |
| return changed; |
| }, |
| |
| // Get the previous value of an attribute, recorded at the time the last |
| // `"change"` event was fired. |
| previous : function(attr) { |
| if (!attr || !this._previousAttributes) return null; |
| return this._previousAttributes[attr]; |
| }, |
| |
| // Get all of the attributes of the model at the time of the previous |
| // `"change"` event. |
| previousAttributes : function() { |
| return _.clone(this._previousAttributes); |
| }, |
| |
| // Run validation against a set of incoming attributes, returning `true` |
| // if all is well. If a specific `error` callback has been passed, |
| // call that instead of firing the general `"error"` event. |
| _performValidation : function(attrs, options) { |
| var error = this.validate(attrs); |
| if (error) { |
| if (options.error) { |
| options.error(this, error, options); |
| } else { |
| this.trigger('error', this, error, options); |
| } |
| return false; |
| } |
| return true; |
| } |
| |
| }); |
| |
| // Backbone.Collection |
| // ------------------- |
| |
| // Provides a standard collection class for our sets of models, ordered |
| // or unordered. If a `comparator` is specified, the Collection will maintain |
| // its models in sort order, as they're added and removed. |
| Backbone.Collection = function(models, options) { |
| options || (options = {}); |
| if (options.comparator) this.comparator = options.comparator; |
| _.bindAll(this, '_onModelEvent', '_removeReference'); |
| this._reset(); |
| if (models) this.reset(models, {silent: true}); |
| this.initialize.apply(this, arguments); |
| }; |
| |
| // Define the Collection's inheritable methods. |
| _.extend(Backbone.Collection.prototype, Backbone.Events, { |
| |
| // The default model for a collection is just a **Backbone.Model**. |
| // This should be overridden in most cases. |
| model : Backbone.Model, |
| |
| // Initialize is an empty function by default. Override it with your own |
| // initialization logic. |
| initialize : function(){}, |
| |
| // The JSON representation of a Collection is an array of the |
| // models' attributes. |
| toJSON : function() { |
| return this.map(function(model){ return model.toJSON(); }); |
| }, |
| |
| // Add a model, or list of models to the set. Pass **silent** to avoid |
| // firing the `added` event for every new model. |
| add : function(models, options) { |
| if (_.isArray(models)) { |
| for (var i = 0, l = models.length; i < l; i++) { |
| this._add(models[i], options); |
| } |
| } else { |
| this._add(models, options); |
| } |
| return this; |
| }, |
| |
| // Remove a model, or a list of models from the set. Pass silent to avoid |
| // firing the `removed` event for every model removed. |
| remove : function(models, options) { |
| if (_.isArray(models)) { |
| for (var i = 0, l = models.length; i < l; i++) { |
| this._remove(models[i], options); |
| } |
| } else { |
| this._remove(models, options); |
| } |
| return this; |
| }, |
| |
| // Get a model from the set by id. |
| get : function(id) { |
| if (id == null) return null; |
| return this._byId[id.id != null ? id.id : id]; |
| }, |
| |
| // Get a model from the set by client id. |
| getByCid : function(cid) { |
| return cid && this._byCid[cid.cid || cid]; |
| }, |
| |
| // Get the model at the given index. |
| at: function(index) { |
| return this.models[index]; |
| }, |
| |
| // Force the collection to re-sort itself. You don't need to call this under normal |
| // circumstances, as the set will maintain sort order as each item is added. |
| sort : function(options) { |
| options || (options = {}); |
| if (!this.comparator) throw new Error('Cannot sort a set without a comparator'); |
| this.models = this.sortBy(this.comparator); |
| if (!options.silent) this.trigger('reset', this, options); |
| return this; |
| }, |
| |
| // Pluck an attribute from each model in the collection. |
| pluck : function(attr) { |
| return _.map(this.models, function(model){ return model.get(attr); }); |
| }, |
| |
| // When you have more items than you want to add or remove individually, |
| // you can reset the entire set with a new list of models, without firing |
| // any `added` or `removed` events. Fires `reset` when finished. |
| reset : function(models, options) { |
| models || (models = []); |
| options || (options = {}); |
| this.each(this._removeReference); |
| this._reset(); |
| this.add(models, {silent: true}); |
| if (!options.silent) this.trigger('reset', this, options); |
| return this; |
| }, |
| |
| // Fetch the default set of models for this collection, resetting the |
| // collection when they arrive. If `add: true` is passed, appends the |
| // models to the collection instead of resetting. |
| fetch : function(options) { |
| options || (options = {}); |
| var collection = this; |
| var success = options.success; |
| options.success = function(resp, status, xhr) { |
| collection[options.add ? 'add' : 'reset'](collection.parse(resp, xhr), options); |
| if (success) success(collection, resp); |
| }; |
| options.error = wrapError(options.error, collection, options); |
| return (this.sync || Backbone.sync).call(this, 'read', this, options); |
| }, |
| |
| // Create a new instance of a model in this collection. After the model |
| // has been created on the server, it will be added to the collection. |
| // Returns the model, or 'false' if validation on a new model fails. |
| create : function(model, options) { |
| var coll = this; |
| options || (options = {}); |
| model = this._prepareModel(model, options); |
| if (!model) return false; |
| var success = options.success; |
| options.success = function(nextModel, resp, xhr) { |
| coll.add(nextModel, options); |
| if (success) success(nextModel, resp, xhr); |
| }; |
| model.save(null, options); |
| return model; |
| }, |
| |
| // **parse** converts a response into a list of models to be added to the |
| // collection. The default implementation is just to pass it through. |
| parse : function(resp, xhr) { |
| return resp; |
| }, |
| |
| // Proxy to _'s chain. Can't be proxied the same way the rest of the |
| // underscore methods are proxied because it relies on the underscore |
| // constructor. |
| chain: function () { |
| return _(this.models).chain(); |
| }, |
| |
| // Reset all internal state. Called when the collection is reset. |
| _reset : function(options) { |
| this.length = 0; |
| this.models = []; |
| this._byId = {}; |
| this._byCid = {}; |
| }, |
| |
| // Prepare a model to be added to this collection |
| _prepareModel: function(model, options) { |
| if (!(model instanceof Backbone.Model)) { |
| var attrs = model; |
| model = new this.model(attrs, {collection: this}); |
| if (model.validate && !model._performValidation(attrs, options)) model = false; |
| } else if (!model.collection) { |
| model.collection = this; |
| } |
| return model; |
| }, |
| |
| // Internal implementation of adding a single model to the set, updating |
| // hash indexes for `id` and `cid` lookups. |
| // Returns the model, or 'false' if validation on a new model fails. |
| _add : function(model, options) { |
| options || (options = {}); |
| model = this._prepareModel(model, options); |
| if (!model) return false; |
| var already = this.getByCid(model); |
| if (already) throw new Error(["Can't add the same model to a set twice", already.id]); |
| this._byId[model.id] = model; |
| this._byCid[model.cid] = model; |
| var index = options.at != null ? options.at : |
| this.comparator ? this.sortedIndex(model, this.comparator) : |
| this.length; |
| this.models.splice(index, 0, model); |
| model.bind('all', this._onModelEvent); |
| this.length++; |
| if (!options.silent) model.trigger('add', model, this, options); |
| return model; |
| }, |
| |
| // Internal implementation of removing a single model from the set, updating |
| // hash indexes for `id` and `cid` lookups. |
| _remove : function(model, options) { |
| options || (options = {}); |
| model = this.getByCid(model) || this.get(model); |
| if (!model) return null; |
| delete this._byId[model.id]; |
| delete this._byCid[model.cid]; |
| this.models.splice(this.indexOf(model), 1); |
| this.length--; |
| if (!options.silent) model.trigger('remove', model, this, options); |
| this._removeReference(model); |
| return model; |
| }, |
| |
| // Internal method to remove a model's ties to a collection. |
| _removeReference : function(model) { |
| if (this == model.collection) { |
| delete model.collection; |
| } |
| model.unbind('all', this._onModelEvent); |
| }, |
| |
| // Internal method called every time a model in the set fires an event. |
| // Sets need to update their indexes when models change ids. All other |
| // events simply proxy through. "add" and "remove" events that originate |
| // in other collections are ignored. |
| _onModelEvent : function(ev, model, collection, options) { |
| if ((ev == 'add' || ev == 'remove') && collection != this) return; |
| if (ev == 'destroy') { |
| this._remove(model, options); |
| } |
| if (model && ev === 'change:' + model.idAttribute) { |
| delete this._byId[model.previous(model.idAttribute)]; |
| this._byId[model.id] = model; |
| } |
| this.trigger.apply(this, arguments); |
| } |
| |
| }); |
| |
| // Underscore methods that we want to implement on the Collection. |
| var methods = ['forEach', 'each', 'map', 'reduce', 'reduceRight', 'find', 'detect', |
| 'filter', 'select', 'reject', 'every', 'all', 'some', 'any', 'include', |
| 'contains', 'invoke', 'max', 'min', 'sortBy', 'sortedIndex', 'toArray', 'size', |
| 'first', 'rest', 'last', 'without', 'indexOf', 'lastIndexOf', 'isEmpty', 'groupBy']; |
| |
| // Mix in each Underscore method as a proxy to `Collection#models`. |
| _.each(methods, function(method) { |
| Backbone.Collection.prototype[method] = function() { |
| return _[method].apply(_, [this.models].concat(_.toArray(arguments))); |
| }; |
| }); |
| |
| // Backbone.Router |
| // ------------------- |
| |
| // Routers map faux-URLs to actions, and fire events when routes are |
| // matched. Creating a new one sets its `routes` hash, if not set statically. |
| Backbone.Router = function(options) { |
| options || (options = {}); |
| if (options.routes) this.routes = options.routes; |
| this._bindRoutes(); |
| this.initialize.apply(this, arguments); |
| }; |
| |
| // Cached regular expressions for matching named param parts and splatted |
| // parts of route strings. |
| var namedParam = /:([\w\d]+)/g; |
| var splatParam = /\*([\w\d]+)/g; |
| var escapeRegExp = /[-[\]{}()+?.,\\^$|#\s]/g; |
| |
| // Set up all inheritable **Backbone.Router** properties and methods. |
| _.extend(Backbone.Router.prototype, Backbone.Events, { |
| |
| // Initialize is an empty function by default. Override it with your own |
| // initialization logic. |
| initialize : function(){}, |
| |
| // Manually bind a single named route to a callback. For example: |
| // |
| // this.route('search/:query/p:num', 'search', function(query, num) { |
| // ... |
| // }); |
| // |
| route : function(route, name, callback) { |
| Backbone.history || (Backbone.history = new Backbone.History); |
| if (!_.isRegExp(route)) route = this._routeToRegExp(route); |
| Backbone.history.route(route, _.bind(function(fragment) { |
| var args = this._extractParameters(route, fragment); |
| callback.apply(this, args); |
| this.trigger.apply(this, ['route:' + name].concat(args)); |
| }, this)); |
| }, |
| |
| // Simple proxy to `Backbone.history` to save a fragment into the history. |
| navigate : function(fragment, triggerRoute) { |
| Backbone.history.navigate(fragment, triggerRoute); |
| }, |
| |
| // Bind all defined routes to `Backbone.history`. We have to reverse the |
| // order of the routes here to support behavior where the most general |
| // routes can be defined at the bottom of the route map. |
| _bindRoutes : function() { |
| if (!this.routes) return; |
| var routes = []; |
| for (var route in this.routes) { |
| routes.unshift([route, this.routes[route]]); |
| } |
| for (var i = 0, l = routes.length; i < l; i++) { |
| this.route(routes[i][0], routes[i][1], this[routes[i][1]]); |
| } |
| }, |
| |
| // Convert a route string into a regular expression, suitable for matching |
| // against the current location hash. |
| _routeToRegExp : function(route) { |
| route = route.replace(escapeRegExp, "\\$&") |
| .replace(namedParam, "([^\/]*)") |
| .replace(splatParam, "(.*?)"); |
| return new RegExp('^' + route + '$'); |
| }, |
| |
| // Given a route, and a URL fragment that it matches, return the array of |
| // extracted parameters. |
| _extractParameters : function(route, fragment) { |
| return route.exec(fragment).slice(1); |
| } |
| |
| }); |
| |
| // Backbone.History |
| // ---------------- |
| |
| // Handles cross-browser history management, based on URL fragments. If the |
| // browser does not support `onhashchange`, falls back to polling. |
| Backbone.History = function() { |
| this.handlers = []; |
| _.bindAll(this, 'checkUrl'); |
| }; |
| |
| // Cached regex for cleaning hashes. |
| var hashStrip = /^#*/; |
| |
| // Cached regex for detecting MSIE. |
| var isExplorer = /msie [\w.]+/; |
| |
| // Has the history handling already been started? |
| var historyStarted = false; |
| |
| // Set up all inheritable **Backbone.History** properties and methods. |
| _.extend(Backbone.History.prototype, { |
| |
| // The default interval to poll for hash changes, if necessary, is |
| // twenty times a second. |
| interval: 50, |
| |
| // Get the cross-browser normalized URL fragment, either from the URL, |
| // the hash, or the override. |
| getFragment : function(fragment, forcePushState) { |
| if (fragment == null) { |
| if (this._hasPushState || forcePushState) { |
| fragment = window.location.pathname; |
| var search = window.location.search; |
| if (search) fragment += search; |
| if (fragment.indexOf(this.options.root) == 0) fragment = fragment.substr(this.options.root.length); |
| } else { |
| fragment = window.location.hash; |
| } |
| } |
| return decodeURIComponent(fragment.replace(hashStrip, '')); |
| }, |
| |
| // Start the hash change handling, returning `true` if the current URL matches |
| // an existing route, and `false` otherwise. |
| start : function(options) { |
| |
| // Figure out the initial configuration. Do we need an iframe? |
| // Is pushState desired ... is it available? |
| if (historyStarted) throw new Error("Backbone.history has already been started"); |
| this.options = _.extend({}, {root: '/'}, this.options, options); |
| this._wantsPushState = !!this.options.pushState; |
| this._hasPushState = !!(this.options.pushState && window.history && window.history.pushState); |
| var fragment = this.getFragment(); |
| var docMode = document.documentMode; |
| var oldIE = (isExplorer.exec(navigator.userAgent.toLowerCase()) && (!docMode || docMode <= 7)); |
| if (oldIE) { |
| this.iframe = $('<iframe src="javascript:0" tabindex="-1" />').hide().appendTo('body')[0].contentWindow; |
| this.navigate(fragment); |
| } |
| |
| // Depending on whether we're using pushState or hashes, and whether |
| // 'onhashchange' is supported, determine how we check the URL state. |
| if (this._hasPushState) { |
| $(window).bind('popstate', this.checkUrl); |
| } else if ('onhashchange' in window && !oldIE) { |
| $(window).bind('hashchange', this.checkUrl); |
| } else { |
| setInterval(this.checkUrl, this.interval); |
| } |
| |
| // Determine if we need to change the base url, for a pushState link |
| // opened by a non-pushState browser. |
| this.fragment = fragment; |
| historyStarted = true; |
| var loc = window.location; |
| var atRoot = loc.pathname == this.options.root; |
| if (this._wantsPushState && !this._hasPushState && !atRoot) { |
| this.fragment = this.getFragment(null, true); |
| window.location.replace(this.options.root + '#' + this.fragment); |
| // Return immediately as browser will do redirect to new url |
| return true; |
| } else if (this._wantsPushState && this._hasPushState && atRoot && loc.hash) { |
| this.fragment = loc.hash.replace(hashStrip, ''); |
| window.history.replaceState({}, document.title, loc.protocol + '//' + loc.host + this.options.root + this.fragment); |
| } |
| |
| if (!this.options.silent) { |
| return this.loadUrl(); |
| } |
| }, |
| |
| // Add a route to be tested when the fragment changes. Routes added later may |
| // override previous routes. |
| route : function(route, callback) { |
| this.handlers.unshift({route : route, callback : callback}); |
| }, |
| |
| // Checks the current URL to see if it has changed, and if it has, |
| // calls `loadUrl`, normalizing across the hidden iframe. |
| checkUrl : function(e) { |
| var current = this.getFragment(); |
| if (current == this.fragment && this.iframe) current = this.getFragment(this.iframe.location.hash); |
| if (current == this.fragment || current == decodeURIComponent(this.fragment)) return false; |
| if (this.iframe) this.navigate(current); |
| this.loadUrl() || this.loadUrl(window.location.hash); |
| }, |
| |
| // Attempt to load the current URL fragment. If a route succeeds with a |
| // match, returns `true`. If no defined routes matches the fragment, |
| // returns `false`. |
| loadUrl : function(fragmentOverride) { |
| var fragment = this.fragment = this.getFragment(fragmentOverride); |
| var matched = _.any(this.handlers, function(handler) { |
| if (handler.route.test(fragment)) { |
| handler.callback(fragment); |
| return true; |
| } |
| }); |
| return matched; |
| }, |
| |
| // Save a fragment into the hash history. You are responsible for properly |
| // URL-encoding the fragment in advance. This does not trigger |
| // a `hashchange` event. |
| navigate : function(fragment, triggerRoute) { |
| var frag = (fragment || '').replace(hashStrip, ''); |
| if (this.fragment == frag || this.fragment == decodeURIComponent(frag)) return; |
| if (this._hasPushState) { |
| var loc = window.location; |
| if (frag.indexOf(this.options.root) != 0) frag = this.options.root + frag; |
| this.fragment = frag; |
| window.history.pushState({}, document.title, loc.protocol + '//' + loc.host + frag); |
| } else { |
| window.location.hash = this.fragment = frag; |
| if (this.iframe && (frag != this.getFragment(this.iframe.location.hash))) { |
| this.iframe.document.open().close(); |
| this.iframe.location.hash = frag; |
| } |
| } |
| if (triggerRoute) this.loadUrl(fragment); |
| } |
| |
| }); |
| |
| // Backbone.View |
| // ------------- |
| |
| // Creating a Backbone.View creates its initial element outside of the DOM, |
| // if an existing element is not provided... |
| Backbone.View = function(options) { |
| this.cid = _.uniqueId('view'); |
| this._configure(options || {}); |
| this._ensureElement(); |
| this.delegateEvents(); |
| this.initialize.apply(this, arguments); |
| }; |
| |
| // Element lookup, scoped to DOM elements within the current view. |
| // This should be prefered to global lookups, if you're dealing with |
| // a specific view. |
| var selectorDelegate = function(selector) { |
| return $(selector, this.el); |
| }; |
| |
| // Cached regex to split keys for `delegate`. |
| var eventSplitter = /^(\S+)\s*(.*)$/; |
| |
| // List of view options to be merged as properties. |
| var viewOptions = ['model', 'collection', 'el', 'id', 'attributes', 'className', 'tagName']; |
| |
| // Set up all inheritable **Backbone.View** properties and methods. |
| _.extend(Backbone.View.prototype, Backbone.Events, { |
| |
| // The default `tagName` of a View's element is `"div"`. |
| tagName : 'div', |
| |
| // Attach the `selectorDelegate` function as the `$` property. |
| $ : selectorDelegate, |
| |
| // Initialize is an empty function by default. Override it with your own |
| // initialization logic. |
| initialize : function(){}, |
| |
| // **render** is the core function that your view should override, in order |
| // to populate its element (`this.el`), with the appropriate HTML. The |
| // convention is for **render** to always return `this`. |
| render : function() { |
| return this; |
| }, |
| |
| // Remove this view from the DOM. Note that the view isn't present in the |
| // DOM by default, so calling this method may be a no-op. |
| remove : function() { |
| $(this.el).remove(); |
| return this; |
| }, |
| |
| // For small amounts of DOM Elements, where a full-blown template isn't |
| // needed, use **make** to manufacture elements, one at a time. |
| // |
| // var el = this.make('li', {'class': 'row'}, this.model.escape('title')); |
| // |
| make : function(tagName, attributes, content) { |
| var el = document.createElement(tagName); |
| if (attributes) $(el).attr(attributes); |
| if (content) $(el).html(content); |
| return el; |
| }, |
| |
| // Set callbacks, where `this.callbacks` is a hash of |
| // |
| // *{"event selector": "callback"}* |
| // |
| // { |
| // 'mousedown .title': 'edit', |
| // 'click .button': 'save' |
| // } |
| // |
| // pairs. Callbacks will be bound to the view, with `this` set properly. |
| // Uses event delegation for efficiency. |
| // Omitting the selector binds the event to `this.el`. |
| // This only works for delegate-able events: not `focus`, `blur`, and |
| // not `change`, `submit`, and `reset` in Internet Explorer. |
| delegateEvents : function(events) { |
| if (!(events || (events = this.events))) return; |
| if (_.isFunction(events)) events = events.call(this); |
| $(this.el).unbind('.delegateEvents' + this.cid); |
| for (var key in events) { |
| var method = this[events[key]]; |
| if (!method) throw new Error('Event "' + events[key] + '" does not exist'); |
| var match = key.match(eventSplitter); |
| var eventName = match[1], selector = match[2]; |
| method = _.bind(method, this); |
| eventName += '.delegateEvents' + this.cid; |
| if (selector === '') { |
| $(this.el).bind(eventName, method); |
| } else { |
| $(this.el).delegate(selector, eventName, method); |
| } |
| } |
| }, |
| |
| // Performs the initial configuration of a View with a set of options. |
| // Keys with special meaning *(model, collection, id, className)*, are |
| // attached directly to the view. |
| _configure : function(options) { |
| if (this.options) options = _.extend({}, this.options, options); |
| for (var i = 0, l = viewOptions.length; i < l; i++) { |
| var attr = viewOptions[i]; |
| if (options[attr]) this[attr] = options[attr]; |
| } |
| this.options = options; |
| }, |
| |
| // Ensure that the View has a DOM element to render into. |
| // If `this.el` is a string, pass it through `$()`, take the first |
| // matching element, and re-assign it to `el`. Otherwise, create |
| // an element from the `id`, `className` and `tagName` proeprties. |
| _ensureElement : function() { |
| if (!this.el) { |
| var attrs = this.attributes || {}; |
| if (this.id) attrs.id = this.id; |
| if (this.className) attrs['class'] = this.className; |
| this.el = this.make(this.tagName, attrs); |
| } else if (_.isString(this.el)) { |
| this.el = $(this.el).get(0); |
| } |
| } |
| |
| }); |
| |
| // The self-propagating extend function that Backbone classes use. |
| var extend = function (protoProps, classProps) { |
| var child = inherits(this, protoProps, classProps); |
| child.extend = this.extend; |
| return child; |
| }; |
| |
| // Set up inheritance for the model, collection, and view. |
| Backbone.Model.extend = Backbone.Collection.extend = |
| Backbone.Router.extend = Backbone.View.extend = extend; |
| |
| // Map from CRUD to HTTP for our default `Backbone.sync` implementation. |
| var methodMap = { |
| 'create': 'POST', |
| 'update': 'PUT', |
| 'delete': 'DELETE', |
| 'read' : 'GET' |
| }; |
| |
| // Backbone.sync |
| // ------------- |
| |
| // Override this function to change the manner in which Backbone persists |
| // models to the server. You will be passed the type of request, and the |
| // model in question. By default, uses makes a RESTful Ajax request |
| // to the model's `url()`. Some possible customizations could be: |
| // |
| // * Use `setTimeout` to batch rapid-fire updates into a single request. |
| // * Send up the models as XML instead of JSON. |
| // * Persist models via WebSockets instead of Ajax. |
| // |
| // Turn on `Backbone.emulateHTTP` in order to send `PUT` and `DELETE` requests |
| // as `POST`, with a `_method` parameter containing the true HTTP method, |
| // as well as all requests with the body as `application/x-www-form-urlencoded` instead of |
| // `application/json` with the model in a param named `model`. |
| // Useful when interfacing with server-side languages like **PHP** that make |
| // it difficult to read the body of `PUT` requests. |
| Backbone.sync = function(method, model, options) { |
| var type = methodMap[method]; |
| |
| // Default JSON-request options. |
| var params = _.extend({ |
| type: type, |
| dataType: 'json' |
| }, options); |
| |
| // Ensure that we have a URL. |
| if (!params.url) { |
| params.url = getUrl(model) || urlError(); |
| } |
| |
| // Ensure that we have the appropriate request data. |
| if (!params.data && model && (method == 'create' || method == 'update')) { |
| params.contentType = 'application/json'; |
| params.data = JSON.stringify(model.toJSON()); |
| } |
| |
| // For older servers, emulate JSON by encoding the request into an HTML-form. |
| if (Backbone.emulateJSON) { |
| params.contentType = 'application/x-www-form-urlencoded'; |
| params.data = params.data ? {model : params.data} : {}; |
| } |
| |
| // For older servers, emulate HTTP by mimicking the HTTP method with `_method` |
| // And an `X-HTTP-Method-Override` header. |
| if (Backbone.emulateHTTP) { |
| if (type === 'PUT' || type === 'DELETE') { |
| if (Backbone.emulateJSON) params.data._method = type; |
| params.type = 'POST'; |
| params.beforeSend = function(xhr) { |
| xhr.setRequestHeader('X-HTTP-Method-Override', type); |
| }; |
| } |
| } |
| |
| // Don't process data on a non-GET request. |
| if (params.type !== 'GET' && !Backbone.emulateJSON) { |
| params.processData = false; |
| } |
| |
| // Make the request. |
| return $.ajax(params); |
| }; |
| |
| // Helpers |
| // ------- |
| |
| // Shared empty constructor function to aid in prototype-chain creation. |
| var ctor = function(){}; |
| |
| // Helper function to correctly set up the prototype chain, for subclasses. |
| // Similar to `goog.inherits`, but uses a hash of prototype properties and |
| // class properties to be extended. |
| var inherits = function(parent, protoProps, staticProps) { |
| var child; |
| |
| // The constructor function for the new subclass is either defined by you |
| // (the "constructor" property in your `extend` definition), or defaulted |
| // by us to simply call `super()`. |
| if (protoProps && protoProps.hasOwnProperty('constructor')) { |
| child = protoProps.constructor; |
| } else { |
| child = function(){ return parent.apply(this, arguments); }; |
| } |
| |
| // Inherit class (static) properties from parent. |
| _.extend(child, parent); |
| |
| // Set the prototype chain to inherit from `parent`, without calling |
| // `parent`'s constructor function. |
| ctor.prototype = parent.prototype; |
| child.prototype = new ctor(); |
| |
| // Add prototype properties (instance properties) to the subclass, |
| // if supplied. |
| if (protoProps) _.extend(child.prototype, protoProps); |
| |
| // Add static properties to the constructor function, if supplied. |
| if (staticProps) _.extend(child, staticProps); |
| |
| // Correctly set child's `prototype.constructor`. |
| child.prototype.constructor = child; |
| |
| // Set a convenience property in case the parent's prototype is needed later. |
| child.__super__ = parent.prototype; |
| |
| return child; |
| }; |
| |
| // Helper function to get a URL from a Model or Collection as a property |
| // or as a function. |
| var getUrl = function(object) { |
| if (!(object && object.url)) return null; |
| return _.isFunction(object.url) ? object.url() : object.url; |
| }; |
| |
| // Throw an error when a URL is needed, and none is supplied. |
| var urlError = function() { |
| throw new Error('A "url" property or function must be specified'); |
| }; |
| |
| // Wrap an optional error callback with a fallback error event. |
| var wrapError = function(onError, model, options) { |
| return function(resp) { |
| if (onError) { |
| onError(model, resp, options); |
| } else { |
| model.trigger('error', model, resp, options); |
| } |
| }; |
| }; |
| |
| // Helper function to escape a string for HTML rendering. |
| var escapeHTML = function(string) { |
| return string.replace(/&(?!\w+;|#\d+;|#x[\da-f]+;)/gi, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"').replace(/'/g, ''').replace(/\//g,'/'); |
| }; |
| |
| }).call(this); |