Highlighting the currently active stream in the leftNavBar
- This gives the user the sense of what he/she is currently viewing - The hover/selected are the same right now. Needs to change. - Need to find a more meaningful place for `markSelected` Moved markSelected to app.views.Stream - Removes duplication - All streams create this view, and this seems to do some setup on initializing, which is a good place to markNavSelected Changing highlight on hover to 'black' instead of the blue - The blue was a little intruisive - Also fixes the vertical alignment issue Changing the background to bluebg on hover
This commit is contained in:
parent
991a505439
commit
f53aa3e0e5
6 changed files with 24 additions and 17 deletions
|
|
@ -93,7 +93,6 @@ app.Router = Backbone.Router.extend({
|
|||
},
|
||||
|
||||
aspects_stream : function(){
|
||||
|
||||
var ids = app.aspects.selectedAspects('id');
|
||||
app.stream = new app.models.StreamAspects([], { aspects_ids: ids });
|
||||
app.stream.fetch();
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ app.views.Stream = app.views.InfScroll.extend(_.extend(
|
|||
this.setupLightbox()
|
||||
this.setupInfiniteScroll()
|
||||
this.setupShortcuts()
|
||||
this.markNavSelected()
|
||||
},
|
||||
|
||||
postClass : app.views.StreamPost,
|
||||
|
|
@ -28,5 +29,12 @@ app.views.Stream = app.views.InfScroll.extend(_.extend(
|
|||
function reRenderPostViews() {
|
||||
_.map(this.postViews, function(view){ view.render() })
|
||||
}
|
||||
},
|
||||
|
||||
markNavSelected : function() {
|
||||
var activeStream = Backbone.history.fragment;
|
||||
var streamSelection = $("#stream_selection");
|
||||
streamSelection.find("[data-stream]").removeClass("selected");
|
||||
streamSelection.find("[data-stream='" + activeStream + "']").addClass("selected");
|
||||
}
|
||||
}));
|
||||
|
|
|
|||
|
|
@ -38,14 +38,14 @@ $bluebg: #e7f2f7;
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
.selected { color: $black; }
|
||||
.selected a { color: $black; }
|
||||
|
||||
.hoverable {
|
||||
display: block;
|
||||
margin-right: 6px;
|
||||
padding: 4px;
|
||||
|
||||
&:hover {
|
||||
background-color: $bluebg;
|
||||
}
|
||||
padding: 4px 4px 4px 0;
|
||||
&:hover { background-color: $bluebg; }
|
||||
}
|
||||
|
||||
.selectable {
|
||||
|
|
|
|||
|
|
@ -2,5 +2,5 @@
|
|||
-# licensed under the Affero General Public License version 3 or later. See
|
||||
-# the COPYRIGHT file.
|
||||
|
||||
= link_to t('streams.aspects.title'), aspects_path, :class => 'hoverable', :rel => 'backbone'
|
||||
= link_to t('streams.aspects.title'), aspects_path, :class => 'hoverable', :rel => 'backbone', :data => {:stream => 'aspects'}
|
||||
%ul#aspects_list
|
||||
|
|
|
|||
|
|
@ -29,11 +29,11 @@
|
|||
= link_to current_user.first_name, local_or_remote_person_path(current_user.person)
|
||||
|
||||
%ul#stream_selection
|
||||
%li.hoverable
|
||||
%li.hoverable{:data => {:stream => 'activity'}}
|
||||
= link_to t("streams.activity.title"), activity_stream_path, :rel => 'backbone'
|
||||
%li.hoverable
|
||||
%li.hoverable{:data => {:stream => 'mentions'}}
|
||||
= link_to t('streams.mentions.title'), mentioned_stream_path, :rel => 'backbone'
|
||||
%li.hoverable
|
||||
%li.hoverable{:data => {:stream => 'stream'}}
|
||||
= link_to t("streams.multi.title"), stream_path, :rel => 'backbone'
|
||||
%li.all_aspects
|
||||
= render 'aspects/aspect_listings', :stream => @stream
|
||||
|
|
|
|||
|
|
@ -2,5 +2,5 @@
|
|||
-# licensed under the Affero General Public License version 3 or later. See
|
||||
-# the COPYRIGHT file.
|
||||
|
||||
= link_to t('streams.followed_tag.title'), followed_tags_stream_path, :class => 'hoverable'
|
||||
= link_to t('streams.followed_tag.title'), followed_tags_stream_path, :class => 'hoverable', :data => {:stream => 'followed_tags'}
|
||||
%ul#tags_list
|
||||
|
|
|
|||
Loading…
Reference in a new issue