From 24f8bb257c3cc8b23aa313e54ac17e07fb3c7690 Mon Sep 17 00:00:00 2001 From: Seth Call Date: Tue, 11 Mar 2014 07:40:58 +0000 Subject: [PATCH] * VRFS-1168 - done except the distance filter, but that's assigned elsewhere anyway --- ruby/lib/jam_ruby/models/feed.rb | 4 - ruby/lib/jam_ruby/models/recording.rb | 3 +- ruby/lib/jam_ruby/models/search.rb | 14 +-- web/app/assets/javascripts/application.js | 1 + web/app/assets/javascripts/feed.js | 118 ++++++++++++++++-- web/app/assets/javascripts/utils.js | 2 +- web/app/assets/stylesheets/client/client.css | 1 + .../stylesheets/client/content.css.scss | 4 + .../assets/stylesheets/client/feed.css.scss | 5 + .../stylesheets/client/findSession.css.scss | 8 -- .../stylesheets/client/jamkazam.css.scss | 14 +++ .../stylesheets/client/session.css.scss | 1 + .../stylesheets/web/audioWidgets.css.scss | 1 + web/app/controllers/api_feeds_controller.rb | 4 - web/app/views/clients/_feed.html.haml | 5 +- web/app/views/clients/_findSession.html.erb | 2 +- web/app/views/clients/_web_filter.html.erb | 6 + .../users/_feed_recording_ajax.html.haml | 2 +- 18 files changed, 154 insertions(+), 41 deletions(-) create mode 100644 web/app/assets/stylesheets/client/feed.css.scss diff --git a/ruby/lib/jam_ruby/models/feed.rb b/ruby/lib/jam_ruby/models/feed.rb index 9518957c2..64f002a1d 100644 --- a/ruby/lib/jam_ruby/models/feed.rb +++ b/ruby/lib/jam_ruby/models/feed.rb @@ -148,10 +148,6 @@ module JamRuby end end end - - - - end end end diff --git a/ruby/lib/jam_ruby/models/recording.rb b/ruby/lib/jam_ruby/models/recording.rb index 65ab57968..570734180 100644 --- a/ruby/lib/jam_ruby/models/recording.rb +++ b/ruby/lib/jam_ruby/models/recording.rb @@ -345,7 +345,8 @@ module JamRuby # meant to be used as a way to 'pluck' a claimed_recording appropriate for user. def candidate_claimed_recording - claimed_recordings.where(is_public: true).first + #claimed_recordings.where(is_public: true).first + claimed_recordings.first end private diff --git a/ruby/lib/jam_ruby/models/search.rb b/ruby/lib/jam_ruby/models/search.rb index fb73151ac..4de3b0f4c 100644 --- a/ruby/lib/jam_ruby/models/search.rb +++ b/ruby/lib/jam_ruby/models/search.rb @@ -103,17 +103,17 @@ module JamRuby DISTANCE_OPTS = B_DISTANCE_OPTS = M_DISTANCE_OPTS = [['Any', 0], [1000.to_s, 1000], [500.to_s, 500], [250.to_s, 250], [100.to_s, 100], [50.to_s, 50], [25.to_s, 25]] - F_SORT_RECENT = ['Most Recent', :recent] - F_SORT_OLDEST = ['Ending Soonest', :ending_soon] - F_SORT_LENGTH = ['Session Length', :session_length] + F_SORT_RECENT = ['Most Recent', :date] + F_SORT_OLDEST = ['Most Liked', :likes] + F_SORT_LENGTH = ['Most Played', :plays] F_SORT_OPTS = [F_SORT_RECENT, F_SORT_LENGTH, F_SORT_OLDEST] - SHOW_BOTH = ['Both', :both] - SHOW_SESSIONS = ['Sessions', :sessions] - SHOW_RECORDINGS = ['Recordings', :recordings] + SHOW_BOTH = ['Sessions & Recordings', :all] + SHOW_SESSIONS = ['Sessions', :music_session_history] + SHOW_RECORDINGS = ['Recordings', :recording] SHOW_OPTS = [SHOW_BOTH, SHOW_SESSIONS, SHOW_RECORDINGS] - DATE_OPTS = [['Today', 0], ['This week', 7], ['Past 2 weeks', 14], ['This month', 30], ['Past year', 365], ['All', -1]] + DATE_OPTS = [['Today', 'today'], ['This Week', 'week'], ['This Month', 'month'], ['All Time', 'all']] def self.order_param(params, keys=M_ORDERING_KEYS) ordering = params[:orderby] diff --git a/web/app/assets/javascripts/application.js b/web/app/assets/javascripts/application.js index 044092be1..49fbdb9e7 100644 --- a/web/app/assets/javascripts/application.js +++ b/web/app/assets/javascripts/application.js @@ -26,6 +26,7 @@ //= require jquery.easydropdown //= require jquery.scrollTo //= require jquery.infinitescroll +//= require jquery.hoverIntent //= require jquery.dotdotdot //= require globals //= require AAB_message_factory diff --git a/web/app/assets/javascripts/feed.js b/web/app/assets/javascripts/feed.js index d2375b7bb..77a073e95 100644 --- a/web/app/assets/javascripts/feed.js +++ b/web/app/assets/javascripts/feed.js @@ -6,21 +6,38 @@ var logger = context.JK.logger; var rest = context.JK.Rest(); - var currentQuery = defaultQuery(); + var currentQuery = null; var currentPage = 0; var LIMIT = 20; var $screen = null; var $next = null; var $scroller = null; var $content = null; + var $noMoreFeeds = null; + var $refresh = null; + var $sortFeedBy = null; + var $includeDate = null; + var $includeType = null; + var next = null; function defaultQuery() { - return { offset:currentPage * LIMIT, limit:LIMIT, page:currentPage }; + var query = { limit:LIMIT, page:currentPage}; + + if(next) { + query.since = next; + } + + return query; } function buildQuery() { currentQuery = defaultQuery(); + // specify search criteria based on form + currentQuery.sort = $sortFeedBy.val(); + currentQuery.time_range = $includeDate.val(); + currentQuery.type = $includeType.val(); + return currentQuery; } @@ -32,18 +49,75 @@ refresh(); } + function clearResults() { + currentPage = 0; + $content.empty(); // TODO: do we need to delete audio elements? + $noMoreFeeds.hide(); + next = null; + } + + function handleFeedResponse(response) { + next = response.next; + + renderFeeds(response); + + if(response.next == null) { + // if we less results than asked for, end searching + $scroller.infinitescroll('pause'); + logger.debug("end of feeds") + + if(currentPage > 0) { + $noMoreFeeds.show(); + // there are bugs with infinitescroll not removing the 'loading'. + // it's most noticeable at the end of the list, so whack all such entries + $('.infinite-scroll-loader').remove(); + } + } + else { + currentPage++; + buildQuery(); + registerInfiniteScroll(); + } + } function refresh() { + + clearResults(); + currentQuery = buildQuery(); rest.getFeeds(currentQuery) .done(function(response) { - renderFeeds(response); + handleFeedResponse(response); }) .fail(function(jqXHR) { app.notifyServerError(jqXHR, 'Feed Unavailable') }) } + function registerInfiniteScroll() { + + $scroller.infinitescroll({ + behavior: 'local', + navSelector: '#feedScreen .btn-next-pager', + nextSelector: '#feedScreen .btn-next-pager', + binder: $scroller, + dataType: 'json', + appendCallback: false, + prefill: false, + bufferPx:100, + loading: { + msg: $('
Loading ...
'), + img: '/assets/shared/spinner.gif' + }, + path: function(page) { + return '/api/feeds?' + $.param(buildQuery()); + } + },function(json, opts) { + handleFeedResponse(json); + }); + $scroller.infinitescroll('resume'); + } + function toggleSessionDetails() { var $detailsLink = $(this); @@ -70,7 +144,6 @@ } toggledOpen = !toggledOpen; - $detailsLink.data('toggledOpen', toggledOpen); return false; } @@ -122,9 +195,6 @@ } } - - - function startRecordingPlay($feedItem) { var img = $('.play-icon', $feedItem); var $controls = $feedItem.find('.recording-controls'); @@ -207,13 +277,12 @@ } toggledOpen = !toggledOpen; + $detailsLink.data('toggledOpen', toggledOpen); return false; } - - function renderFeeds(feeds) { $.each(feeds.entries, function(i, feed) { @@ -240,9 +309,9 @@ // these routines need the item to have height to work (must be after renderFeed) $controls.listenBroadcast(); $controls.bind('statechange.listenBroadcast', stateChangeSession); - $('.dotdotdot', $feedItem).dotdotdot(); $feedItem.data('original-max-height', $feedItem.css('height')); + context.JK.bindHoverEvents($feedItem); } else if(feed.type == 'recording') { if(feed.claimed_recordings.length == 0) { @@ -273,8 +342,7 @@ $controls.bind('statechange.listenRecording', stateChangeRecording); $('.dotdotdot', $feedItem).dotdotdot(); $feedItem.data('original-max-height', $feedItem.css('height')); - - + context.JK.bindHoverEvents($feedItem); } else { logger.warn("skipping feed type: " + feed.type); @@ -286,6 +354,18 @@ $content.append(feed); } + function search() { + logger.debug("Searching for feeds..."); + refresh(); + return false; + } + + function events() { + $refresh.on("click", search); + $sortFeedBy.on('change', search); + $includeDate.on('change', search); + $includeType.on('change', search); + } function initialize() { var screenBindings = { @@ -296,7 +376,19 @@ $screen = $('[layout-id="feed"]'); $scroller = $screen.find('.content-body-scroller'); - $content = $screen.find('.profile-wrapper'); + $content = $screen.find('.feed-content'); + $noMoreFeeds = $('#end-of-feeds-list'); + $refresh = $screen.find('#btn-refresh-feed'); + $sortFeedBy = $screen.find('#feed_order_by'); + $includeDate = $screen.find('#feed_date'); + $includeType = $screen.find('#feed_show'); + + // set default search criteria + $sortFeedBy.val('date') + $includeDate.val('month') + $includeType.val('all') + + events(); } this.initialize = initialize; diff --git a/web/app/assets/javascripts/utils.js b/web/app/assets/javascripts/utils.js index 1c358145d..92443499a 100644 --- a/web/app/assets/javascripts/utils.js +++ b/web/app/assets/javascripts/utils.js @@ -151,7 +151,7 @@ $element.bt(text, options); } - context.JK.bindHoverEvents = function ($parent) { + context.JK.bindHoverEvents = function ($parent) { if($parent) { $parent = $('body'); diff --git a/web/app/assets/stylesheets/client/client.css b/web/app/assets/stylesheets/client/client.css index 6400fdba1..f5ec5c95b 100644 --- a/web/app/assets/stylesheets/client/client.css +++ b/web/app/assets/stylesheets/client/client.css @@ -43,6 +43,7 @@ *= require ./leaveSessionWarning *= require ./terms *= require ./createSession + *= require ./feed *= require ./genreSelector *= require ./sessionList *= require ./searchResults diff --git a/web/app/assets/stylesheets/client/content.css.scss b/web/app/assets/stylesheets/client/content.css.scss index 8431e7e2d..108892b37 100644 --- a/web/app/assets/stylesheets/client/content.css.scss +++ b/web/app/assets/stylesheets/client/content.css.scss @@ -95,6 +95,10 @@ .filter-head { position: absolute; padding:11px 0; + + .btn-refresh-entries { + margin-top:7px; + } } .filter-body { height:100%; diff --git a/web/app/assets/stylesheets/client/feed.css.scss b/web/app/assets/stylesheets/client/feed.css.scss new file mode 100644 index 000000000..4dbd60d4f --- /dev/null +++ b/web/app/assets/stylesheets/client/feed.css.scss @@ -0,0 +1,5 @@ +#feedScreen { + .recording-current { + position:absolute; // solves a problem with duration wrapping--only in firefox + } +} \ No newline at end of file diff --git a/web/app/assets/stylesheets/client/findSession.css.scss b/web/app/assets/stylesheets/client/findSession.css.scss index 5c4e47c0c..3cc12cd8a 100644 --- a/web/app/assets/stylesheets/client/findSession.css.scss +++ b/web/app/assets/stylesheets/client/findSession.css.scss @@ -48,14 +48,6 @@ height:20px; } - #end-of-session-list { - display:none; - overflow: visibility; - margin:40px auto 10px; - width:100%; - height:20px; - text-align:center; - } .btn-next { display:none; diff --git a/web/app/assets/stylesheets/client/jamkazam.css.scss b/web/app/assets/stylesheets/client/jamkazam.css.scss index 4dfd51558..8c992dc30 100644 --- a/web/app/assets/stylesheets/client/jamkazam.css.scss +++ b/web/app/assets/stylesheets/client/jamkazam.css.scss @@ -525,3 +525,17 @@ hr { height: 1px; margin: 10px 0; } + +// infinitescroll required element +.btn-next-pager { + display:none; +} + +.end-of-list { + display:none; + overflow: visibility; + margin:40px auto 10px; + width:100%; + height:20px; + text-align:center; +} \ No newline at end of file diff --git a/web/app/assets/stylesheets/client/session.css.scss b/web/app/assets/stylesheets/client/session.css.scss index 3bd0977f0..cd389c60f 100644 --- a/web/app/assets/stylesheets/client/session.css.scss +++ b/web/app/assets/stylesheets/client/session.css.scss @@ -517,6 +517,7 @@ table.vu td { } .recording-controls { + display:none; .play-button { outline:none; diff --git a/web/app/assets/stylesheets/web/audioWidgets.css.scss b/web/app/assets/stylesheets/web/audioWidgets.css.scss index 6faf75ac5..ce9b3c251 100644 --- a/web/app/assets/stylesheets/web/audioWidgets.css.scss +++ b/web/app/assets/stylesheets/web/audioWidgets.css.scss @@ -112,6 +112,7 @@ .feed-entry { .session-controls, .recording-controls { + display:inline-block; &.ended { background-color: #471f18; diff --git a/web/app/controllers/api_feeds_controller.rb b/web/app/controllers/api_feeds_controller.rb index f8ffac3a1..693fbe73e 100644 --- a/web/app/controllers/api_feeds_controller.rb +++ b/web/app/controllers/api_feeds_controller.rb @@ -16,10 +16,6 @@ class ApiFeedsController < ApiController @feeds = data[:query] @next = data[:next] - - puts "#{@feeds.inspect} FEEEEDS" - puts "#{@next.inspect} NEEEEXT" - render "api_feeds/index", :layout => nil end end \ No newline at end of file diff --git a/web/app/views/clients/_feed.html.haml b/web/app/views/clients/_feed.html.haml index 015a76d4c..c48c1b17d 100644 --- a/web/app/views/clients/_feed.html.haml +++ b/web/app/views/clients/_feed.html.haml @@ -1,4 +1,4 @@ -%div{ layout: 'screen', :'layout-id' => 'feed', :class => 'screen secondary'} +%div{ layout: 'screen', :'layout-id' => 'feed', id: 'feedScreen', :class => 'screen secondary'} .content .content-head .content-icon= image_tag("content/icon_feed.png", {:height => 19, :width => 19}) @@ -10,3 +10,6 @@ .filter-body .content-body-scroller .profile-wrapper + .feed-content + %a{href: "/api/feeds?page=1", class: "btn-next-pager"}= 'Next' + %div{id: 'end-of-feeds-list', class: 'end-of-list'}= 'No more feed entries' diff --git a/web/app/views/clients/_findSession.html.erb b/web/app/views/clients/_findSession.html.erb index c3d48139c..42cabf7d6 100644 --- a/web/app/views/clients/_findSession.html.erb +++ b/web/app/views/clients/_findSession.html.erb @@ -53,7 +53,7 @@ There are currently no public sessions. -
+
No more sessions.
diff --git a/web/app/views/clients/_web_filter.html.erb b/web/app/views/clients/_web_filter.html.erb index 9b0345848..5c8d362e7 100644 --- a/web/app/views/clients/_web_filter.html.erb +++ b/web/app/views/clients/_web_filter.html.erb @@ -60,5 +60,11 @@ <% end %> <% end -%> + + <% if :feed == filter_label %> +
+ REFRESH +
+ <% end %> <% end -%> \ No newline at end of file diff --git a/web/app/views/users/_feed_recording_ajax.html.haml b/web/app/views/users/_feed_recording_ajax.html.haml index 4488b8945..974734d35 100644 --- a/web/app/views/users/_feed_recording_ajax.html.haml +++ b/web/app/views/users/_feed_recording_ajax.html.haml @@ -1,5 +1,5 @@ %script{type: 'text/template', id: 'template-feed-recording'} - .feed-entry.recording-entry{:id => '{{data.feed_item.id}}', :'data-claimed-recording-id' => '{{data.candidate_claimed_recording.id}}' } + .feed-entry.recording-entry{:'data-claimed-recording-id' => '{{data.candidate_claimed_recording.id}}' } / avatar .avatar-small.ib %img{ src: '{{data.feed_item.helpers.avatar}}' }