From 2a69c0ebd41747b04e72f7bd7f28bc58c03d2f56 Mon Sep 17 00:00:00 2001 From: Maxwell Salzberg Date: Thu, 19 Jan 2012 11:18:13 -0800 Subject: [PATCH] revert 9b1d64bb7611ba34a0c3a6fe6a95c8476fb55993 as it is causing inf. scroll to break (stream model now has a post collection) --- .../app/collections/{posts.js => stream.js} | 12 +- public/javascripts/app/router.js | 7 +- public/javascripts/app/views/feedback_view.js | 2 +- public/javascripts/app/views/post_view.js | 4 +- .../javascripts/app/views/publisher_view.js | 4 +- .../app/views/stream_faces_view.js | 2 +- public/javascripts/app/views/stream_view.js | 147 +++++++++--------- .../app/collections/stream_spec.js | 19 +++ spec/javascripts/app/models/stream_spec.js | 39 ----- spec/javascripts/app/views/post_view_spec.js | 2 +- .../app/views/stream_faces_view_spec.js | 13 +- .../javascripts/app/views/stream_view_spec.js | 13 +- 12 files changed, 122 insertions(+), 142 deletions(-) rename public/javascripts/app/collections/{posts.js => stream.js} (53%) create mode 100644 spec/javascripts/app/collections/stream_spec.js delete mode 100644 spec/javascripts/app/models/stream_spec.js diff --git a/public/javascripts/app/collections/posts.js b/public/javascripts/app/collections/stream.js similarity index 53% rename from public/javascripts/app/collections/posts.js rename to public/javascripts/app/collections/stream.js index 496d5a754..b16e137e1 100644 --- a/public/javascripts/app/collections/posts.js +++ b/public/javascripts/app/collections/stream.js @@ -1,5 +1,13 @@ -app.collections.Posts = Backbone.Collection.extend({ - url : "/posts", +app.collections.Stream = Backbone.Collection.extend({ + url: function() { + var path = document.location.pathname; + + if(this.models.length) { + path += "?max_time=" + _.last(this.models).createdAt(); + } + + return path; + }, model: function(attrs, options) { var modelClass = app.models[attrs.post_type] || app.models.Post diff --git a/public/javascripts/app/router.js b/public/javascripts/app/router.js index 986e2789b..ab7234f59 100644 --- a/public/javascripts/app/router.js +++ b/public/javascripts/app/router.js @@ -13,11 +13,10 @@ app.Router = Backbone.Router.extend({ }, stream : function() { - app.stream = new app.models.Stream() - app.page = new app.views.Stream().render(); - $("#main_stream").html(app.page.el); + app.stream = new app.views.Stream().render(); + $("#main_stream").html(app.stream.el); - var streamFacesView = new app.views.StreamFaces({collection : app.stream.posts}).render(); + var streamFacesView = new app.views.StreamFaces({collection : app.stream.collection}).render(); $('#selected_aspect_contacts .content').html(streamFacesView.el); } }); diff --git a/public/javascripts/app/views/feedback_view.js b/public/javascripts/app/views/feedback_view.js index bfa7110ad..84c1ced12 100644 --- a/public/javascripts/app/views/feedback_view.js +++ b/public/javascripts/app/views/feedback_view.js @@ -20,7 +20,7 @@ app.views.Feedback = app.views.StreamObject.extend({ reshare.save({}, { url: this.model.createReshareUrl, success : function(){ - app.stream.add(reshare); + app.stream.collection.add(reshare); } }); } diff --git a/public/javascripts/app/views/post_view.js b/public/javascripts/app/views/post_view.js index 94011ecfc..adb46d6b8 100644 --- a/public/javascripts/app/views/post_view.js +++ b/public/javascripts/app/views/post_view.js @@ -63,9 +63,9 @@ app.views.Post = app.views.StreamObject.extend({ success : function(){ if(!app.stream) { return } - _.each(app.stream.posts.models, function(model){ + _.each(app.stream.collection.models, function(model){ if(model.get("author").id == personId) { - app.stream.posts.remove(model); + app.stream.collection.remove(model); } }) } diff --git a/public/javascripts/app/views/publisher_view.js b/public/javascripts/app/views/publisher_view.js index 68e358ca0..989d2ce9a 100644 --- a/public/javascripts/app/views/publisher_view.js +++ b/public/javascripts/app/views/publisher_view.js @@ -12,7 +12,7 @@ app.views.Publisher = Backbone.View.extend({ }, initialize : function(){ - this.collection = this.collection || new app.collections.Posts; + this.collection = this.collection || new app.collections.Stream; return this; }, @@ -33,7 +33,7 @@ app.views.Publisher = Backbone.View.extend({ }, { url : "/status_messages", success : function() { - app.stream.posts.add(statusMessage.toJSON()); + app.stream.collection.add(statusMessage.toJSON()); } }); diff --git a/public/javascripts/app/views/stream_faces_view.js b/public/javascripts/app/views/stream_faces_view.js index ae5232fc7..d0979cd8a 100644 --- a/public/javascripts/app/views/stream_faces_view.js +++ b/public/javascripts/app/views/stream_faces_view.js @@ -8,7 +8,7 @@ app.views.StreamFaces = app.views.Base.extend({ initialize : function(){ this.updatePeople() - app.stream.posts.bind("add", this.updatePeople, this) + this.collection.bind("add", this.updatePeople, this) }, presenter : function() { diff --git a/public/javascripts/app/views/stream_view.js b/public/javascripts/app/views/stream_view.js index 8f396f392..d8c654697 100644 --- a/public/javascripts/app/views/stream_view.js +++ b/public/javascripts/app/views/stream_view.js @@ -3,84 +3,23 @@ app.views.Stream = Backbone.View.extend({ "click #paginate": "render" }, - initialize: function(options) { - this.stream = app.stream || new app.models.Stream() - this.collection = this.stream.posts + initialize: function() { + this.collection = this.collection || new app.collections.Stream; + this.collection.bind("add", this.addPost, this); + this.publisher = new app.views.Publisher({collection : this.collection}); - this.stream.bind("fetched", this.collectionFetched, this) - this.collection.bind("add", this.addPost, this); - this.setupInfiniteScroll() - this.setupLightbox() - }, - - addPost : function(post) { - var postView = new app.views.Post({ model: post }); - - $(this.el)[ - (this.collection.at(0).id == post.id) - ? "prepend" - : "append" - ](postView.render().el); - - return this; - }, - - isLoading : function(){ - return this._loading && !this._loading.isResolved(); - }, - - allContentLoaded : false, - - - collectionFetched: function(collection, response) { - this.removeLoader() - if(!collection.parse(response).length || collection.parse(response).length == 0) { - this.allContentLoaded = true; - $(window).unbind('scroll') - return - } - - $(this.el).append($("", { - href: this.stream.url(), - id: "paginate" - }).text('Load more posts')); - }, - - render : function(evt) { - if(evt) { evt.preventDefault(); } - - this.addLoader(); - this._loading = this.stream.fetch(); - - return this; - }, - - addLoader: function(){ - if(this.$("#paginate").length == 0) { - $(this.el).append($("
", { - "id" : "paginate" - })); - } - - this.$("#paginate").html($("", { - src : "/images/static-loader.png", - "class" : "loader" - })); - }, - - removeLoader : function(){ - this.$("#paginate").remove(); - }, - - setupLightbox : function(){ - this.lightbox = Diaspora.BaseWidget.instantiate("Lightbox"); - $(this.el).delegate("a.stream-photo-link", "click", this.lightbox.lightboxImageClicked); - }, - - setupInfiniteScroll : function() { + // inf scroll + // we're using this._loading to keep track of backbone's collection + // fetching state... is there a better way to do this? var throttledScroll = _.throttle($.proxy(this.infScroll, this), 200); $(window).scroll(throttledScroll); + + // lightbox delegation + this.lightbox = Diaspora.BaseWidget.instantiate("Lightbox"); + $(this.el).delegate("a.stream-photo-link", "click", this.lightbox.lightboxImageClicked); + + return this; }, infScroll : function() { @@ -97,4 +36,64 @@ app.views.Stream = Backbone.View.extend({ return this; }, + + isLoading : function(){ + return this._loading && !this._loading.isResolved(); + }, + + allContentLoaded : false, + + addPost : function(post) { + var postView = new app.views.Post({ model: post }); + + $(this.el)[ + (this.collection.at(0).id == post.id) + ? "prepend" + : "append" + ](postView.render().el); + + return this; + }, + + collectionFetched: function(collection, response) { + this.$("#paginate").remove(); + + if(!collection.parse(response).length || collection.parse(response).length == 0) { + this.allContentLoaded = true; + $(window).unbind('scroll') + return + } + + $(this.el).append($("", { + href: this.collection.url(), + id: "paginate" + }).text('Load more posts')); + }, + + render : function(evt) { + if(evt) { evt.preventDefault(); } + + var self = this; + self.addLoader(); + + this._loading = self.collection.fetch({ + add: true, + success: $.proxy(this.collectionFetched, self) + }); + + return this; + }, + + addLoader: function(){ + if(this.$("#paginate").length == 0) { + $(this.el).append($("
", { + "id" : "paginate" + })); + } + + this.$("#paginate").html($("", { + src : "/images/static-loader.png", + "class" : "loader" + })); + } }); diff --git a/spec/javascripts/app/collections/stream_spec.js b/spec/javascripts/app/collections/stream_spec.js new file mode 100644 index 000000000..145c09c57 --- /dev/null +++ b/spec/javascripts/app/collections/stream_spec.js @@ -0,0 +1,19 @@ +describe("app.collections.Stream", function() { + describe("url", function() { + var stream = new app.collections.Stream(), + expectedPath = document.location.pathname; + + it("returns the correct path", function() { + expect(stream.url()).toEqual(expectedPath); + }); + + it("returns the json path with max_time if the collection has models", function() { + var post = new app.models.Post(); + spyOn(post, "createdAt").andReturn(1234); + + stream.add(post); + + expect(stream.url()).toEqual(expectedPath + "?max_time=1234"); + }); + }); +}); diff --git a/spec/javascripts/app/models/stream_spec.js b/spec/javascripts/app/models/stream_spec.js deleted file mode 100644 index 064b8d8dd..000000000 --- a/spec/javascripts/app/models/stream_spec.js +++ /dev/null @@ -1,39 +0,0 @@ -describe("app.models.Stream", function() { - beforeEach(function(){ - this.stream = new app.models.Stream(), - this.expectedPath = document.location.pathname; - }) - - describe(".fetch", function() { - var postFetch - beforeEach(function(){ - postFetch = new $.Deferred() - - spyOn(this.stream.posts, "fetch").andCallFake(function(){ - return postFetch - }) - }) - - it("it fetches posts from the window's url, and ads them to tthe collection", function() { - this.stream.fetch() - expect(this.stream.posts.fetch).toHaveBeenCalledWith({ add : true, url : this.expectedPath}); - }); - - it("returns the json path with max_time if the collection has models", function() { - var post = new app.models.Post(); - spyOn(post, "createdAt").andReturn(1234); - this.stream.add(post); - - this.stream.fetch() - expect(this.stream.posts.fetch).toHaveBeenCalledWith({ add : true, url : this.expectedPath + "?max_time=1234"}); - }); - - it("triggers fetched on the stream when it is fetched", function(){ - var fetchedSpy = jasmine.createSpy() - this.stream.bind('fetched', fetchedSpy) - this.stream.fetch() - postFetch.resolve() - expect(fetchedSpy).toHaveBeenCalled() - }) - }); -}); diff --git a/spec/javascripts/app/views/post_view_spec.js b/spec/javascripts/app/views/post_view_spec.js index aedea5128..790913afd 100644 --- a/spec/javascripts/app/views/post_view_spec.js +++ b/spec/javascripts/app/views/post_view_spec.js @@ -13,7 +13,7 @@ describe("app.views.Post", function(){ var posts = $.parseJSON(spec.readFixture("multi_stream_json"))["posts"]; - this.collection = new app.collections.Posts(posts); + this.collection = new app.collections.Stream(posts); this.statusMessage = this.collection.models[0]; this.reshare = this.collection.models[1]; }) diff --git a/spec/javascripts/app/views/stream_faces_view_spec.js b/spec/javascripts/app/views/stream_faces_view_spec.js index 8cdf4eb6c..d94a8bc99 100644 --- a/spec/javascripts/app/views/stream_faces_view_spec.js +++ b/spec/javascripts/app/views/stream_faces_view_spec.js @@ -9,11 +9,8 @@ describe("app.views.StreamFaces", function(){ this.post6 = factory.post({author : rebeccaBlack}) this.post7 = factory.post({author : rebeccaBlack}) - app.stream = new app.models.Stream() - app.stream.add([this.post1, this.post2, this.post3, this.post4, this.post5, this.post6, this.post7]); - this.posts = app.stream.posts - - this.view = new app.views.StreamFaces({collection : this.posts}) + this.stream = new app.collections.Stream([this.post1, this.post2, this.post3, this.post4, this.post5, this.post6, this.post7]); + this.view = new app.views.StreamFaces({collection : this.stream}) }) it("should take them unique", function(){ @@ -22,7 +19,7 @@ describe("app.views.StreamFaces", function(){ }) it("findsPeople when the collection changes", function(){ - this.posts.add(factory.post({author : factory.author({name : "Harriet Tubman"})})) + this.stream.add(factory.post({author : factory.author({name : "Harriet Tubman"})})) expect(this.view.people.length).toBe(6) }) @@ -42,8 +39,8 @@ describe("app.views.StreamFaces", function(){ it("rerenders when people are added, but caps to 15 people", function(){ var posts = _.map(_.range(20), function(){ return factory.post()}) - this.posts.reset(posts) //add 20 posts silently to the collection - this.posts.add(factory.post) //trigger an update + this.stream.reset(posts) //add 20 posts silently to the collection + this.stream.add(factory.post) //trigger an update expect(this.view.$("img").length).toBe(15) }) }) diff --git a/spec/javascripts/app/views/stream_view_spec.js b/spec/javascripts/app/views/stream_view_spec.js index 38160b033..0ef2cdd8b 100644 --- a/spec/javascripts/app/views/stream_view_spec.js +++ b/spec/javascripts/app/views/stream_view_spec.js @@ -4,17 +4,14 @@ describe("app.views.Stream", function(){ this.posts = $.parseJSON(spec.readFixture("multi_stream_json"))["posts"]; - app.stream = new app.models.Stream() - app.stream.add(this.posts); - - this.collection = app.stream.posts + this.collection = new app.collections.Stream(this.posts); this.view = new app.views.Stream({collection : this.collection}); - app.stream.bind("fetched", this.collectionFetched, this) //untested - // do this manually because we've moved loadMore into render?? this.view.render(); - _.each(this.view.collection.models, function(post){ this.view.addPost(post); }, this); + _.each(this.view.collection.models, function(post){ + this.view.addPost(post); + }, this); }) describe("initialize", function(){ @@ -45,7 +42,7 @@ describe("app.views.Stream", function(){ // NOTE: inf scroll happens at 500px beforeEach(function(){ - spyOn(this.view.collection, "fetch").andReturn($.Deferred()) + spyOn(this.view.collection, "fetch") }) context("when the user is at the bottom of the page", function(){