diff --git a/lms/djangoapps/django_comment_client/forum/views.py b/lms/djangoapps/django_comment_client/forum/views.py index 14ed01cc18..1f908a3e15 100644 --- a/lms/djangoapps/django_comment_client/forum/views.py +++ b/lms/djangoapps/django_comment_client/forum/views.py @@ -21,6 +21,7 @@ import comment_client as cc import xml.sax.saxutils as saxutils THREADS_PER_PAGE = 50000 +INLINE_THREADS_PER_PAGE = 5 PAGES_NEARBY_DELTA = 2 @@ -106,11 +107,11 @@ def render_forum_discussion(*args, **kwargs): def render_user_discussion(*args, **kwargs): return render_discussion(discussion_type='user', *args, **kwargs) -def get_threads(request, course_id, discussion_id=None): +def get_threads(request, course_id, discussion_id=None, per_page=THREADS_PER_PAGE): default_query_params = { 'page': 1, - 'per_page': THREADS_PER_PAGE, + 'per_page': per_page, 'sort_key': 'date', 'sort_order': 'desc', 'text': '', @@ -133,7 +134,7 @@ def inline_discussion(request, course_id, discussion_id): """ Renders JSON for DiscussionModules """ - threads, query_params = get_threads(request, course_id, discussion_id) + threads, query_params = get_threads(request, course_id, discussion_id, per_page=INLINE_THREADS_PER_PAGE) # TODO: Remove all of this stuff or switch back to server side rendering once templates are mustache again # html = render_inline_discussion(request, course_id, threads, discussion_id=discussion_id, \ # query_params=query_params) @@ -147,7 +148,9 @@ def inline_discussion(request, course_id, discussion_id): # 'html': html, 'discussion_data': map(utils.safe_content, threads), 'user_info': user_info, - 'annotated_content_info': annotated_content_info + 'annotated_content_info': annotated_content_info, + 'page': query_params['page'], + 'num_pages': query_params['num_pages'] }) def render_search_bar(request, course_id, discussion_id=None, text=''): diff --git a/lms/static/coffee/src/discussion/discussion_module_view.coffee b/lms/static/coffee/src/discussion/discussion_module_view.coffee index 06ed320623..2bf20e677f 100644 --- a/lms/static/coffee/src/discussion/discussion_module_view.coffee +++ b/lms/static/coffee/src/discussion/discussion_module_view.coffee @@ -4,7 +4,12 @@ if Backbone? "click .discussion-show": "toggleDiscussion" "click .new-post-btn": "toggleNewPost" "click .new-post-cancel": "hideNewPost" + "click .discussion-paginator a": "navigateToPage" + + paginationTemplate: -> DiscussionUtil.getTemplate("_pagination") + initialize: -> + @page = 1 toggleNewPost: (event) -> if @newPostForm.is(':hidden') @@ -26,24 +31,30 @@ if Backbone? @showed = true else $elem = $(event.target) - discussionId = $elem.data("discussion-id") - url = DiscussionUtil.urlFor 'retrieve_discussion', discussionId - DiscussionUtil.safeAjax - $elem: $elem - $loading: $elem - url: url - type: "GET" - dataType: 'json' - success: (response, textStatus, jqXHR) => @createDiscussion(event, response, textStatus, discussionId) + @loadPage $elem - createDiscussion: (event, response, textStatus, discussionId) => + loadPage: ($elem)=> + discussionId = @$el.data("discussion-id") + url = DiscussionUtil.urlFor('retrieve_discussion', discussionId) + "?page=#{@page}" + DiscussionUtil.safeAjax + $elem: $elem + $loading: $elem + url: url + type: "GET" + dataType: 'json' + success: (response, textStatus, jqXHR) => @renderDiscussion(event, response, textStatus, discussionId) + + renderDiscussion: (event, response, textStatus, discussionId) => window.user = new DiscussionUser(response.user_info) Content.loadContentInfos(response.annotated_content_info) $(event.target).html("Hide Discussion") @discussion = new Discussion() @discussion.reset(response.discussion_data, {silent: false}) $discussion = $(Mustache.render $("script#_inline_discussion").html(), {'threads':response.discussion_data, 'discussionId': discussionId}) - $(".discussion-module").append($discussion) + if @$('section.discussion').length + @$('section.discussion').replaceWith($discussion) + else + $(".discussion-module").append($discussion) @newPostForm = $('.new-post-article') @threadviews = @discussion.map (thread) -> new DiscussionThreadInlineView el: @$("article#thread_#{thread.id}"), model: thread @@ -53,6 +64,7 @@ if Backbone? @discussion.on "add", @addThread @retrieved = true @showed = true + @renderPagination(2, response.num_pages) addThread: (thread, collection, options) => # TODO: When doing pagination, this will need to repaginate @@ -62,3 +74,28 @@ if Backbone? threadView.render() @threadviews.unshift threadView + renderPagination: (delta, numPages) => + minPage = Math.max(@page - delta, 1) + maxPage = Math.min(@page + delta, numPages) + console.log minPage + console.log maxPage + pageUrl = (number) -> + "?discussion_page=#{number}" + params = + page: @page + lowPages: _.range(minPage, @page).map (n) -> {number: n, url: pageUrl(n)} + highPages: _.range(@page+1, maxPage+1).map (n) -> {number: n, url: pageUrl(n)} + previous: if @page-1 >= 1 then {url: pageUrl(@page-1), number: @page-1} else false + next: if @page+1 <= numPages then {url: pageUrl(@page+1), number: @page+1} else false + leftdots: minPage > 2 + rightdots: maxPage < numPages-1 + first: if minPage > 1 then {url: pageUrl(1)} else false + last: if maxPage < numPages then {number: numPages, url: pageUrl(numPages)} else false + thing = Mustache.render @paginationTemplate(), params + @$('section.pagination').html(thing) + + navigateToPage: (event) => + event.preventDefault() + window.history.pushState({}, window.document.title, event.target.href) + @page = $(event.target).data('page-number') + @loadPage($(event.target)) diff --git a/lms/static/sass/_discussion.scss b/lms/static/sass/_discussion.scss index 488eaab732..c715c291ea 100644 --- a/lms/static/sass/_discussion.scss +++ b/lms/static/sass/_discussion.scss @@ -1755,4 +1755,28 @@ body.discussion { margin: 8px 7px 0 0; background: url(../images/new-post-icon.png) no-repeat; } + section.pagination { + nav.discussion-paginator { + ol{ + li{ + list-style: none; + display: inline-block; + padding-right: 0.5em; + a { + @include white-button + } + + } + li.current-page{ + height: 35px; + font-size: 13px; + font-weight: 700; + line-height: 32px; + color: #333; + text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15); + } + } + } + } } diff --git a/lms/templates/discussion/_discussion_module.html b/lms/templates/discussion/_discussion_module.html index de4a9222e4..e43f7ae2a8 100644 --- a/lms/templates/discussion/_discussion_module.html +++ b/lms/templates/discussion/_discussion_module.html @@ -1,5 +1,5 @@ <%include file="_underscore_templates.html" /> -
+
Show Discussion
diff --git a/lms/templates/discussion/mustache/_inline_discussion.mustache b/lms/templates/discussion/mustache/_inline_discussion.mustache index 8d55f9949b..14f23389c0 100644 --- a/lms/templates/discussion/mustache/_inline_discussion.mustache +++ b/lms/templates/discussion/mustache/_inline_discussion.mustache @@ -36,4 +36,7 @@ {{/threads}} + +
+
diff --git a/lms/templates/discussion/mustache/_pagination.mustache b/lms/templates/discussion/mustache/_pagination.mustache new file mode 100644 index 0000000000..95ff01d48d --- /dev/null +++ b/lms/templates/discussion/mustache/_pagination.mustache @@ -0,0 +1,32 @@ + +