1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
|
{% extends "manage.html" %}
{% load static %}
{% block title %} Lesson Video Stats {% endblock %}
{% block script %}
<script type="text/javascript" src="{% static 'yaksh/js/jquery.tablesorter.min.js' %}">
</script>
<script type="text/javascript">
$(document).ready(function() {
$.tablesorter.addWidget({
id: "numbering",
format: function(table) {
var c = table.config;
$("tr:visible", table.tBodies[0]).each(function(i) {
$(this).find('td').eq(0).text(i + 1);
});
}
});
$("#stats-table").tablesorter({
headers: {0: { sorter: false }}, widgets: ['numbering']
});
});
</script>
{% endblock %}
{% block content %}
<div class="container-fluid">
{% with objects.object_list as trackings %}
<center>
<h3>Statistics for {% with trackings|first as entry %} {{entry.lesson}} {% endwith %}</h3>
</center>
<a class="btn btn-primary" href="{% url 'yaksh:get_course_modules' course_id %}">
<i class="fa fa-arrow-left"></i> Back
</a>
<br><br>
{% include "yaksh/paginator.html" %}
<br>
<div class="row">
<div class="col" id='barDiv1'></div>
<div class="col" id="barDiv2"></div>
<div class="col" id="barDiv3"></div>
</div>
<script type="text/javascript">
var config = {responsive: true}
var data = [
{
x: ["Completed", "Not Completed"],
y: ["{{completion.0}}", "{{completion.1}}"],
type: 'bar'
}
];
var layout = {
title: "Number of completions (Out of {{visits.2}})",
xaxis: {title: 'Completion status'},
yaxis: {title: 'Count'},
width: 400,
height: 400,
};
Plotly.newPlot('barDiv1', data, layout, config);
var data = [
{
x: ["Visited", "Not Visited"],
y: ["{{visits.0}}", "{{visits.1}}"],
type: 'bar'
}
];
var layout = {
title: "Number of visits (Out of {{visits.2}})",
xaxis: {title: 'Visit status'},
yaxis: {title: 'Count'},
width: 400,
height: 400,
};
Plotly.newPlot('barDiv2', data, layout, config);
var x_data = ["0-25", "25-50", "50-75", "75-100"], y_data = [];
{% for i, j in percentage_data.items %}
y_data.push("{{j}}")
{% endfor %}
var data = [{x: x_data, y: y_data, type: 'bar'}];
var layout = {
title: "Range wise completion (Out of {{total}})",
xaxis: {title: 'Percentage Range'},
yaxis: {title: 'Count'},
width: 400,
height: 400,
};
Plotly.newPlot('barDiv3', data, layout, config);
</script>
<br>
<table class="table table-responsive" id="stats-table">
<thead>
<tr>
<th>Sr No.</th>
<th>Student Name <i class="fa fa-sort"></i></th>
<th>Last access on <i class="fa fa-sort"></i></th>
<th>Started on <i class="fa fa-sort"></i></th>
<th>Current Duration <i class="fa fa-sort"></i></th>
<th>Video Duration <i class="fa fa-sort"></i></th>
<th>Percentage Watched <i class="fa fa-sort"></i></th>
<th>Watched Once Completely <i class="fa fa-sort"></i></th>
<th>Total Time Spent <i class="fa fa-sort"></i></th>
<th>Total Visits <i class="fa fa-sort"></i></th>
</tr>
</thead>
{% for track in trackings %}
<tr>
<td>{{ forloop.counter0 }}</td>
<td>{{track.user.get_full_name}}</td>
<td>{{track.get_last_access_time}}</td>
<td>{{track.creation_time}}</td>
<td>{{track.get_current_time}}</td>
<td>{{track.get_video_duration}}</td>
<td>{{track.get_percentage_complete}} %</td>
<td>
{% with track.get_watched as watched %}
{% if watched %}
<span class="badge-pill badge-success">{{watched}}</span>
{% else %}
<span class="badge-pill badge-warning">{{watched}}</span>
{% endif %}
{% endwith %}
</td>
<td>{{track.time_spent}}</td>
<td>{{track.get_no_of_vists}}</td>
</tr>
{% endfor %}
</table>
{% endwith %}
<br>
{% include "yaksh/paginator.html" %}
</div>
{% endblock %}
|