Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

JSDay Italy - Backbone.js

4,042 views

Published on

Published in: Technology, Economy & Finance
  • Be the first to comment

JSDay Italy - Backbone.js

  1. 1. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  2. 2. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  3. 3. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  4. 4. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  5. 5. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  6. 6. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  7. 7. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  8. 8. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  9. 9. var Animal, myAnimal;Animal = function (name) { this.name = name || Unknown;}Animal.prototype = { say: function () { console.log( Hi, my name is + this.name + ! ); }}myAnimal = new Animal(Bello);myAnimal.say(); // Hi, my name is Bello!
  10. 10. var Animal = Backbone.Model.extend({ say: function () {}});var Dog = Animal.extend({ bark: function () {}});
  11. 11. var Animal = Backbone.Model.extend({ say: function () {}});var Dog = Animal.extend({ bark: function () {}});
  12. 12. var Animal = Backbone.Model.extend({ say: function () {}});var Dog = Animal.extend({ bark: function () {}});
  13. 13. var Animal = Backbone.Model.extend({ say: function () {}});var Dog = Animal.extend({ bark: function () {}});
  14. 14. var Animal = Backbone.Model.extend({ say: function () {}});var Dog = Animal.extend({ bark: function () {}});
  15. 15. var Animal = Backbone.Model.extend({ say: function () {}});var Dog = Animal.extend({ bark: function () {}});
  16. 16. var Dog = Animal.extend({ bark: function () {}});var myDog = new Dog({ name: Bello});
  17. 17. var Dog = Animal.extend({ bark: function () {}});var myDog = new Dog({ name: Bello});
  18. 18. // 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;
  19. 19. // 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;
  20. 20. // 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;
  21. 21. // 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;
  22. 22. // 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;
  23. 23. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  24. 24. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  25. 25. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  26. 26. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  27. 27. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  28. 28. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  29. 29. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  30. 30. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  31. 31. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  32. 32. var AppRouter = Backbone.Router.extend({ routes: { : index, q?:query: query, show/:id: show }, index: function () {}, query: function (queryString) {}, show: function (id) {}});
  33. 33. Backbone.Router.extend({ routes: { /* matches search/pierre/zurich */ search/:who/:where: serach, /* matches download/avatar/@shvi/large */ download/*path: download } search: function (who, where) {}, download: function (path) {}});
  34. 34. Backbone.Router.extend({ routes: { /* matches search/pierre/zurich */ search/:who/:where: serach, /* matches download/avatar/@shvi/large */ download/*path: download } search: function (who, where) {}, download: function (path) {}});
  35. 35. var AppRouter = Backbone.Router.extend({ // …});new AppRouter();Backbone.history.start();
  36. 36. var AppRouter = Backbone.Router.extend({ // …});new AppRouter();Backbone.history.start();
  37. 37. var AppRouter = Backbone.Router.extend({ // …});new AppRouter();Backbone.history.start();
  38. 38. var Comment = Backbone.Model.extend({});var newComment = new Comment({ name: Pierre Spring, email: pierre@nelm.io, text: Hello World});
  39. 39. var Comment = Backbone.Model.extend({});var newComment = new Comment({ name: Pierre Spring, email: pierre@nelm.io, text: Hello World});
  40. 40. var Comment = Backbone.Model.extend({});var newComment = new Comment({ name: Pierre Spring, email: pierre@nelm.io, text: Hello World});
  41. 41. var Comment = Backbone.Model.extend({});var newComment = new Comment({ name: Pierre Spring, email: pierre@nelm.io, text: Hello World});
  42. 42. var Comment = Backbone.Model.extend({});var newComment = new Comment({ name: Pierre Spring, email: pierre@nelm.io, text: Hello World});
  43. 43. var Comment = Backbone.Model.extend({});var newComment = new Comment({ name: Pierre Spring, email: pierre@nelm.io, text: Hello World});
  44. 44. var newComment = new Comment({ text: Hello World});newComment.set({ name: Pierre Spring, email: pierre@nelm.io});newComment.get(name); // Pierre Spring
  45. 45. var newComment = new Comment({ text: Hello World});newComment.set({ name: Pierre Spring, email: pierre@nelm.io});newComment.get(name); // Pierre Spring
  46. 46. var newComment = new Comment({ text: Hello World});newComment.set({ name: Pierre Spring, email: pierre@nelm.io});newComment.get(name); // Pierre Spring
  47. 47. var newComment = new Comment({ text: Hello World});newComment.set({ name: Pierre Spring, email: pierre@nelm.io});newComment.get(name); // Pierre Spring
  48. 48. var Comment = Backbone.Model.extend({});var newComment = new Comment({ /* … */ });newComment.save();
  49. 49. var Comment = Backbone.Model.extend({ url: /api/comment/});var newComment = new Comment({ /* … */ });newComment.save();
  50. 50. var Comment = Backbone.Model.extend({ localStorage: new Store("comment")});var newComment = new Comment({ /* … */ });newComment.save();
  51. 51. var Comment = Backbone.Model.extend({ localStorage: new Store("comment"), initialize: function (options) { }});var newComment = new Comment({ /* … */ });newComment.save();
  52. 52. var Comment = Backbone.Model.extend({ localStorage: new Store("comment"), initialize: function (options) { if (!options.date) { this.set({ date: moment().toString() }); } }});var newComment = new Comment({ /* … */ });newComment.save();
  53. 53. var Comment = Backbone.Model.extend({ localStorage: new Store("comment"), initialize: function (options) { if (!options.date) { this.set({ date: moment().toString() }); } }});var newComment = new Comment({ /* … */ });newComment.save();
  54. 54. var Comment = Backbone.Model.extend({ localStorage: new Store("comment"), initialize: function (options) { if (!options.date) { this.set({ date: moment().toString() }); } }});var newComment = new Comment({ /* … */ });newComment.save();
  55. 55. var Comment = Backbone.Model.extend({ localStorage: new Store("comment"), initialize: function (options) { if (!options.date) { this.set({ date: moment().toString() }); } }, getDisplayDate: function () { var d = this.get(date); return moment(d).fromNow(); }});
  56. 56. var Comment = Backbone.Model.extend({ localStorage: new Store("comment"), initialize: function (options) { if (!options.date) { this.set({ date: moment().toString() }); } }, getDisplayDate: function () { var d = this.get(date); return moment(d).fromNow(); }});
  57. 57. var Comment = Backbone.Model.extend({ localStorage: new Store("comment"), initialize: function (options) { if (!options.date) { this.set({ date: moment().toString() }); } }, getDisplayDate: function () { var d = this.get(date); return moment(d).fromNow(); }});
  58. 58. var Comment = Backbone.Model.extend({ localStorage: new Store("comment"), initialize: function (options) { if (!options.date) { this.set({ date: moment().toString() }); } }, getDisplayDate: function () { var d = this.get(date); return moment(d).fromNow(); }});
  59. 59. var newComment = new Comment({ /* … */ });newComment.getDisplayDate();// a few seconds ago
  60. 60. Backbone.Collection.extend({ model: CommentModel, localStorage: new Store("comment")});
  61. 61. Backbone.Collection.extend({ model: CommentModel, localStorage: new Store("comment")});
  62. 62. Backbone.Collection.extend({ model: CommentModel, localStorage: new Store("comment")});
  63. 63. Backbone.Collection.extend({ model: CommentModel, localStorage: new Store("comment")});
  64. 64. Backbone.Collection.extend({ model: CommentModel, localStorage: new Store("comment")});
  65. 65. var CommentCollection = Backbone.Collection.extend({ /* … */});var commentCollection = new CommentCollection();commentCollection.fetch();commentCollection.each(function (commentModel) { // do s.th.});
  66. 66. var CommentCollection = Backbone.Collection.extend({ /* … */});var commentCollection = new CommentCollection();commentCollection.fetch();commentCollection.each(function (commentModel) { // do s.th.});
  67. 67. var CommentCollection = Backbone.Collection.extend({ /* … */});var commentCollection = new CommentCollection();commentCollection.fetch();commentCollection.each(function (commentModel) { // do s.th.});
  68. 68. var CommentCollection = Backbone.Collection.extend({ /* … */});var commentCollection = new CommentCollection();commentCollection.fetch();commentCollection.each(function (commentModel) { // do s.th.});
  69. 69. var CommentCollection = Backbone.Collection.extend({ /* … */});var commentCollection = new CommentCollection();commentCollection.fetch();commentCollection.each(function (commentModel) { // do s.th.});
  70. 70. var newComment = new Comment({ /* … */ });newComment.save();commentCollection.add(newComment);
  71. 71. var newComment = new Comment({ /* … */ });newComment.save();commentCollection.add(newComment);
  72. 72. var newComment = new Comment({ /* … */ });newComment.save();commentCollection.add(newComment);
  73. 73. var newComment = new Comment({ /* … */ });newComment.save();commentCollection.add(newComment);
  74. 74. var newComment = new Comment({ /* … */ });newComment.save();commentCollection.add(newComment);var newComment = commentCollection.create({ /* model attributes */});
  75. 75. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  76. 76. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  77. 77. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  78. 78. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  79. 79. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  80. 80. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  81. 81. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  82. 82. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  83. 83. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  84. 84. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  85. 85. newComment.bind( change, function (model) {});newComment.bind( change:name, function (model, attribute) {});commentCollection.bind( reset, function (commentCollection) {});commentCollection.bind( add, function (commentModel) {});
  86. 86. var CommentView = Backbone.View.extend({});var commentView = new CommentView();console.log(commentView.el);// <div></div>
  87. 87. var CommentView = Backbone.View.extend({});var commentView = new CommentView();console.log(commentView.el);// <div></div>
  88. 88. var CommentView = Backbone.View.extend({});var commentView = new CommentView();console.log(commentView.el);// <div></div>
  89. 89. var CommentView = Backbone.View.extend({});var commentView = new CommentView();console.log(commentView.el);// <div></div>
  90. 90. var CommentView = Backbone.View.extend({});var commentView = new CommentView();console.log(commentView.el);// <div></div>
  91. 91. var CommentView = Backbone.View.extend({ tagName: p, className: comment-list, id: container,});var commentView = new CommentView();console.log(commentView.el);// <p id=​"container" class=​"comment-list"/>
  92. 92. var CommentView = Backbone.View.extend({ tagName: p, className: comment-list, id: container,});var commentView = new CommentView();console.log(commentView.el);// <p id=​"container" class=​"comment-list"/>
  93. 93. var CommentView = Backbone.View.extend({ tagName: p, className: comment-list, id: container,});var commentView = new CommentView();console.log(commentView.el);// <p id=​"container" class=​"comment-list"/>
  94. 94. var CommentView = Backbone.View.extend({ tagName: p, className: comment-list, id: container,});var commentView = new CommentView();console.log(commentView.el);// <p id=​"container" class=​"comment-list"/>
  95. 95. var CommentView = Backbone.View.extend({ el: $(#comment-list)});var commentView = new CommentView();console.log(commentView.el);
  96. 96. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  97. 97. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  98. 98. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  99. 99. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  100. 100. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  101. 101. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  102. 102. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  103. 103. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  104. 104. var commentCollection = new commentCollection();var commentView = new CommentView({ commentCollection: commentCollection});
  105. 105. var commentCollection = new commentCollection();var commentView = new CommentView({ commentCollection: commentCollection});
  106. 106. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  107. 107. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  108. 108. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  109. 109. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  110. 110. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  111. 111. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  112. 112. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  113. 113. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  114. 114. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  115. 115. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  116. 116. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  117. 117. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  118. 118. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  119. 119. var CommentView = Backbone.View.extend({ initialize: function (options) { this.listRowTemplate = _.template($(#listRowTemplate).html()); options.commentCollection.bind(reset, this.renderRows, this); options.commentCollection.bind(add, this.renderRow, this); }, renderRows: function (commentCollection) { commentCollection.each(function (commentModel) { this.renderRow(commentModel); }, this); }, renderRow: function (commentModel) { $(this.el).prepend( this.listRowTemplate({ comment: commentModel.toJSON() }) ); }});
  120. 120. var commentCollection = new commentCollection();var commentView = new CommentView({ commentCollection: commentCollection});$(.list-view).html(commentView.el);commentCollection.fetch();
  121. 121. var commentCollection = new commentCollection();var commentView = new CommentView({ commentCollection: commentCollection});$(.list-view).html(commentView.el);commentCollection.fetch();
  122. 122. var commentCollection = new commentCollection();var commentView = new CommentView({ commentCollection: commentCollection});$(.list-view).html(commentView.el);commentCollection.fetch();
  123. 123. var commentCollection = new commentCollection();var commentView = new CommentView({ commentCollection: commentCollection});$(.list-view).html(commentView.el);commentCollection.fetch();
  124. 124. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  125. 125. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  126. 126. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  127. 127. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  128. 128. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  129. 129. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  130. 130. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  131. 131. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  132. 132. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});
  133. 133. var CommentFormView = Backbone.View.extend({ events: { submit form: newComment }, initialize: function (options) { /* … */ }, render: function () { /* … */ }, newComment: function (e) { var options, comment; e.preventDefault(); options = {}; _.each( this.$(form).serializeArray(), function (field) { options[field.name] = field.value; } ); this.commentCollection.create(options); this.$(input, textarea).val(); }});

×