Paging wip

lms/djangoapps/django_comment_client/forum/views.py

@@ -22,7 +22,7 @@ import django_comment_client.utils as utils
 import comment_client as cc
 import xml.sax.saxutils as saxutils
 
-THREADS_PER_PAGE = 200
+THREADS_PER_PAGE = 2
 INLINE_THREADS_PER_PAGE = 5
 PAGES_NEARBY_DELTA = 2
 escapedict = {'"': '"'}
@@ -224,6 +224,7 @@ def forum_form_discussion(request, course_id):
             #'trending_tags': trending_tags,
             'staff_access' : has_access(request.user, course, 'staff'),
             'threads': saxutils.escape(json.dumps(threads),escapedict),
+            'thread_pages': query_params['num_pages'],
             'user_info': saxutils.escape(json.dumps(user_info),escapedict),
             'annotated_content_info': saxutils.escape(json.dumps(annotated_content_info),escapedict),
             'course_id': course.id,

lms/static/coffee/src/discussion/discussion.coffee

@@ -2,7 +2,9 @@ if Backbone?
   class @Discussion extends Backbone.Collection
     model: Thread
 
-    initialize: ->
+    initialize: (models, options)->
+      @pages = options['pages'] || 1
+      @current_page = 1
       @bind "add", (item) =>
         item.discussion = @
       @comparator = @sortByDateRecentFirst
@@ -12,12 +14,30 @@ if Backbone?
     find: (id) ->
       _.first @where(id: id)
 
+    hasMorePages: ->
+      @current_page < @pages
+
     addThread: (thread, options) ->
       options ||= {}
       model = new Thread thread
       @add model
       model
 
+    retrieveAnotherPage: ->
+      @current_page += 1
+      url = DiscussionUtil.urlFor 'threads'
+      data = { page: @current_page }
+      DiscussionUtil.safeAjax
+        $elem: @$el
+        url: url
+        data: data
+        dataType: 'json'
+        success: (response, textStatus) =>
+          models = @models
+          new_threads = [new Thread(data) for data in response.discussion_data][0]
+          new_collection = _.union(models, new_threads)
+          @reset new_collection
+
     sortByDate: (thread) ->
       thread.get("created_at")
 

lms/static/coffee/src/discussion/main.coffee

@@ -7,10 +7,11 @@ if Backbone?
       window.$$course_id = element.data("course-id")
       user_info = element.data("user-info")
       threads = element.data("threads")
+      thread_pages = element.data("thread-pages")
       content_info = element.data("content-info")
       window.user = new DiscussionUser(user_info)
       Content.loadContentInfos(content_info)
-      discussion = new Discussion(threads)
+      discussion = new Discussion(threads, pages: thread_pages)
       new DiscussionRouter({discussion: discussion})
       Backbone.history.start({pushState: true, root: "/courses/#{$$course_id}/discussion/forum/"})
   DiscussionProfileApp =

lms/static/coffee/src/discussion/utils.coffee

@@ -66,6 +66,7 @@ class @DiscussionUtil
       permanent_link_thread   : "/courses/#{$$course_id}/discussion/forum/#{param}/threads/#{param1}"
       permanent_link_comment  : "/courses/#{$$course_id}/discussion/forum/#{param}/threads/#{param1}##{param2}"
       user_profile            : "/courses/#{$$course_id}/discussion/forum/users/#{param}"
+      threads                 : "/courses/#{$$course_id}/discussion/forum"
     }[name]
 
   @safeAjax: (params) ->

lms/static/coffee/src/discussion/views/discussion_thread_list_view.coffee

@@ -7,11 +7,20 @@ if Backbone?
       "click .sort-bar a": "sortThreads"
       "click .browse-topic-drop-menu": "filterTopic"
       "click .browse-topic-drop-search-input": "ignoreClick"
-      "click .post-list a": "threadSelected"
+      "click .post-list .list-item a": "threadSelected"
+      "click .post-list .more-pages a": "loadMorePages"
 
     initialize: ->
-      @displayedCollection = new Discussion(@collection.models)
+      @displayedCollection = new Discussion(@collection.models, pages: @collection.pages)
       @collection.on "change", @reloadDisplayedCollection
+      @collection.on "reset", (discussion) =>
+        board = $(".current-board").html()
+        @displayedCollection.current_page = discussion.current_page
+        @displayedCollection.reset discussion.models
+        # TODO: filter correctly
+        # target = _.filter($("a.topic:contains('#{board}')"), (el) -> el.innerText == "General" || el.innerHTML == "General")
+        # if target.length > 0
+        #   @filterTopic($.Event("filter", {'target': target[0]}))
       @collection.on "add", @addAndSelectThread
       @sidebar_padding = 10
       @sidebar_header_height = 87
@@ -96,11 +105,21 @@ if Backbone?
       for thread in @displayedCollection.models
         content = @renderThread(thread)
         rendered.append content
-        content.wrap("<li data-id='#{thread.get('id')}' />")
+        content.wrap("<li class='list-item' data-id='#{thread.get('id')}' />")
 
       @$(".post-list").html(rendered.html())
+      @renderMorePages()
       @trigger "threads:rendered"
 
+    renderMorePages: ->
+      if @displayedCollection.hasMorePages()
+        @$(".post-list").append("<li class='more-pages'><a href='#'>Load more</a></li>")
+
+    loadMorePages: ->
+      @$(".more-pages").html('<div class="loading-animation"></div>')
+      @$(".more-pages").addClass("loading")
+      @collection.retrieveAnotherPage()
+
     renderThread: (thread) =>
       content = $(_.template($("#thread-list-item-template").html())(thread.toJSON()))
       if thread.get('subscribed')

lms/templates/discussion/index.html

@@ -23,7 +23,7 @@
 
 <script type="text/javascript" src="${static.url('js/discussions-temp.js')}"></script>
 
-<section class="discussion container" id="discussion-container" data-roles="${roles}" data-course-id="${course_id}" data-user-info="${user_info}" data-threads="${threads}">
+<section class="discussion container" id="discussion-container" data-roles="${roles}" data-course-id="${course_id}" data-user-info="${user_info}" data-threads="${threads}" data-thread-pages="${thread_pages}">
     <div class="discussion-body">
         <div class="sidebar"></div>
         <div class="discussion-column">