public-mirrors/NewsBlur
1
0
Fork 0
mirror of https://github.com/samuelclay/NewsBlur.git synced 2025-08-31 21:41:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Rewrote story header to position sticky. Much better. Grid needs numbering to handle new grid layout.

Browse source
This commit is contained in:
Samuel Clay 2020-06-10 20:56:34 -04:00
parent 953b9712c2
commit 26dfca92d8
8 changed files with 31 additions and 74 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.tm_properties
View file

@ -1,2 +1,2 @@
exclude = '{$exclude,*.tgz,*.gz,static/*.js,static/*.css}'
excludeDirectories = "{$excludeDirectories,logs,data,clients/android,media/fonts,node_modules,venv,fonts,clients}"
excludeDirectories = "{$excludeDirectories,logs,data,clients/android,media/fonts,node_modules,venv,docker,fonts,clients}"

5
apps/reader/views.py
View file

@ -812,7 +812,10 @@ def load_single_feed(request, feed_id):
# time.sleep(random.randint(2, 7) / 10.0)
# time.sleep(random.randint(1, 10))
time.sleep(delay)
# if page == 1:
# time.sleep(1)
# else:
# time.sleep(20)
# if page == 2:
# assert False

34
media/css/reader.css
View file

@ -2164,32 +2164,32 @@ a img {
background-color: #F7F8F5;
}
.NB-layout-grid .NB-story-titles {
overflow: hidden;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 2rem;
padding: 2rem;
}
.NB-layout-grid .NB-story-content-container {
background-color: white;
}
.NB-layout-grid .NB-end-line {
margin-top: 24px;
float: left;
width: 100%;
margin: 0 -2rem -2rem;
grid-column-start: 1;
grid-column-end: 4;
}
.NB-layout-grid .NB-story-title-container {
}
.NB-layout-grid .NB-story-title-container.NB-selected {
clear: both;
overflow: hidden;
}
.NB-layout-grid .NB-story-title-container.NB-selected .NB-story-title {
margin-top: 24px;
grid-column-start: 1;
grid-column-end: 4;
margin: 0 -2rem;
}
.NB-story-grid {
margin: 3% 0 0 3%;
margin: 0;
border: 1px solid rgba(0, 0, 0, .2);
position: relative;
float: left;
width: 42%;
height: 360px;
padding: 0;
border-radius: 2px;
@ -2210,7 +2210,7 @@ a img {
}
.NB-layout-grid.NB-grid-columns-3 .NB-story-grid,
.NB-wide-content .NB-story-grid {
width: 29%;
/* width: 29%;*/
}
.NB-layout-grid.NB-grid-columns-4 .NB-story-grid,
.NB-extra-wide-content .NB-story-grid {
@ -2226,7 +2226,6 @@ a img {
}
.NB-story-grid.NB-selected {
clear: both;
}
.NB-story-grid .NB-storytitles-content {
@ -2697,7 +2696,6 @@ body {
list-style: none;
background-color: white;
position: relative;
overflow: hidden;
}
.NB-feed-story .NB-feed-story-header {
@ -2746,7 +2744,8 @@ body {
rgb(55,55,55) 84%
);
padding: 2px 200px 2px 28px;
position: relative;
position: sticky;
top: 0;
border-bottom: 1px solid #000;
border-top: 1px solid #707070;
z-index: 2;
@ -3750,7 +3749,6 @@ body {
.NB-feed-story {
margin: 0;
clear: both;
overflow: hidden;
}
.NB-feed-stories.NB-feed-view-story .NB-feed-story {

1
media/js/newsblur/reader/reader.js
View file

@ -51,7 +51,6 @@
$read_header: $('.NB-feeds-header-read'),
$tryfeed_header: $('.NB-feeds-header-tryfeed'),
$taskbar: $('.NB-taskbar-view'),
$feed_floater: $('.NB-feed-story-view-floater'),
$feedbar: $('.NB-feedbar'),
$add_button: $('.NB-task-add'),
$taskbar_options: $('.NB-taskbar-options'),

16
media/js/newsblur/views/story_detail_view.js
View file

@ -171,15 +171,15 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
},
story_header_template: _.template('\
<div class="NB-feed-story-header-feed">\
<% if (feed) { %>\
<div class="NB-feed-story-feed">\
<img class="feed_favicon" src="<%= $.favicon(feed) %>">\
<span class="NB-feed-story-header-title"><%= feed.get("feed_title") %></span>\
</div>\
<% } %>\
</div>\
<div class="NB-feed-story-header">\
<div class="NB-feed-story-header-feed">\
<% if (feed) { %>\
<div class="NB-feed-story-feed">\
<img class="feed_favicon" src="<%= $.favicon(feed) %>">\
<span class="NB-feed-story-header-title"><%= feed.get("feed_title") %></span>\
</div>\
<% } %>\
</div>\
<div class="NB-feed-story-header-info">\
<div class="NB-feed-story-title-container">\
<div class="NB-feed-story-sentiment"></div>\

42
media/js/newsblur/views/story_list_view.js
View file

@ -73,7 +73,6 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
this.$el.html(_.pluck(stories, 'el'));
_.invoke(stories, 'attach_handlers');
}
this.show_correct_feed_in_feed_title_floater();
this.stories = stories;
_.defer(this.check_feed_view_scrolled_to_bottom);
this.end_loading();
@ -286,44 +285,6 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
this.$el.append($end_stories_line);
},
show_correct_feed_in_feed_title_floater: function(story, hide) {
var $story, $header;
var $feed_floater = NEWSBLUR.reader.$s.$feed_floater;
story = story || NEWSBLUR.reader.active_story;
if (!hide && story && story.get('story_feed_id') &&
this.cache.feed_title_floater_feed_id != story.get('story_feed_id')) {
var $story = story.story_view.$el;
$header = $('.NB-feed-story-header-feed', $story);
var $new_header = $header.clone();
if (this.feed_title_floater) this.feed_title_floater.remove();
this.feed_title_floater = new NEWSBLUR.Views.StoryDetailView({
feed_floater: true,
model: story,
el: $new_header
});
$feed_floater.html($new_header);
this.cache.feed_title_floater_feed_id = story.get('story_feed_id');
var feed = NEWSBLUR.assets.get_feed(story.get('story_feed_id'));
$feed_floater.toggleClass('NB-inverse', feed && feed.is_light());
$feed_floater.width($header.outerWidth());
} else if (hide || !story || !story.get('story_feed_id')) {
if (this.feed_title_floater) this.feed_title_floater.remove();
this.cache.feed_title_floater_feed_id = null;
}
if (story && this.cache.feed_title_floater_story_id != story.id) {
$story = $story || story.story_view.$el;
$header = $header || $('.NB-feed-story-header-feed', $story);
$('.NB-floater').removeClass('NB-floater');
$header.addClass('NB-floater');
this.cache.feed_title_floater_story_id = story.id;
} else if (!story) {
this.cache.feed_title_floater_story_id = null;
}
},
show_stories_preference_in_feed_view: function(is_creating) {
if (NEWSBLUR.reader.active_story &&
NEWSBLUR.assets.preference('feed_view_single_story')) {
@ -743,9 +704,6 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
var closest = $.closest(from_top - offset, positions);
story = this.cache.feed_view_story_positions[positions[closest]];
}
var hide = offset && (from_top < offset);
this.show_correct_feed_in_feed_title_floater(story, hide);
}
}

4
media/js/newsblur/views/story_titles_view.js
View file

@ -188,7 +188,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
this.$('.NB-end-line').remove();
var $endline = $.make('div', { className: "NB-end-line NB-short" });
$endline.css({'background': '#FFF'});
$story_titles.append($endline);
this.$el.append($endline);
$endline.animate({'backgroundColor': '#E1EBFF'}, {'duration': 550, 'easing': 'easeInQuad'})
.animate({'backgroundColor': '#5C89C9'}, {'duration': 1550, 'easing': 'easeOutQuad'})
@ -323,7 +323,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
position = scroll+container;
}
if (story_layout == 'grid') {
position += 21;
// position -= 21;
}
// console.log(["scroll_to_selected_story 3", position]);

1
templates/reader/feeds_skeleton.xhtml
View file

@ -308,7 +308,6 @@
<div class="NB-story-pane-container">
<iframe id="feed_iframe" class="NB-feed-iframe"></iframe>
<div class="NB-feed-story-view NB-view-hidden">
<div class="NB-feed-story-view-floater"></div>
<div class="NB-feed-stories-container">
<div class="NB-feed-story-view-header NB-feedbar"></div>
<ul class="NB-feed-stories"></ul>