[SE-4473] Add progress bar views

completion_aggregator/templates/chapter_completion_progress_bar.html

@@ -0,0 +1,4 @@
+<div id="chapter-progress-wrapper" style="display: flex;">
+    <label for="chapter-progress-bar" style="padding-right: 10px;">Chapter progress:</label>
+    <div id="chapter-progress-bar" style="background-color: blue; width: {{chapter_completion_percentage}}%">&nbsp;</div>
+</div>

completion_aggregator/templates/completion_progress_bar.html

@@ -0,0 +1,4 @@
+<div id="progress-wrapper">
+    <label for="progress-bar">Course progress:</label>
+    <progress id="progress-bar" value="{{completion_percentage}}" max="100"> {{completion_percentage}}% </progress>
+</div>

completion_aggregator/urls.py

@@ -5,10 +5,11 @@
 from __future__ import absolute_import, division, print_function, unicode_literals
 
 from django.conf.urls import include, url
-from django.views.generic import TemplateView
+from . import views
 
 urlpatterns = [
     url(r'^v1/', include('completion_aggregator.api.v1.urls', namespace='completion_api_v1')),
     url(r'^v0/', include('completion_aggregator.api.v0.urls', namespace='completion_api_v0')),
-    url(r'^$', TemplateView.as_view(template_name="completion_aggregator/base.html")),
+    url(r'^progress_bar/(?P<course_key>[\w.@+:-]+)/$', views.CompletionProgressBarView.as_view(), name="completion-progress-bar"),
+    url(r'^progress_bar/(?P<course_key>[\w.@+:-]+)/(?P<chapter_id>.+)/$', views.CompletionProgressBarView.as_view(), name="completion-progress-bar"),
 ]

completion_aggregator/views.py

@@ -0,0 +1,54 @@
+"""
+completion_aggregator App progress bar view
+"""
+from __future__ import absolute_import, unicode_literals
+
+from django.conf import settings
+from django.contrib.auth.mixins import LoginRequiredMixin
+from django.shortcuts import render
+from django.views.decorators.clickjacking import xframe_options_exempt
+from django.views.generic import TemplateView
+from xblockutils.resources import ResourceLoader
+
+from .api.v1.views import CompletionDetailView
+
+loader = ResourceLoader(__name__)
+
+
+class CompletionProgressBarView(LoginRequiredMixin, TemplateView):
+    """
+    View to display the progress bar of a student in a course
+    """
+    @xframe_options_exempt
+    def get(self, request, course_key, chapter_id=None):
+        """
+        Fetch progress and render the template.
+        """
+        username = request.user.username
+        completion_percentage = 0
+        if chapter_id is not None:
+            new_req = request.GET.copy()
+            new_req['requested_fields'] = "chapter"
+            request.GET = new_req
+        completion_resp = CompletionDetailView.as_view()(request, course_key).data
+        if completion_resp:
+            results = completion_resp.get('results')
+            for user_completion_dict in results:
+                if user_completion_dict.get('username') == username:
+                    if chapter_id is not None:
+                        chapters = user_completion_dict['chapter']
+                        for chapter in chapters:
+                            block_id = chapter['block_key'].split('@')[-1]
+                            if block_id == chapter_id:
+                                completion_percentage = float(chapter['completion']['percent']) * 100
+                    else:
+                        completion_percentage = float(user_completion_dict['completion']['percent']) * 100
+
+        if chapter_id is not None:
+            return render(request, 'chapter_completion_progress_bar.html', {
+                'chapter_completion_percentage': completion_percentage,
+            })
+        else:
+            return render(request, 'completion_progress_bar.html', {
+                'completion_percentage': completion_percentage,
+            })