Integrated Perfect Scrollbar into notifications dropdown
This commit is contained in:
parent
c6771e7575
commit
b70f306ff5
6 changed files with 63 additions and 36 deletions
6
Gemfile
6
Gemfile
|
|
@ -1,4 +1,5 @@
|
||||||
source 'https://rubygems.org'
|
source 'https://rubygems.org'
|
||||||
|
source 'https://rails-assets.org'
|
||||||
|
|
||||||
gem 'rails', '4.1.5'
|
gem 'rails', '4.1.5'
|
||||||
|
|
||||||
|
|
@ -79,6 +80,11 @@ gem 'backbone-on-rails', '1.1.1'
|
||||||
gem 'handlebars_assets', '0.12.0'
|
gem 'handlebars_assets', '0.12.0'
|
||||||
gem 'jquery-rails', '3.0.4'
|
gem 'jquery-rails', '3.0.4'
|
||||||
|
|
||||||
|
# jQuery plugins
|
||||||
|
|
||||||
|
gem 'rails-assets-perfect-scrollbar', '0.4.11'
|
||||||
|
gem 'rails-assets-jquery', '1.10.2'
|
||||||
|
|
||||||
# Localization
|
# Localization
|
||||||
|
|
||||||
gem 'http_accept_language', '1.0.2'
|
gem 'http_accept_language', '1.0.2'
|
||||||
|
|
|
||||||
74
Gemfile.lock
74
Gemfile.lock
|
|
@ -1,5 +1,6 @@
|
||||||
GEM
|
GEM
|
||||||
remote: https://rubygems.org/
|
remote: https://rubygems.org/
|
||||||
|
remote: https://rails-assets.org/
|
||||||
specs:
|
specs:
|
||||||
actionmailer (4.1.5)
|
actionmailer (4.1.5)
|
||||||
actionpack (= 4.1.5)
|
actionpack (= 4.1.5)
|
||||||
|
|
@ -81,10 +82,10 @@ GEM
|
||||||
coffee-rails (4.0.1)
|
coffee-rails (4.0.1)
|
||||||
coffee-script (>= 2.2.0)
|
coffee-script (>= 2.2.0)
|
||||||
railties (>= 4.0.0, < 5.0)
|
railties (>= 4.0.0, < 5.0)
|
||||||
coffee-script (2.2.0)
|
coffee-script (2.3.0)
|
||||||
coffee-script-source
|
coffee-script-source
|
||||||
execjs
|
execjs
|
||||||
coffee-script-source (1.6.3)
|
coffee-script-source (1.7.1)
|
||||||
compass (0.12.7)
|
compass (0.12.7)
|
||||||
chunky_png (~> 1.2)
|
chunky_png (~> 1.2)
|
||||||
fssm (>= 0.2.7)
|
fssm (>= 0.2.7)
|
||||||
|
|
@ -92,7 +93,7 @@ GEM
|
||||||
compass-rails (2.0.0)
|
compass-rails (2.0.0)
|
||||||
compass (>= 0.12.2)
|
compass (>= 0.12.2)
|
||||||
configurate (0.0.8)
|
configurate (0.0.8)
|
||||||
connection_pool (1.2.0)
|
connection_pool (2.0.0)
|
||||||
crack (0.4.2)
|
crack (0.4.2)
|
||||||
safe_yaml (~> 1.0.0)
|
safe_yaml (~> 1.0.0)
|
||||||
cucumber (1.3.16)
|
cucumber (1.3.16)
|
||||||
|
|
@ -133,9 +134,8 @@ GEM
|
||||||
erubis (2.7.0)
|
erubis (2.7.0)
|
||||||
ethon (0.7.1)
|
ethon (0.7.1)
|
||||||
ffi (>= 1.3.0)
|
ffi (>= 1.3.0)
|
||||||
excon (0.39.0)
|
excon (0.39.5)
|
||||||
execjs (1.4.0)
|
execjs (2.2.1)
|
||||||
multi_json (~> 1.0)
|
|
||||||
factory_girl (4.4.0)
|
factory_girl (4.4.0)
|
||||||
activesupport (>= 3.0.0)
|
activesupport (>= 3.0.0)
|
||||||
factory_girl_rails (4.4.1)
|
factory_girl_rails (4.4.1)
|
||||||
|
|
@ -155,7 +155,7 @@ GEM
|
||||||
fog-json
|
fog-json
|
||||||
ipaddress (~> 0.5)
|
ipaddress (~> 0.5)
|
||||||
nokogiri (~> 1.5, >= 1.5.11)
|
nokogiri (~> 1.5, >= 1.5.11)
|
||||||
fog-brightbox (0.1.1)
|
fog-brightbox (0.3.0)
|
||||||
fog-core (~> 1.22)
|
fog-core (~> 1.22)
|
||||||
fog-json
|
fog-json
|
||||||
inflecto
|
inflecto
|
||||||
|
|
@ -168,7 +168,7 @@ GEM
|
||||||
net-ssh (>= 2.1.3)
|
net-ssh (>= 2.1.3)
|
||||||
fog-json (1.0.0)
|
fog-json (1.0.0)
|
||||||
multi_json (~> 1.0)
|
multi_json (~> 1.0)
|
||||||
font-awesome-rails (4.0.3.1)
|
font-awesome-rails (4.1.0.0)
|
||||||
railties (>= 3.2, < 5.0)
|
railties (>= 3.2, < 5.0)
|
||||||
foreigner (1.6.1)
|
foreigner (1.6.1)
|
||||||
activerecord (>= 3.0.0)
|
activerecord (>= 3.0.0)
|
||||||
|
|
@ -184,9 +184,9 @@ GEM
|
||||||
gon (5.0.4)
|
gon (5.0.4)
|
||||||
actionpack (>= 2.3.0)
|
actionpack (>= 2.3.0)
|
||||||
json
|
json
|
||||||
guard (2.2.5)
|
guard (2.6.1)
|
||||||
formatador (>= 0.2.4)
|
formatador (>= 0.2.4)
|
||||||
listen (~> 2.1)
|
listen (~> 2.7)
|
||||||
lumberjack (~> 1.0)
|
lumberjack (~> 1.0)
|
||||||
pry (>= 0.9.12)
|
pry (>= 0.9.12)
|
||||||
thor (>= 0.18.1)
|
thor (>= 0.18.1)
|
||||||
|
|
@ -209,7 +209,6 @@ GEM
|
||||||
hashie (2.1.2)
|
hashie (2.1.2)
|
||||||
hike (1.2.3)
|
hike (1.2.3)
|
||||||
http_accept_language (1.0.2)
|
http_accept_language (1.0.2)
|
||||||
httpauth (0.2.0)
|
|
||||||
i18n (0.6.11)
|
i18n (0.6.11)
|
||||||
i18n-inflector (2.6.7)
|
i18n-inflector (2.6.7)
|
||||||
i18n (>= 0.4.1)
|
i18n (>= 0.4.1)
|
||||||
|
|
@ -224,25 +223,24 @@ GEM
|
||||||
phantomjs
|
phantomjs
|
||||||
rack (>= 1.2.1)
|
rack (>= 1.2.1)
|
||||||
rake
|
rake
|
||||||
jasmine-core (2.0.0)
|
jasmine-core (2.0.2)
|
||||||
jasmine-jquery-rails (2.0.3)
|
jasmine-jquery-rails (2.0.3)
|
||||||
jquery-rails (3.0.4)
|
jquery-rails (3.0.4)
|
||||||
railties (>= 3.0, < 5.0)
|
railties (>= 3.0, < 5.0)
|
||||||
thor (>= 0.14, < 2.0)
|
thor (>= 0.14, < 2.0)
|
||||||
jquery-ui-rails (4.2.0)
|
jquery-ui-rails (4.2.1)
|
||||||
railties (>= 3.2.16)
|
railties (>= 3.2.16)
|
||||||
json (1.8.1)
|
json (1.8.1)
|
||||||
jwt (0.1.10)
|
jwt (1.0.0)
|
||||||
multi_json (>= 1.5)
|
kaminari (0.16.1)
|
||||||
kaminari (0.15.1)
|
|
||||||
actionpack (>= 3.0.0)
|
actionpack (>= 3.0.0)
|
||||||
activesupport (>= 3.0.0)
|
activesupport (>= 3.0.0)
|
||||||
kgio (2.9.2)
|
kgio (2.9.2)
|
||||||
listen (2.4.0)
|
listen (2.7.9)
|
||||||
celluloid (>= 0.15.2)
|
celluloid (>= 0.15.2)
|
||||||
rb-fsevent (>= 0.9.3)
|
rb-fsevent (>= 0.9.3)
|
||||||
rb-inotify (>= 0.9)
|
rb-inotify (>= 0.9)
|
||||||
lumberjack (1.0.4)
|
lumberjack (1.0.9)
|
||||||
macaddr (1.7.1)
|
macaddr (1.7.1)
|
||||||
systemu (~> 2.6.2)
|
systemu (~> 2.6.2)
|
||||||
mail (2.5.4)
|
mail (2.5.4)
|
||||||
|
|
@ -262,6 +260,7 @@ GEM
|
||||||
rails
|
rails
|
||||||
multi_json (1.10.1)
|
multi_json (1.10.1)
|
||||||
multi_test (0.1.1)
|
multi_test (0.1.1)
|
||||||
|
multi_xml (0.5.5)
|
||||||
multipart-post (1.2.0)
|
multipart-post (1.2.0)
|
||||||
mysql2 (0.3.16)
|
mysql2 (0.3.16)
|
||||||
nested_form (0.3.2)
|
nested_form (0.3.2)
|
||||||
|
|
@ -271,11 +270,11 @@ GEM
|
||||||
nokogiri (1.6.1)
|
nokogiri (1.6.1)
|
||||||
mini_portile (~> 0.5.0)
|
mini_portile (~> 0.5.0)
|
||||||
oauth (0.4.7)
|
oauth (0.4.7)
|
||||||
oauth2 (0.8.1)
|
oauth2 (0.9.4)
|
||||||
faraday (~> 0.8)
|
faraday (>= 0.8, < 0.10)
|
||||||
httpauth (~> 0.1)
|
jwt (~> 1.0)
|
||||||
jwt (~> 0.1.4)
|
multi_json (~> 1.3)
|
||||||
multi_json (~> 1.0)
|
multi_xml (~> 0.5)
|
||||||
rack (~> 1.2)
|
rack (~> 1.2)
|
||||||
omniauth (1.2.1)
|
omniauth (1.2.1)
|
||||||
hashie (>= 1.2, < 3)
|
hashie (>= 1.2, < 3)
|
||||||
|
|
@ -285,9 +284,11 @@ GEM
|
||||||
omniauth-oauth (1.0.1)
|
omniauth-oauth (1.0.1)
|
||||||
oauth
|
oauth
|
||||||
omniauth (~> 1.0)
|
omniauth (~> 1.0)
|
||||||
omniauth-oauth2 (1.1.1)
|
omniauth-oauth2 (1.1.2)
|
||||||
oauth2 (~> 0.8.0)
|
faraday (>= 0.8, < 0.10)
|
||||||
omniauth (~> 1.0)
|
multi_json (~> 1.3)
|
||||||
|
oauth2 (~> 0.9.3)
|
||||||
|
omniauth (~> 1.2)
|
||||||
omniauth-tumblr (1.1)
|
omniauth-tumblr (1.1)
|
||||||
omniauth-oauth (~> 1.0)
|
omniauth-oauth (~> 1.0)
|
||||||
omniauth-twitter (1.0.1)
|
omniauth-twitter (1.0.1)
|
||||||
|
|
@ -301,9 +302,9 @@ GEM
|
||||||
orm_adapter (0.5.0)
|
orm_adapter (0.5.0)
|
||||||
phantomjs (1.9.7.1)
|
phantomjs (1.9.7.1)
|
||||||
polyglot (0.3.5)
|
polyglot (0.3.5)
|
||||||
pry (0.9.12.4)
|
pry (0.10.1)
|
||||||
coderay (~> 1.0)
|
coderay (~> 1.1.0)
|
||||||
method_source (~> 0.8)
|
method_source (~> 0.8.1)
|
||||||
slop (~> 3.4)
|
slop (~> 3.4)
|
||||||
rack (1.5.2)
|
rack (1.5.2)
|
||||||
rack-cors (0.2.9)
|
rack-cors (0.2.9)
|
||||||
|
|
@ -313,9 +314,9 @@ GEM
|
||||||
rack-mobile-detect (0.4.0)
|
rack-mobile-detect (0.4.0)
|
||||||
rack
|
rack
|
||||||
rack-piwik (0.2.2)
|
rack-piwik (0.2.2)
|
||||||
rack-pjax (0.7.0)
|
rack-pjax (0.8.0)
|
||||||
nokogiri (~> 1.5)
|
nokogiri (~> 1.5)
|
||||||
rack (~> 1.3)
|
rack (~> 1.1)
|
||||||
rack-protection (1.2.0)
|
rack-protection (1.2.0)
|
||||||
rack
|
rack
|
||||||
rack-rewrite (1.5.0)
|
rack-rewrite (1.5.0)
|
||||||
|
|
@ -333,6 +334,9 @@ GEM
|
||||||
bundler (>= 1.3.0, < 2.0)
|
bundler (>= 1.3.0, < 2.0)
|
||||||
railties (= 4.1.5)
|
railties (= 4.1.5)
|
||||||
sprockets-rails (~> 2.0)
|
sprockets-rails (~> 2.0)
|
||||||
|
rails-assets-jquery (1.10.2)
|
||||||
|
rails-assets-perfect-scrollbar (0.4.11)
|
||||||
|
rails-assets-jquery (>= 1.10)
|
||||||
rails-i18n (4.0.2)
|
rails-i18n (4.0.2)
|
||||||
i18n (~> 0.6)
|
i18n (~> 0.6)
|
||||||
rails (>= 4.0)
|
rails (>= 4.0)
|
||||||
|
|
@ -394,7 +398,7 @@ GEM
|
||||||
rspec-mocks (~> 2.14.0)
|
rspec-mocks (~> 2.14.0)
|
||||||
ruby-oembed (0.8.9)
|
ruby-oembed (0.8.9)
|
||||||
ruby-progressbar (1.5.1)
|
ruby-progressbar (1.5.1)
|
||||||
rubyzip (1.1.4)
|
rubyzip (1.1.6)
|
||||||
safe_yaml (1.0.3)
|
safe_yaml (1.0.3)
|
||||||
sass (3.2.19)
|
sass (3.2.19)
|
||||||
sass-rails (4.0.3)
|
sass-rails (4.0.3)
|
||||||
|
|
@ -422,7 +426,7 @@ GEM
|
||||||
tilt (~> 1.3, >= 1.3.3)
|
tilt (~> 1.3, >= 1.3.3)
|
||||||
sinon-rails (1.9.0)
|
sinon-rails (1.9.0)
|
||||||
railties (>= 3.1)
|
railties (>= 3.1)
|
||||||
slop (3.4.7)
|
slop (3.6.0)
|
||||||
spork (1.0.0rc4)
|
spork (1.0.0rc4)
|
||||||
sprockets (2.11.0)
|
sprockets (2.11.0)
|
||||||
hike (~> 1.2)
|
hike (~> 1.2)
|
||||||
|
|
@ -470,7 +474,7 @@ GEM
|
||||||
will_paginate (3.0.5)
|
will_paginate (3.0.5)
|
||||||
xpath (2.0.0)
|
xpath (2.0.0)
|
||||||
nokogiri (~> 1.3)
|
nokogiri (~> 1.3)
|
||||||
zip-zip (0.2)
|
zip-zip (0.3)
|
||||||
rubyzip (>= 1.0.0)
|
rubyzip (>= 1.0.0)
|
||||||
|
|
||||||
PLATFORMS
|
PLATFORMS
|
||||||
|
|
@ -534,6 +538,8 @@ DEPENDENCIES
|
||||||
rack-rewrite (= 1.5.0)
|
rack-rewrite (= 1.5.0)
|
||||||
rack-ssl (= 1.4.1)
|
rack-ssl (= 1.4.1)
|
||||||
rails (= 4.1.5)
|
rails (= 4.1.5)
|
||||||
|
rails-assets-jquery (= 1.10.2)
|
||||||
|
rails-assets-perfect-scrollbar (= 0.4.11)
|
||||||
rails-i18n (= 4.0.2)
|
rails-i18n (= 4.0.2)
|
||||||
rails-timeago (= 2.4.0)
|
rails-timeago (= 2.4.0)
|
||||||
rails_admin (= 0.6.2)
|
rails_admin (= 0.6.2)
|
||||||
|
|
|
||||||
|
|
@ -12,6 +12,8 @@
|
||||||
//= require_tree ./collections
|
//= require_tree ./collections
|
||||||
//= require_tree ./views
|
//= require_tree ./views
|
||||||
|
|
||||||
|
//= require perfect-scrollbar
|
||||||
|
|
||||||
var app = {
|
var app = {
|
||||||
collections: {},
|
collections: {},
|
||||||
models: {},
|
models: {},
|
||||||
|
|
|
||||||
|
|
@ -49,10 +49,11 @@
|
||||||
this.hideDropdown = function() {
|
this.hideDropdown = function() {
|
||||||
self.badge.removeClass("active");
|
self.badge.removeClass("active");
|
||||||
self.dropdown.css("display", "none");
|
self.dropdown.css("display", "none");
|
||||||
|
$('.notifications').perfectScrollbar('destroy');
|
||||||
};
|
};
|
||||||
|
|
||||||
this.getNotifications = function() {
|
this.getNotifications = function() {
|
||||||
$.getJSON("/notifications?per_page=5", function(notifications) {
|
$.getJSON("/notifications?per_page=15", function(notifications) {
|
||||||
self.notifications = notifications;
|
self.notifications = notifications;
|
||||||
self.renderNotifications();
|
self.renderNotifications();
|
||||||
});
|
});
|
||||||
|
|
@ -74,6 +75,8 @@
|
||||||
self.dropdownNotifications.find('.read').each(function(index) {
|
self.dropdownNotifications.find('.read').each(function(index) {
|
||||||
Diaspora.page.header.notifications.setUpRead( $(this) );
|
Diaspora.page.header.notifications.setUpRead( $(this) );
|
||||||
});
|
});
|
||||||
|
$('.notifications').perfectScrollbar();
|
||||||
|
$(".notifications").scrollTop(0);
|
||||||
self.ajaxLoader.hide();
|
self.ajaxLoader.hide();
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -25,6 +25,7 @@
|
||||||
@import 'tag'
|
@import 'tag'
|
||||||
@import 'photo'
|
@import 'photo'
|
||||||
|
|
||||||
|
@import 'perfect-scrollbar'
|
||||||
/* ====== media ====== */
|
/* ====== media ====== */
|
||||||
.media
|
.media
|
||||||
:margin 10px
|
:margin 10px
|
||||||
|
|
|
||||||
|
|
@ -151,6 +151,11 @@ body > header {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
}
|
}
|
||||||
|
.notifications{
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
max-height: 325px;
|
||||||
|
}
|
||||||
|
|
||||||
.notification_element {
|
.notification_element {
|
||||||
border-bottom: 1px solid $border-grey;
|
border-bottom: 1px solid $border-grey;
|
||||||
|
|
@ -169,13 +174,17 @@ body > header {
|
||||||
}
|
}
|
||||||
|
|
||||||
.unread-toggle {
|
.unread-toggle {
|
||||||
padding: 9px 5px;
|
padding: 9px 9px;
|
||||||
|
position: relative;
|
||||||
.entypo {
|
.entypo {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: lighten($black,75%);
|
color: lighten($black,75%);
|
||||||
font-size: 17px;
|
font-size: 17px;
|
||||||
line-height: 17px;
|
line-height: 17px;
|
||||||
}
|
}
|
||||||
|
.tooltip {
|
||||||
|
position: fixed;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.unread {
|
&.unread {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue