make it clearer which frame is active, and fixes for scrolling flow.
This commit is contained in:
parent
1c81e4f587
commit
374ec73fa4
2 changed files with 20 additions and 16 deletions
|
|
@ -15,19 +15,22 @@ app.pages.Stream = app.views.Base.extend({
|
|||
this.stream.preloadOrFetch()
|
||||
|
||||
this.streamView = new app.pages.Stream.InfiniteScrollView({ model : this.stream })
|
||||
var interactions = this.interactionsView = new app.views.StreamInteractions()
|
||||
|
||||
this.stream.on("frame:interacted", function(post){
|
||||
interactions.setInteractions(post)
|
||||
})
|
||||
this.interactionsView = new app.views.StreamInteractions()
|
||||
|
||||
this.streamView.on('loadMore', this.updateUrlState, this);
|
||||
this.stream.on("fetched", this.refreshScrollSpy, this)
|
||||
this.stream.on("frame:interacted", this.selectFrame, this)
|
||||
},
|
||||
|
||||
postRenderTemplate : function() {
|
||||
this.$("#header").css("background-image", "url(" + app.currentUser.get("wallpaper") + ")")
|
||||
_.defer(function(){$('body').scrollspy({target : '.stream-frame-wrapper', offset : 50})})
|
||||
_.defer(function(){$('body').scrollspy({target : '.stream-frame-wrapper', offset : 205})})
|
||||
},
|
||||
|
||||
selectFrame : function(post){
|
||||
this.$(".stream-frame-wrapper").removeClass("selected-frame")
|
||||
this.$(".stream-frame-wrapper[data-id=" + post.id +"]").addClass("selected-frame")
|
||||
this.interactionsView.setInteractions(post)
|
||||
},
|
||||
|
||||
updateUrlState : function(){
|
||||
|
|
@ -42,15 +45,11 @@ app.pages.Stream = app.views.Base.extend({
|
|||
},
|
||||
|
||||
triggerInteractionLoad : function(evt){
|
||||
var id = $(evt.target).data("id");
|
||||
this.focusedPost = this.stream.items.get(id)
|
||||
this._throttledInteractions = this._throttledInteractions || _.bind(_.throttle(function(id){
|
||||
this.selectFrame(this.stream.items.get(id))
|
||||
}, 500), this)
|
||||
|
||||
this._throttledInteractions = this._throttledInteractions || _.bind(_.throttle(this.updateInteractions, 1000), this)
|
||||
this._throttledInteractions()
|
||||
},
|
||||
|
||||
updateInteractions: function () {
|
||||
this.interactionsView.setInteractions(this.focusedPost)
|
||||
this._throttledInteractions($(evt.target).data("id"))
|
||||
},
|
||||
|
||||
refreshScrollSpy : function(){
|
||||
|
|
|
|||
|
|
@ -412,6 +412,9 @@ color: white;
|
|||
|
||||
#stream-content {
|
||||
.stream-frame {
|
||||
.stream-frame-wrapper {
|
||||
position: relative; //interactions scroll spy gets confused about div height when there are images without this line.
|
||||
}
|
||||
margin-bottom : 40px;
|
||||
|
||||
.stream-frame-feedback {
|
||||
|
|
@ -439,10 +442,12 @@ color: white;
|
|||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
.selected-frame {
|
||||
.content {
|
||||
border: 10px solid red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.canvas-frame {
|
||||
width: 100%;
|
||||
|
|
|
|||
Loading…
Reference in a new issue