mirror of
https://github.com/samuelclay/NewsBlur.git
synced 2025-09-18 21:50:56 +00:00
Adding comment box to share.
This commit is contained in:
parent
ae0e45b698
commit
7f3ac8c843
2 changed files with 104 additions and 3 deletions
|
@ -1927,7 +1927,7 @@ background: transparent;
|
|||
}
|
||||
|
||||
#story_pane .NB-feed-story-content {
|
||||
margin: 0 140px 32px 28px;
|
||||
margin: 0 200px 32px 28px;
|
||||
padding: 12px 0px;
|
||||
max-width: 700px;
|
||||
}
|
||||
|
@ -1937,6 +1937,7 @@ background: transparent;
|
|||
right: 12px;
|
||||
bottom: 32px;
|
||||
text-align: center;
|
||||
width: 172px;
|
||||
}
|
||||
|
||||
#story_pane .NB-feed-story-sideoptions-container {
|
||||
|
@ -1977,16 +1978,63 @@ background: transparent;
|
|||
-moz-transition: all .12s ease-out;
|
||||
-o-transition: all .12s ease-out;
|
||||
-ms-transition: all .12s ease-out;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-o-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
#story_pane .NB-sideoption:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
#story_pane .NB-sideoption:hover .NB-sideoption-icon,
|
||||
#story_pane .NB-sideoption:hover .NB-sideoption-title {
|
||||
#story_pane .NB-sideoption:hover .NB-sideoption-title,
|
||||
#story_pane .NB-sideoption.NB-active .NB-sideoption-icon,
|
||||
#story_pane .NB-sideoption.NB-active .NB-sideoption-title {
|
||||
background-color: #2B478C;
|
||||
color: #D7DDF7;
|
||||
opacity: 1;
|
||||
text-shadow: 0 1px 0 #101010;
|
||||
}
|
||||
#story_pane .NB-sideoption-share-wrapper {
|
||||
background-color: #EBF6DA;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
#story_pane .NB-sideoption-share {
|
||||
padding: 4px 12px 6px;
|
||||
}
|
||||
#story_pane .NB-sideoption-share .NB-sideoption-share-title {
|
||||
text-transform: uppercase;
|
||||
font-size: 10px;
|
||||
text-align: left;
|
||||
text-shadow: 0 1px 0 #F6F6F6;
|
||||
}
|
||||
#story_pane .NB-sideoption-share .NB-sideoption-share-optional {
|
||||
text-transform: uppercase;
|
||||
float: right;
|
||||
color: #808080;
|
||||
font-size: 10px;
|
||||
text-shadow: 0 1px 0 #F6F6F6;
|
||||
}
|
||||
#story_pane .NB-sideoption-share .NB-sideoption-share-comments {
|
||||
width: 100%;
|
||||
}
|
||||
#story_pane .NB-sideoption-share .NB-sideoption-share-save {
|
||||
font-size: 10px;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
color: white;
|
||||
padding: 2px 6px;
|
||||
margin: 2px auto;
|
||||
width: 90%;
|
||||
background-color: #639510;
|
||||
cursor: pointer;
|
||||
-moz-box-shadow:2px 2px 0 #95AB76;
|
||||
-webkit-box-shadow:2px 2px 0 #95AB76;
|
||||
box-shadow:2px 2px 0 #95AB76;
|
||||
text-shadow: 0 1px 0 #101010;
|
||||
}
|
||||
|
||||
#story_pane .NB-feed-story-endbar {
|
||||
height: 8px;
|
||||
border-top: 1px solid #404040;
|
||||
|
|
|
@ -2668,6 +2668,51 @@
|
|||
this.update_starred_count();
|
||||
},
|
||||
|
||||
open_feed_story_share: function(story_id, feed_id) {
|
||||
var $feed_story = this.find_story_in_feed_view(story_id);
|
||||
var $sideoption = $('.NB-sideoption.NB-feed-story-share', $feed_story);
|
||||
var $share = $('.NB-sideoption-share-wrapper', $feed_story);
|
||||
var $story_content = $('.NB-feed-story-content', $feed_story);
|
||||
|
||||
if ($sideoption.hasClass('NB-active')) {
|
||||
$share.animate({
|
||||
'height': 0
|
||||
}, {
|
||||
'duration': 300,
|
||||
'easing': 'easeInOutQuint',
|
||||
'queue': false
|
||||
});
|
||||
$sideoption.removeClass('NB-active');
|
||||
return;
|
||||
}
|
||||
|
||||
$sideoption.addClass('NB-active');
|
||||
var $share_clone = $share.clone();
|
||||
var full_height = $share_clone.css({
|
||||
'height': 'auto',
|
||||
'position': 'absolute',
|
||||
'visibility': 'hidden'
|
||||
}).appendTo($share.parent()).height();
|
||||
$share_clone.remove();
|
||||
$share.animate({
|
||||
'height': full_height
|
||||
}, {
|
||||
'duration': 350,
|
||||
'easing': 'easeInOutQuint',
|
||||
'queue': false
|
||||
});
|
||||
|
||||
if ($('.NB-feed-story-sideoptions-container', $feed_story).height() + full_height > $story_content.height()) {
|
||||
$story_content.animate({
|
||||
'height': $('.NB-feed-story-sideoptions-container', $feed_story).height() + full_height
|
||||
}, {
|
||||
'duration': 350,
|
||||
'easing': 'easeInOutQuint',
|
||||
'queue': false
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
send_story_to_instapaper: function(story_id) {
|
||||
var story = this.model.get_story(story_id);
|
||||
var url = 'http://www.instapaper.com/edit';
|
||||
|
@ -3528,6 +3573,14 @@
|
|||
$.make('div', { className: 'NB-sideoption NB-feed-story-share' }, [
|
||||
$.make('div', { className: 'NB-sideoption-icon'}, ' '),
|
||||
$.make('div', { className: 'NB-sideoption-title'}, 'Share this story')
|
||||
]),
|
||||
$.make('div', { className: 'NB-sideoption-share-wrapper' }, [
|
||||
$.make('div', { className: 'NB-sideoption-share' }, [
|
||||
$.make('div', { className: 'NB-sideoption-share-optional' }, 'Optional'),
|
||||
$.make('div', { className: 'NB-sideoption-share-title' }, 'Comments:'),
|
||||
$.make('textarea', { className: 'NB-sideoption-share-comments' }),
|
||||
$.make('div', { className: 'NB-sideoption-share-save NB-modal-submit-green NB-modal-submit-button' }, 'Share')
|
||||
])
|
||||
])
|
||||
])
|
||||
]).data('story', story.id).data('story_id', story.id).data('feed_id', story.story_feed_id);
|
||||
|
@ -5990,7 +6043,7 @@
|
|||
var $story = $t.closest('.NB-feed-story');
|
||||
var feed_id = $story.data('feed_id');
|
||||
var story_id = $story.data('story_id');
|
||||
self.open_story_trainer(story_id, feed_id);
|
||||
self.open_feed_story_share(story_id, feed_id);
|
||||
});
|
||||
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue