mirror of
https://github.com/samuelclay/NewsBlur.git
synced 2025-09-18 21:50:56 +00:00
Re-styling feed and story title selection.
This commit is contained in:
Samuel Clay
parent
104d50ff46
commit
8d1e791716
5 changed files with 175 additions and 98 deletions
|
|
@ -620,10 +620,8 @@ hr {
|
|||
.NB-feedlist .feed {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
border-top: 1px solid #F7F8F5;
|
||||
border-bottom: 1px solid #F7F8F5;
|
||||
padding-right: 2px;
|
||||
padding-bottom: 3px;
|
||||
padding: 2px 2px 2px 6px;
|
||||
margin: 0 4px;
|
||||
background-color: #F7F8F5;
|
||||
}
|
||||
|
||||
|
|
@ -720,8 +718,8 @@ hr {
|
|||
}
|
||||
.NB-feedlist img.feed_favicon {
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
top: 4px;
|
||||
left: 6px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
|
@ -732,13 +730,13 @@ hr {
|
|||
top: 4px;
|
||||
}
|
||||
.NB-density-compact.NB-theme-feed-size-s .NB-feedlist img.feed_favicon {
|
||||
top: 2px;
|
||||
}
|
||||
.NB-theme-feed-size-m .NB-feedlist img.feed_favicon {
|
||||
top: 4px;
|
||||
}
|
||||
.NB-theme-feed-size-m .NB-feedlist img.feed_favicon {
|
||||
top: 6px;
|
||||
}
|
||||
.NB-density-compact.NB-theme-feed-size-m .NB-feedlist img.feed_favicon {
|
||||
top: 2px;
|
||||
top: 4px;
|
||||
}
|
||||
.NB-theme-feed-size-l .NB-feedlist img.feed_favicon {
|
||||
top: 4px;
|
||||
|
|
@ -754,13 +752,13 @@ hr {
|
|||
}
|
||||
.NB-feedlist .feed_title {
|
||||
display: block;
|
||||
padding: 5px 40px 0 23px;
|
||||
padding: 4px 40px 4px 26px;
|
||||
text-decoration: none;
|
||||
color: rgba(0,0,0,.7);
|
||||
line-height: 1.3em;
|
||||
overflow: hidden;
|
||||
text-shadow: 0 1px 0 rgba(250, 250, 250, .4);
|
||||
|
||||
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
|
|
@ -771,13 +769,14 @@ hr {
|
|||
|
||||
.NB-density-compact .NB-feedlist .feed_title {
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
.NB-feedlist .feed .NB-feedlist-manage-icon,
|
||||
.NB-feedlist .folder_title .NB-feedlist-manage-icon {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
left: -20px;
|
||||
top: -1px;
|
||||
top: 2px;
|
||||
width: 20px;
|
||||
height: 22px;
|
||||
background: transparent url('/media/embed/icons/circular/g_icn_arrow_right.png') no-repeat 4px 6px;
|
||||
|
|
@ -811,7 +810,7 @@ hr {
|
|||
}
|
||||
.NB-feedlist .feed.NB-toplevel .NB-feedlist-manage-icon,
|
||||
.NB-feedlist .folder_title.NB-toplevel .NB-feedlist-manage-icon {
|
||||
left: 0;
|
||||
left: 3px;
|
||||
opacity: 1;
|
||||
display: none;
|
||||
background-position: 6px 7px;
|
||||
|
|
@ -905,11 +904,11 @@ hr {
|
|||
|
||||
.NB-feedlist .feed_counts {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 1px;
|
||||
right: 4px;
|
||||
top: 3px;
|
||||
}
|
||||
.NB-density-compact .NB-feedlist .feed_counts {
|
||||
top: -1px;
|
||||
top: 1px;
|
||||
}
|
||||
.NB-feedlist .NB-feedbar-mark-feed-read {
|
||||
display: none;
|
||||
|
|
@ -919,11 +918,10 @@ hr {
|
|||
.NB-feeds-header.NB-selected,
|
||||
.NB-feedlist .folder.NB-selected > .folder_title {
|
||||
background-color: #FFFFD2;
|
||||
/* background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFD2), to(#F5F9B4));
|
||||
background: -moz-linear-gradient(center top , #FFFFD2 0%, #F5F9B4 100%); */
|
||||
border-top: 1px solid rgb(241 241 189);
|
||||
border-bottom: 1px solid rgb(241 241 189);
|
||||
/* background-color: #c9e5fb; */
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.NB-feedlist .folder.NB-selected > .folder_title {
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
|
@ -1734,20 +1732,19 @@ hr {
|
|||
position: relative;
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
padding: 0px 154px 0px 28px;
|
||||
padding: 0 154px 0 28px;
|
||||
text-decoration: none;
|
||||
color: #272727;
|
||||
line-height: 15px;
|
||||
font-size: 13px;
|
||||
/* background-color: white;
|
||||
border-top: 1px solid #E7EDF6;
|
||||
border-bottom: 1px solid #FFF;
|
||||
*/
|
||||
background-color: #FDFCFA;
|
||||
border-top: 1px solid #FFF;
|
||||
border-bottom: 1px solid #F9F8F4;
|
||||
}
|
||||
|
||||
.NB-density-compact .NB-story-title {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.NB-theme-feed-size-xs .NB-story-title {
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
|
|
@ -1791,7 +1788,7 @@ hr {
|
|||
}
|
||||
|
||||
.NB-story-pane-west .NB-story-title {
|
||||
padding-right: 4px;
|
||||
padding-right: 10px;
|
||||
padding-left: 32px;
|
||||
}
|
||||
.NB-view-river .NB-story-title {
|
||||
|
|
@ -1826,6 +1823,7 @@ hr {
|
|||
.NB-image-preview-small-left .NB-view-river .NB-story-pane-west .NB-story-title,
|
||||
.NB-image-preview-large-left .NB-view-river .NB-story-pane-west .NB-story-title {
|
||||
padding-left: 120px;
|
||||
padding-right: 6px;
|
||||
}
|
||||
.NB-image-preview-small-left .NB-view-river .NB-story-title.NB-story-grid,
|
||||
.NB-image-preview-large-left .NB-view-river .NB-story-title.NB-story-grid {
|
||||
|
|
@ -1867,10 +1865,10 @@ hr {
|
|||
width: 24px;
|
||||
height: 20px;
|
||||
left: 0;
|
||||
top: 2px;
|
||||
top: 12px;
|
||||
}
|
||||
.NB-story-pane-west .NB-story-title .NB-storytitles-sentiment {
|
||||
left: 4px;
|
||||
left: 7px;
|
||||
}
|
||||
.NB-image-preview-small-left .NB-story-title .NB-storytitles-sentiment,
|
||||
.NB-image-preview-large-left .NB-story-title .NB-storytitles-sentiment {
|
||||
|
|
@ -1883,7 +1881,7 @@ hr {
|
|||
|
||||
.NB-image-preview-small-left .NB-view-river .NB-story-pane-west .NB-story-title .NB-storytitles-sentiment,
|
||||
.NB-image-preview-large-left .NB-view-river .NB-story-pane-west .NB-story-title .NB-storytitles-sentiment {
|
||||
top: 24px;
|
||||
top: 36px;
|
||||
}
|
||||
.NB-story-title.NB-story-positive .NB-storytitles-sentiment {
|
||||
background: transparent url('/media/embed/icons/circular/g_icn_focus.png') no-repeat 13px 6px;
|
||||
|
|
@ -1924,6 +1922,7 @@ hr {
|
|||
.NB-image-preview-large-left .NB-story-title .NB-storytitles-story-image {
|
||||
right: inherit;
|
||||
left: 8px;
|
||||
top: 0;
|
||||
}
|
||||
.NB-image-preview-large-left .NB-layout-magazine .NB-story-title .NB-storytitles-story-image {
|
||||
height: 100%;
|
||||
|
|
@ -1995,8 +1994,6 @@ hr {
|
|||
}
|
||||
|
||||
.NB-story-title .NB-storytitles-author {
|
||||
padding-left: 12px;
|
||||
color: #808080;
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-theme-feed-size-xs .NB-story-title .NB-storytitles-author {
|
||||
|
|
@ -2012,8 +2009,12 @@ hr {
|
|||
font-size: 13px;
|
||||
}
|
||||
|
||||
.NB-story-title.read .NB-middot {
|
||||
color: #cac9c5;
|
||||
}
|
||||
.NB-story-title.read .NB-storytitles-author {
|
||||
color: #cac9c5;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.NB-story-title.NB-selected .NB-storytitles-author {
|
||||
|
|
@ -2251,14 +2252,14 @@ hr {
|
|||
display: none;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 2px;
|
||||
top: 12px;
|
||||
width: 28px;
|
||||
height: 22px;
|
||||
background: transparent url('/media/embed/icons/circular/g_icn_arrow_right.png') no-repeat 13px 6px;
|
||||
background-size: 8px;
|
||||
}
|
||||
.NB-story-pane-west .NB-story-title .NB-story-manage-icon {
|
||||
left: 4px;
|
||||
left: 7px;
|
||||
}
|
||||
.NB-image-preview-small-left .NB-story-title .NB-story-manage-icon,
|
||||
.NB-image-preview-large-left .NB-story-title .NB-story-manage-icon {
|
||||
|
|
@ -2274,7 +2275,7 @@ hr {
|
|||
}
|
||||
.NB-image-preview-small-left .NB-view-river .NB-story-pane-west .NB-story-title .NB-story-manage-icon,
|
||||
.NB-image-preview-large-left .NB-view-river .NB-story-pane-west .NB-story-title .NB-story-manage-icon {
|
||||
top: 24px;
|
||||
top: 36px;
|
||||
}
|
||||
.NB-story-title:hover .NB-story-manage-icon {
|
||||
display: block;
|
||||
|
|
@ -2314,43 +2315,40 @@ hr {
|
|||
opacity: 1;
|
||||
}
|
||||
|
||||
.NB-story-title .story_date {
|
||||
position: absolute;
|
||||
width: 140px;
|
||||
top: 5px;
|
||||
right: 0;
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-image-preview-small-right .NB-story-title.NB-has-image .story_date,
|
||||
.NB-image-preview-large-right .NB-story-title.NB-has-image .story_date {
|
||||
width: 236px;
|
||||
}
|
||||
.NB-theme-feed-size-xs .NB-story-title .story_date {
|
||||
.NB-theme-feed-size-xs .NB-story-title-bottom-line {
|
||||
font-size: 10px;
|
||||
}
|
||||
.NB-theme-feed-size-m .NB-story-title .story_date {
|
||||
.NB-theme-feed-size-s .NB-story-title-bottom-line {
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-theme-feed-size-m .NB-story-title-bottom-line {
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-theme-feed-size-l .NB-story-title-bottom-line {
|
||||
font-size: 12px;
|
||||
}
|
||||
.NB-theme-feed-size-l .NB-story-title .story_date {
|
||||
.NB-theme-feed-size-xl .NB-story-title-bottom-line {
|
||||
font-size: 13px;
|
||||
}
|
||||
.NB-theme-feed-size-xl .NB-story-title .story_date {
|
||||
font-size: 14px;
|
||||
}
|
||||
.NB-story-pane-west .NB-story-title .story_date {
|
||||
position: static;
|
||||
margin: 4px 0 4px 4px;
|
||||
color: #929697;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: block;
|
||||
font-weight: normal;
|
||||
clear: both;
|
||||
}
|
||||
.NB-density-compact .NB-story-pane-west .NB-story-title .story_date {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.NB-story-title .story_date {
|
||||
position: absolute;
|
||||
width: 140px;
|
||||
top: 11px;
|
||||
right: 0;
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-story-title.NB-selected .story_date {
|
||||
/* text-shadow: 1px 1px 0 rgba(255, 255, 255, .5);*/
|
||||
|
|
@ -2358,13 +2356,22 @@ hr {
|
|||
.NB-story-title.read .story_date {
|
||||
color: #cac9c5;
|
||||
}
|
||||
|
||||
.NB-story-title-bottom-line {
|
||||
color: #A6A3A7;
|
||||
font-weight: normal;
|
||||
}
|
||||
.NB-story-title {
|
||||
transition: transform .12s ease-out, border-radius .12s ease-out;
|
||||
}
|
||||
.NB-story-title.NB-selected,
|
||||
.NB-interaction:hover:not(.NB-disabled) {
|
||||
color: #304080;
|
||||
background-color: #FFFEE2;
|
||||
/* background-color: #e8f3ff; */
|
||||
border-top: 1px solid rgb(255 254 237);
|
||||
border-bottom: 1px solid rgb(249 248 222);
|
||||
background-color: #FFFEE2;
|
||||
transform: scale(0.97);
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.NB-story-title:hover:not(.NB-selected) {
|
||||
|
|
@ -2656,20 +2663,20 @@ hr {
|
|||
.NB-story-grid .NB-storytitles-content-preview {
|
||||
height: auto;
|
||||
-webkit-line-clamp: inherit;
|
||||
font-size: 13px;
|
||||
font-size: 12px;
|
||||
line-height: 1.44em;
|
||||
}
|
||||
.NB-theme-feed-size-xs .NB-story-grid .NB-storytitles-content-preview {
|
||||
font-size: 11px;
|
||||
font-size: 10px;
|
||||
}
|
||||
.NB-theme-feed-size-s .NB-story-grid .NB-storytitles-content-preview {
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-theme-feed-size-l .NB-story-grid .NB-storytitles-content-preview {
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.NB-theme-feed-size-xl .NB-story-grid .NB-storytitles-content-preview {
|
||||
font-size: 15px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.NB-story-grid.read .NB-storytitles-content-preview {
|
||||
|
|
@ -2682,37 +2689,58 @@ hr {
|
|||
left: 0;
|
||||
background-color: #FDFCFA;
|
||||
width: 100%;
|
||||
padding: 12px 6px 6px;
|
||||
padding: 4px 16px 6px 6px;
|
||||
color: #A6A3A7;
|
||||
font-weight: normal;
|
||||
border-top: 1px solid #f2f2f2;
|
||||
margin-left: 8px;
|
||||
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.NB-theme-feed-size-xs .NB-story-title .NB-storytitles-grid-bottom {
|
||||
font-size: 10px;
|
||||
}
|
||||
.NB-theme-feed-size-s .NB-story-title .NB-storytitles-grid-bottom {
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-theme-feed-size-m .NB-story-title .NB-storytitles-grid-bottom {
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-theme-feed-size-l .NB-story-title .NB-storytitles-grid-bottom {
|
||||
font-size: 12px;
|
||||
}
|
||||
.NB-theme-feed-size-xl .NB-story-title .NB-storytitles-grid-bottom {
|
||||
font-size: 13px;
|
||||
}
|
||||
.NB-story-title .NB-storytitles-grid-bottom .story_date {
|
||||
padding-left: 18px;
|
||||
}
|
||||
.NB-story-grid:not(.read):hover .NB-storytitles-grid-bottom {
|
||||
background-color: #F7F7F6;
|
||||
}
|
||||
.NB-storytitles-magazine-bottom {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
color: #A6A3A7;
|
||||
font-weight: normal;
|
||||
}
|
||||
.NB-storytitles-magazine-bottom .story_date {
|
||||
top: 0;
|
||||
|
||||
.NB-theme-feed-size-xs .NB-story-title .NB-storytitles-magazine-bottom {
|
||||
font-size: 10px;
|
||||
}
|
||||
.NB-layout-magazine .NB-story-title .NB-storytitles-author {
|
||||
padding-left: 4px;
|
||||
.NB-theme-feed-size-s .NB-story-title .NB-storytitles-magazine-bottom {
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-story-grid.NB-story-title .NB-storytitles-author {
|
||||
float: left;
|
||||
display: block;
|
||||
padding: 0 4px 2px 24px;
|
||||
line-height: 16px;
|
||||
.NB-theme-feed-size-m .NB-story-title .NB-storytitles-magazine-bottom {
|
||||
font-size: 11px;
|
||||
}
|
||||
.NB-story-grid .story_date {
|
||||
position: static;
|
||||
width: auto;
|
||||
float: right;
|
||||
display: block;
|
||||
padding: 0 4px 0 0;
|
||||
.NB-theme-feed-size-l .NB-story-title .NB-storytitles-magazine-bottom {
|
||||
font-size: 12px;
|
||||
}
|
||||
.NB-theme-feed-size-xl .NB-story-title .NB-storytitles-magazine-bottom {
|
||||
font-size: 13px;
|
||||
}
|
||||
.NB-story-title.NB-story-grid .NB-storytitles-sentiment,
|
||||
.NB-story-title.NB-story-grid .NB-story-manage-icon {
|
||||
|
|
@ -2992,14 +3020,14 @@ body {
|
|||
width: 62px;
|
||||
height: 70%;
|
||||
left: 22px;
|
||||
top: 7px;
|
||||
top: 16px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.NB-image-preview-small-right .NB-storytitles-story-image {
|
||||
width: 62px;
|
||||
height: 70%;
|
||||
right: 12px;
|
||||
top: 12px;
|
||||
top: 16px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.NB-image-preview-small-left .NB-layout-magazine .NB-storytitles-story-image-container,
|
||||
|
|
@ -4932,14 +4960,14 @@ body {
|
|||
.NB-feeds-header .NB-feeds-header-icon {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 2px;
|
||||
left: 10px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.NB-feeds-header .NB-feeds-header-title {
|
||||
display: block;
|
||||
padding: 4px 4px 4px 23px;
|
||||
padding: 4px 4px 4px 36px;
|
||||
text-decoration: none;
|
||||
color: #545454;
|
||||
overflow: hidden;
|
||||
|
|
|
|||
|
|
@ -749,7 +749,7 @@ NEWSBLUR.AssetModel = Backbone.Router.extend({
|
|||
page: page,
|
||||
read_filter: this.view_setting(feed_id, 'read_filter')
|
||||
}, callback, callback, {
|
||||
'ajax_group': 'feed_page'
|
||||
'ajax_group': 'dashboard'
|
||||
});
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1724,10 +1724,8 @@
|
|||
this.set_correct_story_view_for_feed();
|
||||
this.apply_resizable_layout({right_side: true});
|
||||
|
||||
if (_.contains(['grid', 'magazine'], original_layout) ||
|
||||
_.contains(['grid', 'magazine'], story_layout)) {
|
||||
NEWSBLUR.app.story_titles.render();
|
||||
}
|
||||
NEWSBLUR.app.story_titles.render();
|
||||
|
||||
if (story_layout == 'list') {
|
||||
if (this.active_story) {
|
||||
this.active_story.story_title_view.toggle_selected();
|
||||
|
|
@ -2854,7 +2852,7 @@
|
|||
var feed_id = this.active_feed;
|
||||
var feed = this.model.get_feed(feed_id);
|
||||
|
||||
// console.log(['load_page_of_feed_stories', this.flags['opening_feed'], this.counts['page']]);
|
||||
console.log(['load_page_of_feed_stories', this.flags['opening_feed'], this.counts['page']]);
|
||||
if (this.flags['opening_feed']) return;
|
||||
|
||||
this.flags['opening_feed'] = true;
|
||||
|
|
|
|||
|
|
@ -25,10 +25,13 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
},
|
||||
|
||||
render: function() {
|
||||
var template_name = !this.model.get('selected') && this.options.is_grid ?
|
||||
'grid_template' : 'template';
|
||||
var template_name = 'template';
|
||||
if (this.options.is_list) template_name = "list_template";
|
||||
if (this.options.is_grid) template_name = "grid_template";
|
||||
if (this.options.is_magazine) template_name = "magazine_template";
|
||||
if (this.model.get('selected')) template_name = "template";
|
||||
// console.log(['render story title', template_name, this.$el[0], this.options.is_grid, this.show_image_preview(), this.options.override_layout, NEWSBLUR.assets.get_feed(this.model.get('story_feed_id'))]);
|
||||
var story_layout = this.options.override_layout || NEWSBLUR.assets.view_setting(NEWSBLUR.reader.active_feed, 'layout');
|
||||
this.$el.html(this[template_name]({
|
||||
story : this.model,
|
||||
feed : (this.options.override_layout == 'split' ||
|
||||
|
|
@ -37,14 +40,14 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
NEWSBLUR.assets.get_feed(this.model.get('story_feed_id')),
|
||||
options : this.options,
|
||||
show_content_preview : this.show_content_preview(template_name),
|
||||
show_image_preview : this.show_image_preview()
|
||||
show_image_preview: this.show_image_preview(),
|
||||
show_inline_author: story_layout == "list"
|
||||
}));
|
||||
this.$st = this.$(".NB-story-title");
|
||||
this.toggle_classes();
|
||||
this.toggle_read_status();
|
||||
this.color_feedbar();
|
||||
this.load_youtube_embeds();
|
||||
var story_layout = this.options.override_layout || NEWSBLUR.assets.view_setting(NEWSBLUR.reader.active_feed, 'layout');
|
||||
if (this.options.is_grid) this.watch_grid_image();
|
||||
if (_.contains(['list', 'magazine'], story_layout) && this.show_image_preview()) this.watch_grid_image();
|
||||
if (_.contains(['split'], story_layout) && this.show_image_preview() && NEWSBLUR.assets.preference('feed_view_single_story')) this.watch_grid_image();
|
||||
|
|
@ -72,6 +75,50 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
<div class="NB-storytitles-star"></div>\
|
||||
<div class="NB-storytitles-share"></div>\
|
||||
<span class="NB-storytitles-title"><%= story.get("story_title") %></span>\
|
||||
<% if (show_content_preview) { %>\
|
||||
<div class="NB-storytitles-content-preview"><%= show_content_preview %></div>\
|
||||
<% } %>\
|
||||
</a>\
|
||||
<div class="NB-story-title-bottom-line">\
|
||||
<span class="story_date NB-hidden-fade"><%= story.formatted_short_date() %></span>\
|
||||
<% if (story.story_authors()) { %><span class="NB-middot">·</span><% } %>\
|
||||
<span class="NB-storytitles-author"><%= story.story_authors() %></span>\
|
||||
</div>\
|
||||
<% if (story.get("comment_count_friends")) { %>\
|
||||
<div class="NB-storytitles-shares">\
|
||||
<% _.each(story.get("commented_by_friends"), function(user_id) { %>\
|
||||
<% if (NEWSBLUR.assets.user_profiles.find(user_id)) { %>\
|
||||
<img class="NB-user-avatar" src="<%= NEWSBLUR.assets.user_profiles.find(user_id).get("photo_url") %>">\
|
||||
<% } %>\
|
||||
<% }) %>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
<div class="NB-story-manage-icon" role="button"></div>\
|
||||
</div>\
|
||||
<div class="NB-story-detail"></div>\
|
||||
'),
|
||||
|
||||
list_template: _.template('\
|
||||
<div class="NB-story-title <% if (!show_content_preview) { %>NB-story-title-hide-preview<% } %> <% if (show_image_preview) { %>NB-has-image<% } %> ">\
|
||||
<div class="NB-storytitles-feed-border-inner"></div>\
|
||||
<div class="NB-storytitles-feed-border-outer"></div>\
|
||||
<div class="NB-storytitles-sentiment" role="button"></div>\
|
||||
<% if (show_image_preview) { %>\
|
||||
<div class="NB-storytitles-story-image-container">\
|
||||
<div class="NB-storytitles-story-image" <% if (story.image_url()) { %>style="background-image: none, url(\'<%= story.image_url() %>\');"<% } %>></div>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
<a href="<%= story.get("story_permalink") %>" class="story_title NB-hidden-fade">\
|
||||
<% if (feed) { %>\
|
||||
<div class="NB-story-feed">\
|
||||
<img class="feed_favicon" src="<%= $.favicon(feed) %>">\
|
||||
<span class="feed_title"><%= feed.get("feed_title") %></span>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
<div class="NB-storytitles-star"></div>\
|
||||
<div class="NB-storytitles-share"></div>\
|
||||
<span class="NB-storytitles-title"><%= story.get("story_title") %></span>\
|
||||
<% if (story.story_authors()) { %><span class="NB-middot">·</span><% } %>\
|
||||
<span class="NB-storytitles-author"><%= story.story_authors() %></span>\
|
||||
<% if (show_content_preview) { %>\
|
||||
<div class="NB-storytitles-content-preview"><%= show_content_preview %></div>\
|
||||
|
|
@ -120,8 +167,9 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
</a>\
|
||||
</div>\
|
||||
<div class="NB-storytitles-grid-bottom">\
|
||||
<span class="NB-storytitles-author"><%= story.story_authors() %></span>\
|
||||
<span class="story_date NB-hidden-fade"><%= story.formatted_short_date() %></span>\
|
||||
<% if (story.story_authors()) { %><span class="NB-middot">·</span><% } %>\
|
||||
<span class="NB-storytitles-author"><%= story.story_authors() %></span>\
|
||||
</div>\
|
||||
<% if (story.get("comment_count_friends")) { %>\
|
||||
<div class="NB-storytitles-shares">\
|
||||
|
|
@ -162,8 +210,9 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
</a>\
|
||||
</div>\
|
||||
<div class="NB-storytitles-magazine-bottom">\
|
||||
<span class="NB-storytitles-author"><%= story.story_authors() %></span>\
|
||||
<span class="story_date NB-hidden-fade"><%= story.formatted_short_date() %></span>\
|
||||
<% if (story.story_authors()) { %><span class="NB-middot">·</span><% } %>\
|
||||
<span class="NB-storytitles-author"><%= story.story_authors() %></span>\
|
||||
</div>\
|
||||
<% if (story.get("comment_count_friends")) { %>\
|
||||
<div class="NB-storytitles-shares">\
|
||||
|
|
|
|||
|
|
@ -39,6 +39,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
|
|||
return new NEWSBLUR.Views.StoryTitleView({
|
||||
model: story,
|
||||
collection: collection,
|
||||
is_list: story_layout == 'list',
|
||||
is_grid: story_layout == 'grid',
|
||||
is_magazine: story_layout == 'magazine',
|
||||
override_layout: override_layout,
|
||||
|
|
@ -50,7 +51,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
|
|||
return story.el;
|
||||
});
|
||||
this.$el.html($stories);
|
||||
// console.log(['Rendered story titles', this.$el, $stories]);
|
||||
console.log(['Rendered story titles', this.$el, $stories]);
|
||||
this.end_loading();
|
||||
this.fill_out();
|
||||
this.override_grid();
|
||||
|
|
@ -71,6 +72,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
|
|||
return new NEWSBLUR.Views.StoryTitleView({
|
||||
model: story,
|
||||
collection: collection,
|
||||
is_list: story_layout == 'list',
|
||||
is_grid: story_layout == 'grid',
|
||||
is_magazine: story_layout == 'magazine',
|
||||
override_layout: override_layout,
|
||||
|
|
@ -178,13 +180,13 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
|
|||
}
|
||||
|
||||
options = options || {};
|
||||
// console.log(['fill out story titles', this.options.on_dashboard ? "dashboard" : "stories", options, NEWSBLUR.assets.flags['no_more_stories'], NEWSBLUR.assets.stories.length, NEWSBLUR.reader.flags.story_titles_closed]);
|
||||
console.log(['fill out story titles', this.options.on_dashboard ? "dashboard" : "stories", options, NEWSBLUR.assets.flags['no_more_stories'], NEWSBLUR.assets.stories.length, NEWSBLUR.reader.flags.story_titles_closed]);
|
||||
|
||||
if (this.collection.page_fill_outs < NEWSBLUR.reader.constants.FILL_OUT_PAGES &&
|
||||
!this.collection.no_more_stories) {
|
||||
var $last = this.$('.NB-story-title:visible:last');
|
||||
var container_height = this.$story_titles.height();
|
||||
// NEWSBLUR.log(["fill out", $last.length && $last.position().top, container_height, $last.length, this.$story_titles.scrollTop()]);
|
||||
NEWSBLUR.log(["fill out", $last.length && $last.position().top, container_height, $last.length, this.$story_titles.scrollTop()]);
|
||||
this.collection.page_fill_outs += 1;
|
||||
_.delay(_.bind(function() {
|
||||
this.scroll();
|
||||
|
|
@ -358,7 +360,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
|
|||
var visible_height = $story_titles.height() * 2;
|
||||
var total_height = this.$el.outerHeight() + NEWSBLUR.reader.$s.$feedbar.innerHeight();
|
||||
|
||||
// console.log(["scroll titles", this.options.on_dashboard ? "dashboard" : "stories", visible_height, scroll_y, ">", total_height, this.$el, container_offset]);
|
||||
console.log(["scroll titles", this.options.on_dashboard ? "dashboard" : "stories", visible_height, scroll_y, ">", total_height, this.$el, container_offset]);
|
||||
if (visible_height + scroll_y >= total_height) {
|
||||
NEWSBLUR.reader.load_page_of_feed_stories({scroll_to_loadbar: false});
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue