Skip to content

2
2020-101
Commit 7bcf0851 authored by I.K Seneviratne's avatar I.K Seneviratne
Browse files
Options

Committing the implementation of the Gaze estimation period statistics in Lecturer Home Page

parent 0e91389b
Show whitespace changes
Inline Side-by-side
Showing with 266 additions and 2 deletions
FirstApp/admin.py
View file @ 7bcf0851
......@@ -12,3 +12,4 @@ admin.site.register(LecturerCredentials)
admin.site.register(FacultyTimetable)
admin.site.register(LectureVideo)
admin.site.register(LectureActivity)
admin.site.register(LectureGazeEstimation)
\ No newline at end of file
FirstApp/api.py
View file @ 7bcf0851
......@@ -668,10 +668,15 @@ class GetStudentBehaviorSummaryForPeriod(APIView):
isRecordFound = False
activity_percentages = {}
emotion_percentages = {}
gaze_estimation_percentages = {}
individual_lec_activties = []
individual_lec_emotions = []
individual_lec_gaze_estimations = []
activity_labels = []
emotion_labels = []
gaze_estimation_labels = []
current_date = datetime.datetime.now().date()
......@@ -705,13 +710,29 @@ class GetStudentBehaviorSummaryForPeriod(APIView):
emotion_percentages, individual_lec_emotions, emotion_labels = ed.get_student_emotion_summary_for_period(emotion_data)
# retrieving lecture gaze estimations
lec_gaze_estimation = LectureGazeEstimation.objects.filter(
lecture_video_id__date__gte=previous_date,
lecture_video_id__date__lte=current_date,
lecture_video_id__lecturer=lecturer
)
# if there are gaze estimation data
if len(lec_gaze_estimation) > 0:
gaze_estimation_serializer = LectureGazeEstimationSerializer(lec_gaze_estimation, many=True)
gaze_estimation_data = gaze_estimation_serializer.data
gaze_estimation_percentages, individual_lec_gaze_estimations, gaze_estimation_labels = hge.get_student_gaze_estimation_summary_for_period(gaze_estimation_data)
return Response({
"activity_response": activity_percentages,
"emotion_response": emotion_percentages,
"gaze_estimation_response": gaze_estimation_percentages,
"individual_activities": individual_lec_activties,
"individual_emotions": individual_lec_emotions,
"individual_gaze_estimations": individual_lec_gaze_estimations,
"activity_labels": activity_labels,
"emotion_labels": emotion_labels,
"gaze_estimation_labels": gaze_estimation_labels,
"isRecordFound": isRecordFound
})
FirstApp/logic/head_gaze_estimation.py
View file @ 7bcf0851
......@@ -555,3 +555,57 @@ def get_lecture_gaze_esrimation_for_frames(video_name):
return frame_detections, frame_rate
def get_student_gaze_estimation_summary_for_period(gaze_estimation_data):
# declare variables to add percentage values
phone_checking_perct_combined = 0.0
listening_perct_combined = 0.0
note_taking_perct_combined = 0.0
looking_up_right_perct_combined = 0.0
looking_up_left_perct_combined = 0.0
looking_down_right_perct_combined = 0.0
looking_down_left_perct_combined = 0.0
looking_front_perct_combined = 0.0
# get the number of activties to calculate average
no_of_gaze_estimations = len(gaze_estimation_data)
individual_lec_gaze_estimations = []
gaze_estimation_labels = ["looking_up_and_right_perct", "looking_up_and_left_perct", "looking_down_and_right_perct", "looking_down_and_left_perct", "looking_front_perct"]
# iterate through the activities
for gaze_estimation in gaze_estimation_data:
individual_gaze_estimation = {}
individual_gaze_estimation["looking_up_and_right_perct"] = float(gaze_estimation['looking_up_and_right_perct'])
individual_gaze_estimation["looking_up_and_left_perct"] = float(gaze_estimation['looking_up_and_left_perct'])
individual_gaze_estimation["looking_down_and_right_perct"] = float(gaze_estimation['looking_down_and_right_perct'])
individual_gaze_estimation["looking_down_and_left_perct"] = float(gaze_estimation['looking_down_and_left_perct'])
individual_gaze_estimation["looking_front_perct"] = float(gaze_estimation['looking_front_perct'])
looking_up_right_perct_combined += float(gaze_estimation['looking_up_and_right_perct'])
looking_up_left_perct_combined += float(gaze_estimation['looking_up_and_left_perct'])
looking_down_right_perct_combined += float(gaze_estimation['looking_down_and_right_perct'])
looking_down_left_perct_combined += float(gaze_estimation['looking_down_and_left_perct'])
looking_front_perct_combined += float(gaze_estimation['looking_front_perct'])
# append to the list
individual_lec_gaze_estimations.append(individual_gaze_estimation)
# calculate the average percentages
looking_up_right_average_perct = round((looking_up_right_perct_combined / no_of_gaze_estimations), 1)
looking_up_left_perct = round((looking_up_left_perct_combined / no_of_gaze_estimations), 1)
looking_down_right_average_perct = round((looking_down_right_perct_combined / no_of_gaze_estimations), 1)
looking_down_left_average_perct = round((looking_down_left_perct_combined / no_of_gaze_estimations), 1)
looking_front_average_perct = round((looking_front_perct_combined / no_of_gaze_estimations), 1)
percentages = {}
percentages["looking_up_and_right_perct"] = looking_up_right_average_perct
percentages["looking_up_and_left_perct"] = looking_up_left_perct_combined
percentages["looking_down_and_right_perct"] = looking_down_right_perct_combined
percentages["looking_down_and_left_perct"] = looking_down_left_perct_combined
percentages["looking_front_perct"] = looking_front_average_perct
return percentages, individual_lec_gaze_estimations, gaze_estimation_labels
\ No newline at end of file
FirstApp/templates/FirstApp/Home.html
View file @ 7bcf0851
......@@ -509,6 +509,84 @@
chart.render();
}
//this function render the chart for Emotion statistics
function renderGazeEstimationStatistics() {
let individual_gaze_estimations = student_behavior_summary.individual_gaze_estimations;
let gaze_estimation_labels = student_behavior_summary.gaze_estimation_labels;
let gaze_estimation_length = individual_gaze_estimations.length;
let label_length = gaze_estimation_labels.length;
let data = [];
let colors = [
"#000000",
"#00FF00",
"#0000FF"
];
for (let i = 0; i < label_length; i++) {
let label = gaze_estimation_labels[i];
let datapoints = [];
for (let j = 0; j < gaze_estimation_length; j++) {
let gaze_estimation = individual_gaze_estimations[j];
datapoints.push({label: "lecture " + (j+1), y: gaze_estimation[label]});
}
let obj = {
type: "line",
showInLegend: true,
name: label,
markerType: "square",
{#xValueFormatString: "DD MMM, YYYY",#}
xValueFormatString: "Lec " + (i+1),
color: colors[i - 1],
dataPoints: datapoints
};
data.push(obj);
}
var chart = new CanvasJS.Chart("gaze_estimation_stats_chart", {
animationEnabled: true,
theme: "light2",
title: {
text: "Gaze Estimation Statistics"
},
axisX: {
title: "Lecture",
{#valueFormatString: "DD MMM",#}
valueFormatString: "lec" ,
crosshair: {
enabled: true,
snapToDataPoint: true
}
},
axisY: {
title: "Percentage",
includeZero: true,
crosshair: {
enabled: true
}
},
toolTip: {
shared: true
},
legend: {
cursor: "pointer",
verticalAlign: "bottom",
horizontalAlign: "center",
{#dockInsidePlotArea: true,#}
itemclick: toogleDataSeries
},
data: data
});
chart.render();
}
//this function will toggle the content
function toogleDataSeries(e) {
if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
......@@ -568,6 +646,13 @@
$('#surprise_perct_for_period').text(out.emotion_response.surprise_perct);
$('#neutral_perct_for_period').text(out.emotion_response.neutral_perct);
//assign the gaze estimation values
$('#looking_up_right_perct_for_period').text(out.gaze_estimation_response.looking_up_and_right_perct);
$('#looking_up_left_perct_for_period').text(out.gaze_estimation_response.looking_up_and_left_perct);
$('#looking_down_right_perct_for_period').text(out.gaze_estimation_response.looking_down_and_right_perct);
$('#looking_down_left_perct_for_period').text(out.gaze_estimation_response.looking_down_and_left_perct);
$('#looking_front_perct_for_period').text(out.gaze_estimation_response.looking_front_perct);
} else {
$('#student_summary_not_found_message').attr('hidden', false);
}
......@@ -600,6 +685,16 @@
});
//this function will view emotion statistics
$('#view_gaze_estimation_stats').click(function () {
//render the chart
renderGazeEstimationStatistics();
//open the modal
$('#gaze_estimation_stats_modal').modal();
});
//this function will generate random colors
function getRandomColor() {
var letters = '0123456789ABCDEF';
......@@ -916,9 +1011,79 @@
<!-- end of Emotion card -->
<!-- Gaze estimation card -->
<div class="card shadow-lg mb-2">
<div class="card-body">
<!-- put the heading -->
<div class="text-center mt-2">
<h4 class="font-weight-bold">Gaze estimation</h4>
</div>
<!-- percentages -->
<div class="text-center">
<!-- gaze estimation table -->
<table class="table table-borderless table-striped">
<tbody>
<tr>
<td>
Looking up and right
<hr style="height: 5px">
</td>
<td id="looking_up_right_perct_for_period"></td>
</tr>
<tr>
<td>
Looking up and left
<hr style="height: 5px">
</td>
<td id="looking_up_left_perct_for_period"></td>
</tr>
<tr>
<td>
Looking down and right
<hr style="height: 5px">
</td>
<td id="looking_down_right_perct_for_period"></td>
</tr>
<tr>
<td>
Looking down and left
<hr style="height: 5px">
</td>
<td id="looking_down_left_perct_for_period"></td>
</tr>
<tr>
<td>
Looking front
<hr style="height: 5px">
</td>
<td id="looking_front_perct_for_period"></td>
</tr>
</tbody>
</table>
<!-- end of gaze estimation table -->
</div>
<!-- end of percentages -->
<!-- stats button -->
<div class="float-right">
<button type="button" class="btn btn-primary"
id="view_gaze_estimation_stats">
<i class="fa fa-line-chart"></i>
View stats
</button>
</div>
<!-- end of stats button -->
</div>
</div>
<!-- end of Gaze estimation card -->
</div>
<!-- end of student behavior summary -->
<!-- a vertical list displaying the student engagement categories -->
<ul class="list-group" id="progress_areas" hidden>
<li class="list-group-item border">
......@@ -1469,6 +1634,29 @@
<!-- end of activity statistics modal -->
<!-- gaze estimation Modal-->
<div class="modal fade" id="gaze_estimation_stats_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document" style="max-width: 1400px">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Gaze estimation Statistics</h5>
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body text-center">
<div id="gaze_estimation_stats_chart" style="height: 370px; width: 100%"></div>
</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
<!-- end of activity statistics modal -->
{% endblock %}
<!--scripts-->
{% block 'scripts' %}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment