mirror of
https://github.com/samuelclay/NewsBlur.git
synced 2025-09-18 21:50:56 +00:00
Lots of styling changes around story titles, hidden stories, and moving the hidden indicator andfilter popover.
This commit is contained in:
Samuel Clay
parent
5cd9c4d917
commit
9fd75d855a
10 changed files with 225 additions and 217 deletions
|
|
@ -1089,7 +1089,15 @@ background: transparent;
|
|||
color: #40413E;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
|
||||
}
|
||||
#story_titles .NB-feedbar .NB-feedbar-options-container {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
width: 206px;
|
||||
top: 2px;
|
||||
}
|
||||
#story_titles .NB-feedbar .NB-feedbar-options {
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
color: rgba(0, 0, 0, .5);
|
||||
border: 1px solid rgba(0, 0, 0, .1);
|
||||
border-radius: 16px;
|
||||
|
|
@ -1097,11 +1105,9 @@ background: transparent;
|
|||
font-size: 10px;
|
||||
padding: 0 4px 0 8px;
|
||||
line-height: 14px;
|
||||
margin: 0 0 -2px 6px;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
margin: 2px 0 0;
|
||||
}
|
||||
#story_titles .NB-feedbar .NB-feedbar-options:hover,
|
||||
#story_titles .NB-feedbar .NB-feedbar-options.NB-active {
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
|
@ -1157,66 +1163,11 @@ background: transparent;
|
|||
-o-transition: all .12s ease-out;
|
||||
-ms-transition: all .12s ease-out;
|
||||
}
|
||||
#story_titles .NB-feedbar .NB-searching .NB-feedbar-mark-feed-read {
|
||||
display: none;
|
||||
}
|
||||
.NB-story-pane-west #story_titles .NB-feedbar .NB-feedbar-mark-feed-read {
|
||||
position: static;
|
||||
float: left;
|
||||
margin-left: 26px;
|
||||
}
|
||||
#story_titles .NB-feedbar .NB-feedbar-last-updated {
|
||||
color: #808080;
|
||||
text-shadow: 0 1px 0 #e6e6e6;
|
||||
position: absolute;
|
||||
right: 54px;
|
||||
top: 2px;
|
||||
font-size: 9px;
|
||||
line-height: 15px;
|
||||
font-weight: bold;
|
||||
margin: 3px 0 2px;
|
||||
width: 150px;
|
||||
text-transform: uppercase;
|
||||
opacity: 1;
|
||||
-webkit-transition: opacity .62s ease-in-out;
|
||||
-moz-transition: opacity .62s ease-in-out;
|
||||
-o-transition: opacity .62s ease-in-out;
|
||||
-ms-transition: opacity .62s ease-in-out;
|
||||
}
|
||||
#story_titles .NB-feedbar .NB-searching .NB-feedbar-last-updated {
|
||||
display: none;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity .62s ease-in-out;
|
||||
-moz-transition: opacity .62s ease-in-out;
|
||||
-o-transition: opacity .62s ease-in-out;
|
||||
-ms-transition: opacity .62s ease-in-out;
|
||||
}
|
||||
.NB-view-river #story_titles .NB-feedbar .NB-feedbar-last-updated {
|
||||
display: none;
|
||||
}
|
||||
.NB-story-pane-west #story_titles .NB-feedbar .NB-feedbar-last-updated {
|
||||
position: static;
|
||||
float: left;
|
||||
margin-left: 26px;
|
||||
}
|
||||
|
||||
#story_titles .NB-feedbar:hover .NB-feedbar-manage-feed,
|
||||
#story_titles .NB-feedbar:hover .NB-feedbar-statistics {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
/*.NB-view-river #story_titles .NB-feedbar .NB-feedbar-mark-feed-read,*/
|
||||
#story_titles .NB-feedbar:hover :not(.NB-searching) .NB-feedbar-mark-feed-read {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#story_titles .NB-feedbar:hover .NB-feedbar-last-updated {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#story_titles .NB-feedbar .NB-feedbar-mark-feed-read:hover {
|
||||
background-color: #00609f;
|
||||
}
|
||||
|
||||
#story_titles .NB-feedbar .NB-feedlist-manage-icon {
|
||||
opacity: 0;
|
||||
|
|
@ -1349,26 +1300,22 @@ background: transparent;
|
|||
/* = Story Titles Hidden Count = */
|
||||
/* ============================= */
|
||||
|
||||
#story_titles .NB-story-title-indicator {
|
||||
background-color: #909090;
|
||||
color: #F0F0F0;
|
||||
#story_titles .NB-feedbar .NB-story-title-indicator {
|
||||
position: absolute;
|
||||
right: 206px;
|
||||
top: 2px;
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
opacity: 0;
|
||||
display: none;
|
||||
margin: 3px 4px 2px 6px;
|
||||
font-size: 9px;
|
||||
line-height: 15px;
|
||||
font-weight: bold;
|
||||
padding: 0 4px;
|
||||
color: rgba(0, 0, 0, .5);
|
||||
border: 1px solid rgba(0, 0, 0, .1);
|
||||
border-radius: 16px;
|
||||
text-transform: uppercase;
|
||||
overflow: hidden;
|
||||
border-radius: 3px;
|
||||
text-shadow: none;
|
||||
font-size: 10px;
|
||||
padding: 0 8px;
|
||||
line-height: 14px;
|
||||
margin: 2px 12px 0;
|
||||
}
|
||||
|
||||
#story_titles .NB-story-title-indicator:hover {
|
||||
background-color: #00609f;
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
}
|
||||
#story_titles .NB-story-title-indicator .NB-story-title-indicator-count {
|
||||
float: left;
|
||||
|
|
@ -1402,24 +1349,15 @@ background: transparent;
|
|||
opacity: 1;
|
||||
}
|
||||
|
||||
#story_titles .NB-story-title-indicator .NB-story-title-indicator-text {
|
||||
color: #F0F0F0;
|
||||
float: left;
|
||||
text-align: right;
|
||||
display: block;
|
||||
padding: 0 0 0 2px;
|
||||
}
|
||||
|
||||
#story_titles .NB-story-title-indicator:hover .NB-story-title-indicator-text {
|
||||
/* color: #D0F0D0;*/
|
||||
}
|
||||
#story_titles .NB-story-title-indicator .feed_counts_floater .unread_count {
|
||||
padding: 2px 3px 1px;
|
||||
padding: 1px 3px 1px;
|
||||
margin: 0 2px 0 0;
|
||||
line-height: 7px;
|
||||
line-height: 8px;
|
||||
}
|
||||
|
||||
#story_titles .NB-story-hidden-visible {
|
||||
.NB-intelligence-positive #story_titles .NB-story-title.NB-story-neutral.NB-story-hidden-visible,
|
||||
.NB-intelligence-positive #story_titles .NB-story-title.NB-story-negative.NB-story-hidden-visible,
|
||||
.NB-intelligence-neutral #story_titles .NB-story-title.NB-story-negative.NB-story-hidden-visible {
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
|
|
@ -1448,7 +1386,7 @@ background: transparent;
|
|||
border-top: 1px solid #E7EDF6;
|
||||
text-decoration: none;
|
||||
color: #272727;
|
||||
line-height: 1em;
|
||||
line-height: 14px;
|
||||
background-color: white;
|
||||
border-bottom: 1px solid #FFF;
|
||||
}
|
||||
|
|
@ -1466,7 +1404,7 @@ background: transparent;
|
|||
width: 24px;
|
||||
height: 20px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
#story_titles .NB-story-title.NB-story-positive .NB-storytitles-sentiment {
|
||||
|
|
@ -1526,7 +1464,7 @@ background: transparent;
|
|||
text-decoration: none;
|
||||
color: #272727;
|
||||
display: block;
|
||||
padding: 4px 0px;
|
||||
padding: 5px 0px 4px;
|
||||
float: left;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
|
@ -1568,27 +1506,14 @@ background: transparent;
|
|||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 2px;
|
||||
margin: 2px 2px 0 0;
|
||||
margin: 3px 2px 0 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
#story_titles .NB-story-title .story_title .NB-storytitles-tags {
|
||||
padding-left: 12px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#story_titles .NB-story-title .story_title .NB-storytitles-tag {
|
||||
font-size: 9px;
|
||||
padding: 0px 4px;
|
||||
margin: 0 2px;
|
||||
color: #9D9A95;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
|
||||
background-color: #E9E9E9;
|
||||
border-radius: 4px;
|
||||
}
|
||||
#story_titles .NB-story-title .NB-story-feed {
|
||||
display: none;
|
||||
left: -120px;
|
||||
top: 6px;
|
||||
width: 118px;
|
||||
height: 12px;
|
||||
color: #707070;
|
||||
|
|
@ -1632,7 +1557,7 @@ background: transparent;
|
|||
display: none;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
top: 2px;
|
||||
width: 28px;
|
||||
height: 22px;
|
||||
background: transparent url('/media/embed/icons/silk/bullet_arrow_right.png') no-repeat 7px 2px;
|
||||
|
|
@ -1678,7 +1603,7 @@ background: transparent;
|
|||
position: absolute;
|
||||
right: 4px;
|
||||
width: 200px;
|
||||
top: 4px;
|
||||
top: 5px;
|
||||
}
|
||||
.NB-story-pane-west #story_titles .NB-story-title .story_date {
|
||||
position: static;
|
||||
|
|
@ -1919,7 +1844,7 @@ background: transparent;
|
|||
.NB-feed-story .NB-feed-story-header-info {
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
padding: 0 250px 0 28px;
|
||||
padding: 0 206px 0 28px;
|
||||
background: #dadada url('/media/css/jquery-ui/images/dadada_40x100_textures_03_highlight_soft_75.png') 0 50% repeat-x;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
|
|
@ -1937,6 +1862,9 @@ background: transparent;
|
|||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.NB-feed-story-view-narrow .NB-feed-story .NB-feed-story-header-info {
|
||||
padding-right: 28px;
|
||||
}
|
||||
|
||||
.NB-feed-story.read .NB-feed-story-header-info {
|
||||
background-image: -webkit-gradient(
|
||||
|
|
@ -1953,6 +1881,25 @@ background: transparent;
|
|||
);
|
||||
}
|
||||
|
||||
.NB-feed-story-header-info .NB-feed-story-header-collapse {
|
||||
display: none;
|
||||
}
|
||||
.NB-story-titles .NB-feed-story-header-info .NB-feed-story-header-collapse {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 16px;
|
||||
top: 6px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background: transparent url('/media/embed/reader/toggle_minus.png') no-repeat 0 0;
|
||||
background-size: 16px;
|
||||
cursor: pointer;
|
||||
opacity: .6;
|
||||
}
|
||||
.NB-story-titles .NB-feed-story-header-info .NB-feed-story-header-collapse:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.NB-feed-story .NB-feed-story-header-feed {
|
||||
background: #404040 url('/media/embed/reader/feed_view_feed_background.png') repeat-x 0 0;
|
||||
background-image: -webkit-gradient(
|
||||
|
|
@ -2318,7 +2265,6 @@ background: transparent;
|
|||
.NB-feed-story .NB-feed-story-content {
|
||||
padding: 12px 0 0;
|
||||
max-width: 700px;
|
||||
min-height: 66px;
|
||||
}
|
||||
.NB-feed-story .NB-feed-story-view-narrow .NB-feed-story-content {
|
||||
margin-right: 28px;
|
||||
|
|
@ -2351,6 +2297,8 @@ background: transparent;
|
|||
|
||||
.NB-story-content-container {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
min-height: 144px;
|
||||
}
|
||||
.NB-story-content-wrapper {
|
||||
position: relative;
|
||||
|
|
@ -2360,6 +2308,9 @@ background: transparent;
|
|||
.NB-feed-story .NB-story-content-wrapper {
|
||||
margin: 0 236px 28px 28px;
|
||||
}
|
||||
.NB-feed-story-view-narrow .NB-feed-story .NB-story-content-wrapper {
|
||||
margin-right: 28px;
|
||||
}
|
||||
.NB-story-content-wrapper.NB-story-content-wrapper-height-truncated {
|
||||
max-height: 460px;
|
||||
}
|
||||
|
|
@ -2895,7 +2846,8 @@ background: transparent;
|
|||
.NB-feed-story-sideoptions-container {
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
bottom: 32px;
|
||||
bottom: 0;
|
||||
margin-bottom: 32px;
|
||||
text-align: center;
|
||||
width: 194px;
|
||||
}
|
||||
|
|
@ -9520,7 +9472,9 @@ form.opml_import_form input {
|
|||
.popover.right {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.popover.bottom {
|
||||
.popover.bottom,
|
||||
.popover.bottom-right,
|
||||
.popover.bottom-left {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.popover.left {
|
||||
|
|
@ -9593,7 +9547,9 @@ form.opml_import_form input {
|
|||
border-left-width: 0;
|
||||
border-right-color: #ffffff;
|
||||
}
|
||||
.popover.bottom .arrow {
|
||||
.popover.bottom .arrow,
|
||||
.popover.bottom-left .arrow,
|
||||
.popover.bottom-right .arrow {
|
||||
left: 50%;
|
||||
margin-left: -11px;
|
||||
border-top-width: 0;
|
||||
|
|
@ -9601,12 +9557,20 @@ form.opml_import_form input {
|
|||
border-bottom-color: rgba(0, 0, 0, 0.25);
|
||||
top: -11px;
|
||||
}
|
||||
.popover.bottom .arrow:after {
|
||||
.popover.bottom .arrow:after,
|
||||
.popover.bottom-left .arrow:after,
|
||||
.popover.bottom-right .arrow:after {
|
||||
top: 1px;
|
||||
margin-left: -10px;
|
||||
border-top-width: 0;
|
||||
border-bottom-color: #ffffff;
|
||||
}
|
||||
.popover.bottom-left .arrow {
|
||||
left: 14px;
|
||||
}
|
||||
.popover.bottom-right .arrow {
|
||||
left: 90%;
|
||||
}
|
||||
.popover.left .arrow {
|
||||
top: 50%;
|
||||
right: -11px;
|
||||
|
|
|
|||
|
|
@ -129,6 +129,7 @@
|
|||
this.setup_feedback_table();
|
||||
this.setup_howitworks_hovers();
|
||||
this.setup_unfetched_feed_check();
|
||||
this.switch_story_layout();
|
||||
},
|
||||
|
||||
// ========
|
||||
|
|
@ -183,7 +184,10 @@
|
|||
NEWSBLUR.app.story_list.reset_story_positions();
|
||||
}, 2000);
|
||||
this.flags.fetch_story_locations_in_feed_view();
|
||||
|
||||
this.adjust_for_narrow_window();
|
||||
},
|
||||
|
||||
adjust_for_narrow_window: function() {
|
||||
var north, center;
|
||||
if (this.story_layout == 'split') {
|
||||
north = NEWSBLUR.reader.layout.contentLayout.panes.north;
|
||||
|
|
@ -191,12 +195,15 @@
|
|||
} else if (this.story_layout == 'list') {
|
||||
center = NEWSBLUR.reader.layout.rightLayout.panes.center;
|
||||
}
|
||||
|
||||
if ((north && north.width() < 600) ||
|
||||
(center && center.width() < 700)) {
|
||||
this.$s.$feed_view.addClass('NB-feed-story-view-narrow');
|
||||
this.$s.$story_titles.addClass('NB-feed-story-view-narrow');
|
||||
this.$s.$text_view.addClass('NB-feed-story-view-narrow');
|
||||
} else {
|
||||
this.$s.$feed_view.removeClass('NB-feed-story-view-narrow');
|
||||
this.$s.$story_titles.removeClass('NB-feed-story-view-narrow');
|
||||
this.$s.$text_view.removeClass('NB-feed-story-view-narrow');
|
||||
}
|
||||
},
|
||||
|
|
@ -436,6 +443,7 @@
|
|||
|
||||
if (resize) {
|
||||
this.$s.$layout.layout().resizeAll();
|
||||
this.adjust_for_narrow_window();
|
||||
}
|
||||
if (NEWSBLUR.Globals.is_anonymous) {
|
||||
this.setup_ftux_signup_callout();
|
||||
|
|
@ -1286,7 +1294,8 @@
|
|||
// ================
|
||||
|
||||
switch_story_layout: function(layout) {
|
||||
if (layout == this.story_layout) return;
|
||||
layout = layout || this.story_layout;
|
||||
|
||||
var $split = $(".NB-task-layout-split");
|
||||
var $list = $(".NB-task-layout-list");
|
||||
|
||||
|
|
@ -1298,6 +1307,8 @@
|
|||
$list.removeClass('NB-active');
|
||||
}
|
||||
|
||||
if (layout == this.story_layout) return;
|
||||
|
||||
this.story_layout = layout;
|
||||
|
||||
this.apply_resizable_layout(true);
|
||||
|
|
@ -3589,6 +3600,11 @@
|
|||
var $next_story_button = $('.NB-task-story-next-unread');
|
||||
var $story_title_indicator = $('.NB-story-title-indicator', this.$story_titles);
|
||||
|
||||
this.$s.$body.removeClass('NB-intelligence-positive')
|
||||
.removeClass('NB-intelligence-neutral')
|
||||
.removeClass('NB-intelligence-negative')
|
||||
.addClass('NB-intelligence-'+unread_view_name);
|
||||
|
||||
$sidebar.removeClass('unread_view_positive')
|
||||
.removeClass('unread_view_neutral')
|
||||
.removeClass('unread_view_negative')
|
||||
|
|
@ -3687,30 +3703,30 @@
|
|||
}
|
||||
|
||||
if (unread_view_name == 'positive') {
|
||||
$stories_show = $('.story,.NB-feed-story').filter('.NB-story-positive');
|
||||
$stories_hide = $('.story,.NB-feed-story')
|
||||
$stories_show = $('.NB-story-title,.NB-feed-story').filter('.NB-story-positive');
|
||||
$stories_hide = $('.NB-story-title,.NB-feed-story')
|
||||
.filter('.NB-story-neutral,.NB-story-negative');
|
||||
} else if (unread_view_name == 'neutral') {
|
||||
$stories_show = $('.story,.NB-feed-story')
|
||||
$stories_show = $('.NB-story-title,.NB-feed-story')
|
||||
.filter('.NB-story-positive,.NB-story-neutral');
|
||||
$stories_hide = $('.story,.NB-feed-story').filter('.NB-story-negative');
|
||||
$stories_hide = $('.NB-story-title,.NB-feed-story').filter('.NB-story-negative');
|
||||
if (options['temporary']) {
|
||||
$stories_show.filter('.NB-story-neutral').addClass('NB-story-hidden-visible');
|
||||
$stories_show.filter('.NB-story-neutral');
|
||||
} else {
|
||||
$stories_show.filter('.NB-story-hidden-visible').removeClass('NB-story-hidden-visible');
|
||||
$stories_show.filter('.NB-story-hidden-visible');
|
||||
}
|
||||
} else if (unread_view_name == 'negative') {
|
||||
$stories_show = $('.story,.NB-feed-story')
|
||||
$stories_show = $('.NB-story-title,.NB-feed-story')
|
||||
.filter('.NB-story-positive,.NB-story-neutral,.NB-story-negative');
|
||||
$stories_hide = $();
|
||||
if (options['temporary']) {
|
||||
$stories_show.filter('.NB-story-negative,.NB-story-neutral:not(:visible)')
|
||||
.addClass('NB-story-hidden-visible');
|
||||
$stories_show.filter('.NB-story-negative,.NB-story-neutral:not(:visible)');
|
||||
} else {
|
||||
$stories_show.filter('.NB-story-hidden-visible').removeClass('NB-story-hidden-visible');
|
||||
$stories_show.filter('.NB-story-hidden-visible');
|
||||
}
|
||||
}
|
||||
|
||||
// console.log(["show_story_titles_above_intelligence_level", $stories_show]);
|
||||
if ((this.story_view == 'feed' || this.flags['page_view_showing_feed_view']) &&
|
||||
NEWSBLUR.assets.preference('feed_view_single_story')) {
|
||||
// No need to show/hide feed view stories under single_story preference.
|
||||
|
|
@ -3726,8 +3742,12 @@
|
|||
}
|
||||
|
||||
if (!options['animate']) {
|
||||
$stories_hide.css({'display': 'none'});
|
||||
$stories_show.css({'display': 'block'});
|
||||
$stories_show.addClass('NB-story-hidden-visible')
|
||||
.removeClass('NB-hidden');
|
||||
$stories_hide.removeClass('NB-story-hidden-visible')
|
||||
.addClass('NB-hidden');
|
||||
// $stories_hide.css({'display': 'none'});
|
||||
// $stories_show.css({'display': 'block'});
|
||||
NEWSBLUR.app.story_titles.fill_out();
|
||||
}
|
||||
|
||||
|
|
@ -3746,8 +3766,12 @@
|
|||
});
|
||||
$stories_show.slideDown(500);
|
||||
} else {
|
||||
$stories_hide.css({'display': 'none'});
|
||||
$stories_show.css({'display': 'block'});
|
||||
$stories_show.addClass('NB-story-hidden-visible')
|
||||
.removeClass('NB-hidden');
|
||||
$stories_hide.removeClass('NB-story-hidden-visible')
|
||||
.addClass('NB-hidden');
|
||||
// $stories_hide.css({'display': 'none'});
|
||||
// $stories_show.css({'display': 'block'});
|
||||
NEWSBLUR.app.story_titles.fill_out();
|
||||
}
|
||||
setTimeout(function() {
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ NEWSBLUR.ReaderPopover = Backbone.View.extend({
|
|||
render: function($content) {
|
||||
var self = this;
|
||||
this._open = true;
|
||||
console.log(["popover render", this.$el, this.options.animate]);
|
||||
|
||||
this.$popover = $.make("div", { className: "NB-popover popover fade" }, [
|
||||
$.make('div', { className: "arrow" }),
|
||||
$.make('div', { className: "popover-inner" }, [
|
||||
|
|
|
|||
|
|
@ -5,10 +5,10 @@ NEWSBLUR.FeedOptionsPopover = NEWSBLUR.ReaderPopover.extend({
|
|||
options: {
|
||||
'width': 236,
|
||||
'anchor': '.NB-feedbar-options',
|
||||
'placement': 'top',
|
||||
'placement': 'bottom right',
|
||||
offset: {
|
||||
top: 6,
|
||||
left: 1
|
||||
top: -3,
|
||||
left: -100
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -17,11 +17,19 @@ NEWSBLUR.FeedOptionsPopover = NEWSBLUR.ReaderPopover.extend({
|
|||
},
|
||||
|
||||
initialize: function(options) {
|
||||
if (NEWSBLUR.reader.story_layout == 'split' &&
|
||||
NEWSBLUR.assets.preference('story_pane_anchor') == 'south') {
|
||||
this.options.placement = 'top right';
|
||||
this.options.offset = {
|
||||
top: 10,
|
||||
left: -100
|
||||
};
|
||||
}
|
||||
|
||||
this.options = _.extend({}, this.options, options);
|
||||
NEWSBLUR.ReaderPopover.prototype.initialize.call(this);
|
||||
NEWSBLUR.ReaderPopover.prototype.initialize.call(this, this.options);
|
||||
this.model = NEWSBLUR.assets;
|
||||
this.render();
|
||||
|
||||
this.show_correct_feed_view_options_in_menu();
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -66,34 +66,24 @@ NEWSBLUR.Views.FeedTitleView = Backbone.View.extend({
|
|||
</div>\
|
||||
<img class="feed_favicon" src="<%= $.favicon(feed) %>">\
|
||||
<span class="feed_title">\
|
||||
<% if (type == "story") { %>\
|
||||
<div class="NB-story-title-indicator">\
|
||||
<div class="NB-story-title-indicator-count"></div>\
|
||||
<span class="NB-story-title-indicator-text">show hidden stories</span>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
<%= feed.get("feed_title") %>\
|
||||
<% if (type == "story") { %>\
|
||||
<span class="NB-feedbar-options">\
|
||||
<div class="NB-icon"></div>\
|
||||
<%= NEWSBLUR.assets.view_setting(feed.id, "read_filter") %>\
|
||||
·\
|
||||
<%= NEWSBLUR.assets.view_setting(feed.id, "order") %>\
|
||||
</span>\
|
||||
<div class="NB-feedbar-mark-feed-read">Mark All as Read</div>\
|
||||
<% } %>\
|
||||
</span>\
|
||||
<% if (type == "story") { %>\
|
||||
<div class="NB-feedbar-last-updated">\
|
||||
<span class="NB-feedbar-last-updated-label">Updated:</span>\
|
||||
<span class="NB-feedbar-last-updated-date">\
|
||||
<% if (feed.get("updated")) { %>\
|
||||
<%= feed.get("updated") %> ago\
|
||||
<% } else { %>\
|
||||
Loading...\
|
||||
<% } %>\
|
||||
</span>\
|
||||
</div>\
|
||||
<div class="NB-feedbar-mark-feed-read">Mark All as Read</div>\
|
||||
<div class="NB-story-title-indicator">\
|
||||
<div class="NB-story-title-indicator-count"></div>\
|
||||
<span class="NB-story-title-indicator-text">show hidden stories</span>\
|
||||
</div>\
|
||||
<div class="NB-feedbar-options-container">\
|
||||
<span class="NB-feedbar-options">\
|
||||
<div class="NB-icon"></div>\
|
||||
<%= NEWSBLUR.assets.view_setting(feed.id, "read_filter") %>\
|
||||
·\
|
||||
<%= NEWSBLUR.assets.view_setting(feed.id, "order") %>\
|
||||
</span>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
<div class="NB-feed-exception-icon"></div>\
|
||||
<div class="NB-feed-unfetched-icon"></div>\
|
||||
|
|
|
|||
|
|
@ -110,12 +110,14 @@ NEWSBLUR.Views.Folder = Backbone.View.extend({
|
|||
<div class="NB-story-title-indicator-count"></div>\
|
||||
<span class="NB-story-title-indicator-text">show hidden stories</span>\
|
||||
</div>\
|
||||
<span class="NB-feedbar-options">\
|
||||
<div class="NB-icon"></div>\
|
||||
<%= NEWSBLUR.assets.view_setting("river:"+folder_title, "read_filter") %>\
|
||||
·\
|
||||
<%= NEWSBLUR.assets.view_setting("river:"+folder_title, "order") %>\
|
||||
</span>\
|
||||
<div class="NB-feedbar-options-container">\
|
||||
<span class="NB-feedbar-options">\
|
||||
<div class="NB-icon"></div>\
|
||||
<%= NEWSBLUR.assets.view_setting("river:"+folder_title, "read_filter") %>\
|
||||
·\
|
||||
<%= NEWSBLUR.assets.view_setting("river:"+folder_title, "order") %>\
|
||||
</span>\
|
||||
</div>\
|
||||
<div class="NB-feedbar-mark-feed-read">Mark All as Read</div>\
|
||||
<% } %>\
|
||||
</div>\
|
||||
|
|
|
|||
|
|
@ -24,7 +24,8 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
"click .NB-feed-story-train" : "open_story_trainer",
|
||||
"click .NB-feed-story-save" : "star_story",
|
||||
"click .NB-story-comments-label" : "scroll_to_comments",
|
||||
"click .NB-story-content-expander" : "expand_story"
|
||||
"click .NB-story-content-expander" : "expand_story",
|
||||
"click .NB-feed-story-header-collapse" : "collapse_story"
|
||||
},
|
||||
|
||||
initialize: function() {
|
||||
|
|
@ -66,6 +67,7 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
if (this.feed) {
|
||||
this.$el.toggleClass('NB-inverse', this.feed.is_light());
|
||||
}
|
||||
this.setup_classes();
|
||||
this.toggle_classes();
|
||||
this.toggle_read_status();
|
||||
this.toggle_score();
|
||||
|
|
@ -148,6 +150,7 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
<% }) %>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
<div class="NB-feed-story-header-collapse"></div>\
|
||||
</div>\
|
||||
</div>\
|
||||
'),
|
||||
|
|
@ -170,22 +173,22 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
<div class="NB-feed-story-comments-container"></div>\
|
||||
<div class="NB-feed-story-sideoptions-container">\
|
||||
<div class="NB-sideoption NB-feed-story-train">\
|
||||
<div class="NB-sideoption-icon"> </div>\
|
||||
<div class="NB-sideoption-title">Train this story</div>\
|
||||
<div class="NB-feed-story-comments-container"></div>\
|
||||
<div class="NB-feed-story-sideoptions-container">\
|
||||
<div class="NB-sideoption NB-feed-story-train">\
|
||||
<div class="NB-sideoption-icon"> </div>\
|
||||
<div class="NB-sideoption-title">Train this story</div>\
|
||||
</div>\
|
||||
<div class="NB-sideoption NB-feed-story-save">\
|
||||
<div class="NB-sideoption-icon"> </div>\
|
||||
<div class="NB-sideoption-title"><%= story.get("starred") ? "Saved" : "Save this story" %></div>\
|
||||
</div>\
|
||||
<div class="NB-sideoption NB-feed-story-share">\
|
||||
<div class="NB-sideoption-icon"> </div>\
|
||||
<div class="NB-sideoption-title"><%= story.get("shared") ? "Shared" : "Share this story" %></div>\
|
||||
</div>\
|
||||
<%= story_share_view %>\
|
||||
</div>\
|
||||
<div class="NB-sideoption NB-feed-story-save">\
|
||||
<div class="NB-sideoption-icon"> </div>\
|
||||
<div class="NB-sideoption-title"><%= story.get("starred") ? "Saved" : "Save this story" %></div>\
|
||||
</div>\
|
||||
<div class="NB-sideoption NB-feed-story-share">\
|
||||
<div class="NB-sideoption-icon"> </div>\
|
||||
<div class="NB-sideoption-title"><%= story.get("shared") ? "Shared" : "Share this story" %></div>\
|
||||
</div>\
|
||||
<%= story_share_view %>\
|
||||
</div>\
|
||||
'),
|
||||
|
||||
|
|
@ -262,6 +265,10 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
// NEWSBLUR.log(["Story changed", this.model.changedAttributes(), this.model.previousAttributes()]);
|
||||
}
|
||||
|
||||
this.setup_classes();
|
||||
},
|
||||
|
||||
setup_classes: function() {
|
||||
var story = this.model;
|
||||
var unread_view = NEWSBLUR.reader.get_unread_view_score();
|
||||
var score = story.score();
|
||||
|
|
@ -402,6 +409,11 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
|
||||
},
|
||||
|
||||
collapse_story: function() {
|
||||
this.model.set('selected', false);
|
||||
NEWSBLUR.app.story_titles.fill_out();
|
||||
},
|
||||
|
||||
// ===========
|
||||
// = Actions =
|
||||
// ===========
|
||||
|
|
|
|||
|
|
@ -52,8 +52,10 @@ NEWSBLUR.Views.StoryShareView = Backbone.View.extend({
|
|||
options = options || {};
|
||||
var feed_id = this.model.get('story_feed_id');
|
||||
var $sideoption = this.$('.NB-sideoption.NB-feed-story-share');
|
||||
var $sideoption_container = this.$('.NB-feed-story-sideoptions-container');
|
||||
var $share = this.$('.NB-sideoption-share-wrapper');
|
||||
var $story_content = this.$('.NB-feed-story-content,.NB-story-content');
|
||||
var $story_wrapper = this.$('.NB-story-content-container');
|
||||
var $comment_input = this.$('.NB-sideoption-share-comments');
|
||||
var $story_comments = this.$('.NB-feed-story-comments');
|
||||
var $unshare_button = this.$('.NB-sideoption-share-unshare');
|
||||
|
|
@ -121,20 +123,16 @@ NEWSBLUR.Views.StoryShareView = Backbone.View.extend({
|
|||
}
|
||||
});
|
||||
|
||||
var sideoptions_height = this.$('.NB-feed-story-sideoptions-container').innerHeight() + 12;
|
||||
var content_height = $story_content.height() + $story_comments.height();
|
||||
|
||||
if (sideoptions_height + dialog_height > content_height) {
|
||||
// this.$s.$feed_stories.scrollTo(this.$s.$feed_stories.scrollTop() + sideoptions_height, {
|
||||
// 'duration': 350,
|
||||
// 'queue': false,
|
||||
// 'easing': 'easeInOutQuint'
|
||||
// });
|
||||
var original_height = $story_content.height();
|
||||
var original_outerHeight = $story_content.outerHeight(true);
|
||||
|
||||
var sideoptions_height = $sideoption_container.outerHeight(true);
|
||||
var wrapper_height = $story_wrapper.height();
|
||||
var content_height = $story_content.height();
|
||||
var content_outerheight = $story_content.outerHeight(true);
|
||||
var comments_height = $story_comments.outerHeight(true);
|
||||
|
||||
if (content_outerheight + comments_height < sideoptions_height) {
|
||||
$story_content.css('height', $sideoption_container.height());
|
||||
$story_content.animate({
|
||||
'height': original_height + ((dialog_height + sideoptions_height) - content_height)
|
||||
'height': sideoptions_height + dialog_height - comments_height
|
||||
}, {
|
||||
'duration': 350,
|
||||
'easing': 'easeInOutQuint',
|
||||
|
|
@ -144,7 +142,20 @@ NEWSBLUR.Views.StoryShareView = Backbone.View.extend({
|
|||
NEWSBLUR.app.story_list.fetch_story_locations_in_feed_view();
|
||||
}
|
||||
}
|
||||
}).data('original_height', original_height);
|
||||
}).data('original_height', content_height);
|
||||
} else if (sideoptions_height + dialog_height > wrapper_height) {
|
||||
$story_content.animate({
|
||||
'height': content_height + dialog_height - ($sideoption_container.position().top - 32)
|
||||
}, {
|
||||
'duration': 350,
|
||||
'easing': 'easeInOutQuint',
|
||||
'queue': false,
|
||||
'complete': function() {
|
||||
if (NEWSBLUR.app.story_list) {
|
||||
NEWSBLUR.app.story_list.fetch_story_locations_in_feed_view();
|
||||
}
|
||||
}
|
||||
}).data('original_height', content_height);
|
||||
}
|
||||
var share = _.bind(function(e) {
|
||||
e.preventDefault();
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
||||
|
||||
className: 'story NB-story-title-container',
|
||||
className: 'NB-story-title-container',
|
||||
|
||||
events: {
|
||||
"dblclick" : "open_story_in_story_view",
|
||||
"click" : "select_story",
|
||||
"contextmenu" : "show_manage_menu",
|
||||
"dblclick .NB-story-title" : "open_story_in_story_view",
|
||||
"click .NB-story-title" : "select_story",
|
||||
"contextmenu .NB-story-title" : "show_manage_menu",
|
||||
"click .NB-story-manage-icon" : "show_manage_menu",
|
||||
"click .NB-storytitles-shares" : "select_story_shared",
|
||||
"mouseenter" : "mouseenter_manage_icon",
|
||||
"mouseleave" : "mouseleave_manage_icon"
|
||||
"mouseenter .NB-story-title" : "mouseenter_manage_icon",
|
||||
"mouseleave .NB-story-title" : "mouseleave_manage_icon"
|
||||
},
|
||||
|
||||
initialize: function() {
|
||||
|
|
@ -26,7 +26,6 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
story : this.model,
|
||||
feed : (NEWSBLUR.reader.flags.river_view || NEWSBLUR.reader.flags.social_view) &&
|
||||
NEWSBLUR.assets.get_feed(this.model.get('story_feed_id')),
|
||||
tag : _.first(this.model.get("story_tags")),
|
||||
options : this.options
|
||||
}));
|
||||
this.$st = this.$(".NB-story-title");
|
||||
|
|
@ -50,11 +49,6 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
<div class="NB-storytitles-share"></div>\
|
||||
<span class="NB-storytitles-title"><%= story.get("story_title") %></span>\
|
||||
<span class="NB-storytitles-author"><%= story.get("story_authors") %></span>\
|
||||
<% if (tag) { %>\
|
||||
<span class="NB-storytitles-tags">\
|
||||
<span class="NB-storytitles-tag"><%= tag %></span>\
|
||||
</span>\
|
||||
<% } %>\
|
||||
</a>\
|
||||
<span class="story_date"><%= story.get("short_parsed_date") %></span>\
|
||||
<% if (story.get("comment_count_friends")) { %>\
|
||||
|
|
@ -109,7 +103,7 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
.addClass('NB-story-'+story.score_name(score));
|
||||
|
||||
if (unread_view > score) {
|
||||
this.$el.css('display', 'none');
|
||||
this.$st.addClass("NB-hidden");
|
||||
}
|
||||
|
||||
if (NEWSBLUR.assets.preference('show_tooltips')) {
|
||||
|
|
@ -164,6 +158,7 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
},
|
||||
|
||||
toggle_selected: function(model, selected, options) {
|
||||
console.log(["toggle_selected", model, selected, options]);
|
||||
this.$st.toggleClass('NB-selected', !!this.model.get('selected'));
|
||||
|
||||
if (this.model.get('selected')) {
|
||||
|
|
@ -246,7 +241,7 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
|
|||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
if (e.which == 1 && $('.NB-menu-manage-container:visible').length) return;
|
||||
|
||||
|
||||
this.model.set('selected', true, {'click_on_story_title': true});
|
||||
|
||||
if (NEWSBLUR.hotkeys.command) {
|
||||
|
|
|
|||
|
|
@ -38,12 +38,14 @@ NEWSBLUR.Views.StoryTitlesHeader = Backbone.View.extend({
|
|||
<div class="NB-feedlist-manage-icon"></div>\
|
||||
<span class="folder_title_text"><%= folder_title %></span>\
|
||||
<% if (show_options) { %>\
|
||||
<span class="NB-feedbar-options">\
|
||||
<div class="NB-icon"></div>\
|
||||
<%= NEWSBLUR.assets.view_setting(folder_id, "read_filter") %>\
|
||||
·\
|
||||
<%= NEWSBLUR.assets.view_setting(folder_id, "order") %>\
|
||||
</span>\
|
||||
<div class="NB-feedbar-options-container">\
|
||||
<span class="NB-feedbar-options">\
|
||||
<div class="NB-icon"></div>\
|
||||
<%= NEWSBLUR.assets.view_setting(folder_id, "read_filter") %>\
|
||||
·\
|
||||
<%= NEWSBLUR.assets.view_setting(folder_id, "order") %>\
|
||||
</span>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
</div>\
|
||||
', {
|
||||
|
|
@ -151,7 +153,7 @@ NEWSBLUR.Views.StoryTitlesHeader = Backbone.View.extend({
|
|||
return story.score() < 0;
|
||||
});
|
||||
|
||||
// NEWSBLUR.log(['show_hidden_story_titles', hidden_stories_at_threshold, hidden_stories_below_threshold, unread_view_name]);
|
||||
NEWSBLUR.log(['show_hidden_story_titles', hidden_stories_at_threshold, hidden_stories_below_threshold, unread_view_name]);
|
||||
|
||||
// First click, open neutral. Second click, open negative.
|
||||
if (unread_view_name == 'positive' &&
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue