mirror of
https://github.com/viq/NewsBlur.git
synced 2025-09-18 21:43:31 +00:00
Refactoring image loading on story detail views to allow for an observer. Adding observer for saved story tags expanding story container when too short (but also recognizing when an image grows to switch the story from too small to big enough).
This commit is contained in:
parent
91943594f7
commit
dca95f3a89
3 changed files with 37 additions and 17 deletions
|
@ -101,6 +101,12 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
}
|
||||
},
|
||||
|
||||
resize_starred_tags: function() {
|
||||
if (this.model.get('starred')) {
|
||||
this.save_view.reset_height();
|
||||
}
|
||||
},
|
||||
|
||||
render_header: function(model, value, options) {
|
||||
var params = this.get_render_params();
|
||||
this.$('.NB-feed-story-header').replaceWith($(this.story_header_template(params)));
|
||||
|
@ -416,6 +422,10 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
},
|
||||
|
||||
watch_images_for_story_height: function() {
|
||||
this.model.on('change:images_loaded', _.bind(function() {
|
||||
this.resize_starred_tags();
|
||||
}, this));
|
||||
|
||||
if (!this.is_truncatable()) return;
|
||||
|
||||
this.truncate_delay = 100;
|
||||
|
|
|
@ -34,7 +34,6 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
|
|||
feed_view_story_positions_keys: []
|
||||
};
|
||||
this.flags = {
|
||||
feed_view_images_loaded: {},
|
||||
mousemove_timeout: false
|
||||
};
|
||||
this.counts = {
|
||||
|
@ -420,14 +419,17 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
|
|||
// =============
|
||||
|
||||
is_feed_loaded_for_location_fetch: function() {
|
||||
var images_begun = _.keys(this.flags.feed_view_images_loaded).length;
|
||||
var images_begun = NEWSBLUR.assets.stories.any(function(s) {
|
||||
return !_.isUndefined(s.get('images_loaded'));
|
||||
});
|
||||
if (images_begun) {
|
||||
var images_loaded = _.keys(this.flags.feed_view_images_loaded).length &&
|
||||
_.all(_.values(this.flags.feed_view_images_loaded), _.identity);
|
||||
return !!images_loaded;
|
||||
var images_loaded = NEWSBLUR.assets.stories.all(function(s) {
|
||||
return s.get('images_loaded');
|
||||
});
|
||||
return images_loaded;
|
||||
}
|
||||
|
||||
return !!images_begun;
|
||||
return images_begun;
|
||||
},
|
||||
|
||||
prefetch_story_locations_in_feed_view: function() {
|
||||
|
@ -435,7 +437,7 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
|
|||
var stories = NEWSBLUR.assets.stories;
|
||||
if (!_.contains(['split', 'full'], NEWSBLUR.assets.preference('story_layout'))) return;
|
||||
|
||||
// NEWSBLUR.log(['Prefetching Feed', this.flags['feed_view_positions_calculated'], this.flags.feed_view_images_loaded, (_.keys(this.flags.feed_view_images_loaded).length > 0 || this.cache.feed_view_story_positions_keys.length > 0), _.keys(this.flags.feed_view_images_loaded).length, _.values(this.flags.feed_view_images_loaded), this.is_feed_loaded_for_location_fetch()]);
|
||||
// NEWSBLUR.log(['Prefetching Feed', this.flags['feed_view_positions_calculated'], this.is_feed_loaded_for_location_fetch()]);
|
||||
|
||||
if (!NEWSBLUR.assets.stories.size()) return;
|
||||
|
||||
|
@ -466,7 +468,7 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
|
|||
if (this.is_feed_loaded_for_location_fetch()) {
|
||||
this.fetch_story_locations_in_feed_view({'reset_timer': true});
|
||||
} else {
|
||||
// NEWSBLUR.log(['Still loading feed view...', _.keys(this.flags.feed_view_images_loaded).length, this.cache.feed_view_story_positions_keys.length, this.flags.feed_view_images_loaded]);
|
||||
// NEWSBLUR.log(['Still loading feed view...', this.cache.feed_view_story_positions_keys.length]);
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -555,17 +557,17 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
|
|||
var image_count = story.story_view.$('.NB-feed-story-content img').length;
|
||||
if (!image_count) {
|
||||
// NEWSBLUR.log(["No images", story.get('story_title')]);
|
||||
this.flags.feed_view_images_loaded[story.id] = true;
|
||||
} else if (!this.flags.feed_view_images_loaded[story.id]) {
|
||||
story.set('images_loaded', true);
|
||||
} else if (!story.get('images_loaded')) {
|
||||
// Progressively load the images in each story, so that when one story
|
||||
// loads, the position is calculated and the next story can calculate
|
||||
// its position (after its own images are loaded).
|
||||
this.flags.feed_view_images_loaded[story.id] = false;
|
||||
story.set('images_loaded', false);
|
||||
(function(story, image_count) {
|
||||
story.story_view.$('.NB-feed-story-content img').load(function() {
|
||||
// NEWSBLUR.log(['Loaded image', story.get('story_title'), image_count]);
|
||||
if (image_count <= 1) {
|
||||
NEWSBLUR.app.story_list.flags.feed_view_images_loaded[story.id] = true;
|
||||
story.set('images_loaded', true);
|
||||
} else {
|
||||
image_count--;
|
||||
}
|
||||
|
|
|
@ -62,7 +62,6 @@ NEWSBLUR.Views.StorySaveView = Backbone.View.extend({
|
|||
var feed_id = this.model.get('story_feed_id');
|
||||
var $sideoption = this.$('.NB-sideoption.NB-feed-story-save');
|
||||
var $save_wrapper = this.$('.NB-sideoption-save-wrapper');
|
||||
var $story_content = this.$('.NB-feed-story-content,.NB-story-content');
|
||||
var $tag_input = this.$('.NB-sideoption-save-tag');
|
||||
|
||||
if (options.close || !this.model.get('starred')) {
|
||||
|
@ -178,11 +177,10 @@ NEWSBLUR.Views.StorySaveView = Backbone.View.extend({
|
|||
var comments_height = $story_comments.height();
|
||||
var left_height = content_height + comments_height;
|
||||
var original_height = $story_content.data('original_height') || content_height;
|
||||
|
||||
if (!NEWSBLUR.reader.flags.narrow_content &&
|
||||
!options.close && new_sideoptions_height >= original_height) {
|
||||
!options.close && !options.force && new_sideoptions_height >= original_height) {
|
||||
// Sideoptions too big, embiggen left side
|
||||
$story_content.animate({
|
||||
$story_content.stop(true, true).animate({
|
||||
'height': new_sideoptions_height
|
||||
}, {
|
||||
'duration': 350,
|
||||
|
@ -200,7 +198,7 @@ NEWSBLUR.Views.StorySaveView = Backbone.View.extend({
|
|||
} else if (!NEWSBLUR.reader.flags.narrow_content) {
|
||||
// Content is bigger, move content back to normal
|
||||
if ($story_content.data('original_height') && !this.sideoptions_view.share_view.is_open) {
|
||||
$story_content.animate({
|
||||
$story_content.stop(true, true).animate({
|
||||
'height': $story_content.data('original_height')
|
||||
}, {
|
||||
'duration': 300,
|
||||
|
@ -222,6 +220,16 @@ NEWSBLUR.Views.StorySaveView = Backbone.View.extend({
|
|||
}
|
||||
},
|
||||
|
||||
reset_height: function() {
|
||||
var $story_content = this.$('.NB-feed-story-content,.NB-story-content');
|
||||
|
||||
// Reset story content height to get an accurate height measurement.
|
||||
$story_content.stop(true, true).css('height', 'auto');
|
||||
$story_content.removeData('original_height');
|
||||
|
||||
this.resize();
|
||||
},
|
||||
|
||||
save_tags: function() {
|
||||
var $tag_input = this.$('.NB-sideoption-save-tag');
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue