How to use backbone

view.js

GitHub: blitzagency/rich

38
39
40
41
42
43
44
45
46
// we need to own initialize, this includes marionette.View()
// AND backbone.View()
constructor: function(options){
    options || (options = {});

    this.children = new backbone.ChildViewContainer();

    /* >>> BEGIN marionette.View() override */
     _.bindAll(this, 'render', 'invalidateView');

6

35

14

See more examples

bundle.js

GitHub: pipefishbook/jsonp-example

207
208
209
210
211
212
213
214
215
216

});
module.exports = Photos;

},{"backbone":10,"moment":11,"templates/photos.jst":5}],9:[function(require,module,exports){
// Backbone.Attributes.js 0.7.1
// ---------------

//     (c) 2014 Adam Krebs
//     Backbone.Attributes may be freely distributed under the MIT license.

1

0

2

See more examples

api.js

GitHub: overview/overview-server

8
9
10
11
12
13
14
15
16
module.exports = class Api {
  constructor(options) {
    if (!options.state) throw 'Must pass options.state, a State'
    if (!options.globalActions) throw 'Must pass options.globalActions, an Object of functions'

    // Inherit from Backbone.Events
    for (const f in Backbone.Events) {
      this[f] = Backbone.Events[f]
    }

36

269

21

See more examples

README.md?plain=1

GitHub: eventbrite/javascript

27
28
29
30
31
32
33
34
35
36
0. [Architecting JS Apps at Eventbrite](#architecting-js-apps-at-eventbrite)
0. [Debugging common issues](#debugging-common-issues)
0. [Testable Modular JS with Backbone, Jasmine & Sinon](#testable-modular-js-with-backbone-jasmine--sinon)


## Backbone.js

From the [Backbone.js](http://backbonejs.org/) docs:

> Backbone.js gives structure to web applications by providing **models** with key-value binding and custom events, **collections** with a rich API of enumerable functions, **views** with declarative event handling, and connects it all to your existing API over a RESTful JSON interface.

42

156

52

See more examples

layer-definitions-collection.js

GitHub: timchoh585/cartodb

33
34
35
36
37
38
39
40
41
42

save: function (options) {
  this.each(function (layerDefModel, index) {
    layerDefModel.set('order', index, { silent: true });
  });
  Backbone.sync('update', this, options);
},

toJSON: function () {
  return {

676

0

2

See more examples

fill.js

GitHub: toHero/cartodb

12
13
14
15
16
17
18
19
20
21
var INPUT_TYPE_MAP = {
  'size': InputNumber,
  'color': InputColor
};

Backbone.Form.editors.Fill = Backbone.Form.editors.Base.extend({
  className: 'Form-InputFill CDB-OptionInput CDB-Text js-input',

  events: {
    focus: function () {

676

0

3

See more examples

dataset.js

GitHub: foodora/cartodb

55
56
57
58
59
60
61
62
63
64
);
var userModel = new UserModel(userData, { configModel: configModel });
var modals = new ModalsServiceModel();
var tableModel = new TableModel(tableData, { parse: true, configModel: configModel });
var editorModel = new EditorModel();
var Router = new Backbone.Router();
var visModel = new VisTableModel(visData, { configModel: configModel });
var layersCollection = new Backbone.Collection(layersData);
var layerDataModel = layersCollection.find(function (mdl) {
  var kind = mdl.get('kind');

676

0

4

See more examples

boot.js

GitHub: acao/prose

65
66
67
68
69
70
71
72
73

  // Initialize router
  window.router = new Router({ user: model });

  // Start responding to routes
  Backbone.history.start();
},
error: function(model, res, options) {
  var apiStatus = status.githubApi(function(res) {

744

0

1

See more examples

README.md?plain=1

GitHub: eventbrite/javascript

119
120
121
122
123
124
125
126
127
return Marionette.ItemView.extend({ /* do something here */ });

// bad (access Marionette from Backbone)
var Backbone = require('backbone');

return Backbone.Marionette.ItemView.extend({ /* do something here */ });
```

**[⬆ back to top](#table-of-contents)**

42

156

52

See more examples

project.js

GitHub: voxmedia/autotune

47
48
49
50
51
52
53
54
55
56
 * Rebuild this project.
 * @returns {object} jqXHR object
 **/
build: function() {
  this.set('status', 'building');
  return Backbone.ajax({
    dataType: 'json',
    type: 'GET',
    url: this.url() + '/build'
  });

37

414

145

See more examples

map.js

GitHub: CartoDB/carto.js

30
31
32
33
34
35
36
37
38
39
this._layersFactory = options.layersFactory;

attrs = attrs || {};

this.layers = options.layersCollection || new Layers();
this.geometries = new Backbone.Collection();

var center = attrs.center || this.defaults.center;
if (typeof center === 'string') {
  center = JSON.parse(center);

272

419

115

See more examples

media-controller.js

GitHub: wp-shortcake/shortcake

4
5
6
7
8
9
10
11
12
13

var MediaController = wp.media.controller.State.extend({

        initialize: function(){

                this.props = new Backbone.Model({
                        currentShortcode: null,
                        action: 'select',
                        search: null,
                        insertCallback: this.insertCallback,

149

670

60

See more examples

editor.js

GitHub: litewrite/litewrite

2
3
4
5
6
7
8
9
10
11
var utils = require('../utils')
var lang = require('../translations')
var autosize = require('autosize')
var $ = require('jquery')

var EditorView = Backbone.View.extend({
  el: '#editor',

  initialize: function (options) {
    _.bindAll(

59

349

18

See more examples