{% extends "base-mobile.html" %} 
{% load i18n %} 
{% load display_functions %} 
{% block extra_scripts %}
	<script type="text/javascript" src="{{ STATIC_URL }}oppia/js/jquery-1.10.2.min.js"></script>
	<script type="text/javascript" src="{{ STATIC_URL }}oppia/js/jquery-ui-1.10.3.custom.min.js"></script>
		<script type="text/javascript">
		function load(url){
			window.location.href = url + "?username={{ user.username }}&api_key={{ user.key }}";
		}
	</script>
{% endblock extra_scripts %}

{% block content %}
<h2>{{ cohort.course.title|title_lang:LANGUAGE_CODE }}<br/>{{ cohort.description }}</h2>

{% if participants %}
<div id="monitormenu">
	<ul>
		<li><a onclick="load('{% url 'oppia_monitor_cohort_recent' cohort.id %}');"> {% trans 'Recent' %}</a></li>
		<li><a onclick="load('{% url 'oppia_monitor_cohort_overall' cohort.id %}');">{% trans 'Overall' %}</a></li>
		<li><a onclick="load('{% url 'oppia_monitor_cohort_quizzes' cohort.id %}');">{% trans 'Quizzes' %}</a></li>
	</ul>
</div>

{% blocktrans %}<p>Activity in the last 14 days:</p>{% endblocktrans %}
	<div class="listheader">
		<div class="listname">{% trans 'Student' %}</div>
		<div class="listcell">{% trans 'Media' %}</div>
		<div class="listcell">{% trans 'Quiz' %}</div>
		<div class="listcell">{% trans 'Activities' %}</div>
		<div style='clear:both'></div>
	</div>
	{% for p in participants %}
		<div class="list">
			<div class="listname">{{ p.user.first_name }} {{ p.user.last_name }}</div>
			<div class="listcell">{{ p.media.views }}</div>
			<div class="listcell">{{ p.quiz.views }}</div>
			<div class="listcell">{{ p.acts.views }}</div>
			<div style='clear:both'></div>
		</div>
	{% endfor %}
{% else %}
	{% blocktrans %}<p>There are no students in this cohort.</p>{% endblocktrans %}
{% endif %}

{% endblock %}